@ikas/storefront 4.0.0-alpha.50 → 4.0.0-alpha.52

package/src/models/data/theme-json/component/prop/index.ts

@@ -1,55 +0,0 @@
-import {
-  IkasProductAttributeType,
-  IkasThemeJsonComponentPropType,
-  IkasThemeJsonSliderData,
-} from "@ikas/storefront-models";
-import { makeAutoObservable } from "mobx";
-import { IkasThemeJsonComponentProp as IThemeJsonComponentProp } from "@ikas/storefront-models";
-
-export class IkasThemeJsonComponentProp implements IThemeJsonComponentProp {
-  id: string;
-  name: string;
-  displayName: string;
-  description: string;
-  type: IkasThemeJsonComponentPropType;
-  isRequired: boolean;
-  customDataId?: string | null;
-  requiredPropId?: string;
-  requiredEnumOptionId?: string;
-  requiredEnumOptionValue?: string;
-  attributeTypes?: IkasProductAttributeType[] | null;
-  sliderData: IkasThemeJsonSliderData;
-  translations: {
-    [locale: string]: PropTranslation;
-  } = {};
-
-  constructor(data: Partial<IkasThemeJsonComponentProp>) {
-    this.id = data.id || Date.now() + "";
-    this.name = data.name || "";
-    this.displayName = data.displayName || "";
-    this.description = data.description || "";
-    this.type = data.type || IkasThemeJsonComponentPropType.TEXT;
-    this.isRequired = data.isRequired || false;
-    this.customDataId = data.customDataId || null;
-    this.requiredPropId = data.requiredPropId;
-    this.requiredEnumOptionId = data.requiredEnumOptionId;
-    this.requiredEnumOptionValue = data.requiredEnumOptionValue;
-    this.attributeTypes = data.attributeTypes || null;
-    this.sliderData = data.sliderData || ({} as IkasThemeJsonSliderData);
-    this.translations = data.translations || {};
-
-    makeAutoObservable(this);
-  }
-}
-
-export { IkasThemeJsonComponentPropType };
-
-class PropTranslation {
-  displayName: string | null;
-  description: string | null;
-
-  constructor(data: Partial<PropTranslation> = {}) {
-    this.description = data.description || null;
-    this.displayName = data.displayName || null;
-  }
-}

package/src/models/data/theme-json/custom-data/index.ts

@@ -1,132 +0,0 @@
-import { IkasProductAttributeType } from "../../../data/product/attribute";
-import { makeAutoObservable } from "mobx";
-import _flatten from "lodash/flatten";
-import {
-  IkasThemeJsonComponentPropType,
-  IkasThemeJsonSliderData,
-  IkasThemeJsonCustomData as IThemeJsonCustomData,
-  IkasThemeJsonEnumOption as IThemeJsonEnumOption,
-  IkasThemeJsonCustomDataTranslation as IThemeJsonCustomDataTranslation,
-  IkasThemeJsonCustomDataEnumOptionTranslation as IThemeJsonCustomDataEnumOptionTranslation,
-} from "@ikas/storefront-models";
-
-export class IkasThemeJsonCustomData implements IThemeJsonCustomData {
-  id: string;
-  name?: string | null;
-  description?: string | null;
-  typescriptName?: string | null;
-  type: IkasThemeJsonComponentPropType;
-  isRequired: boolean;
-  translations: {
-    [locale: string]: IkasThemeJsonCustomDataTranslation;
-  } = {};
-
-  key?: string | null;
-  nestedData?: IkasThemeJsonCustomData[] | null;
-  itemCount?: number | null; // for static lists
-  attributeTypes?: IkasProductAttributeType[] | null;
-  enumOptions?: IkasThemeJsonEnumOption[] | null;
-  customDataId?: string | null = null;
-  sliderData: IkasThemeJsonSliderData;
-
-  isRoot: boolean;
-  parent?: IkasThemeJsonCustomData | null;
-
-  constructor(data: Partial<IkasThemeJsonCustomData> = {}) {
-    this.id = data.id || "";
-    this.name = data.name || null;
-    this.description = data.description || null;
-    this.typescriptName = data.name || null;
-    this.type = data.type || IkasThemeJsonComponentPropType.TEXT;
-    this.isRequired = data.isRequired !== undefined ? data.isRequired : true;
-    this.translations = data.translations || {};
-    this.key = data.key || null;
-    this.parent = data.parent || null;
-    this.itemCount = data.itemCount || null;
-    this.attributeTypes = data.attributeTypes || null;
-    this.enumOptions =
-      data.enumOptions?.map((eo) => new IkasThemeJsonEnumOption(eo)) || null;
-    this.customDataId = data.customDataId || null;
-    this.sliderData = data.sliderData || ({} as IkasThemeJsonSliderData);
-    this.isRoot = data.isRoot || false;
-    this.nestedData = data.nestedData
-      ? data.nestedData.map(
-          (nd) =>
-            new IkasThemeJsonCustomData({
-              ...nd,
-              parent: this,
-            })
-        )
-      : null;
-
-    if (
-      this.type === IkasThemeJsonComponentPropType.STATIC_LIST &&
-      !this.itemCount
-    )
-      this.itemCount = 1;
-
-    makeAutoObservable(this);
-  }
-
-  get flat(): IkasThemeJsonCustomData[] {
-    if (!this.nestedData || !this.nestedData.length) return [this];
-
-    const nestedFlat = _flatten(this.nestedData.map((nd) => nd.flat));
-
-    let list: IkasThemeJsonCustomData[] = [];
-    list.push(this);
-    list = list.concat(nestedFlat);
-
-    return list;
-  }
-
-  toJSON() {
-    const obj = {
-      ...this,
-    };
-    delete obj.parent;
-    return obj;
-  }
-}
-
-export class IkasThemeJsonEnumOption implements IThemeJsonEnumOption {
-  id: string;
-  displayName: string;
-  value: string;
-  translations: {
-    [locale: string]: IkasThemeJsonCustomDataEnumOptionTranslation;
-  } = {};
-
-  constructor(data: Partial<IkasThemeJsonEnumOption> = {}) {
-    this.id = data.id || "";
-    this.displayName = data.displayName || "";
-    this.value = data.value || "";
-    this.translations = data.translations || {};
-
-    makeAutoObservable(this);
-  }
-}
-
-export class IkasThemeJsonCustomDataTranslation
-  implements IThemeJsonCustomDataTranslation
-{
-  name: string | null;
-  description: string | null;
-
-  constructor(data: Partial<IkasThemeJsonCustomDataTranslation> = {}) {
-    this.name = data.name || null;
-    this.description = data.description || null;
-  }
-}
-
-export class IkasThemeJsonCustomDataEnumOptionTranslation
-  implements IThemeJsonCustomDataEnumOptionTranslation
-{
-  displayName: string | null;
-
-  constructor(
-    data: Partial<IkasThemeJsonCustomDataEnumOptionTranslation> = {}
-  ) {
-    this.displayName = data.displayName || null;
-  }
-}

package/src/models/data/theme-json/index.ts

@@ -1,210 +0,0 @@
-import { makeAutoObservable } from "mobx";
-import { IkasThemeJsonComponent } from "./component";
-import {
-  IkasThemeJsonComponentProp,
-  IkasThemeJsonComponentPropType,
-} from "./component/prop";
-import { IkasThemeJsonCustomData } from "./custom-data";
-import { IkasThemeJsonPage, IkasThemeJsonPageType } from "./page";
-import { IkasThemeJsonPageComponent } from "./page/component";
-import { IkasThemeJsonSettings } from "./settings";
-
-export const CHECKOUT_ID = "checkout";
-
-export class IkasThemeJson {
-  name: string;
-  components: IkasThemeJsonComponent[];
-  pages: IkasThemeJsonPage[];
-  settings: IkasThemeJsonSettings;
-  customData: IkasThemeJsonCustomData[];
-
-  constructor(data: Partial<IkasThemeJson> = {}) {
-    this.name = data.name || "";
-    this.components = data.components
-      ? data.components.map((c) => new IkasThemeJsonComponent(c))
-      : [];
-    this.pages = data.pages
-      ? data.pages.map((p) => new IkasThemeJsonPage(p))
-      : [];
-    this.settings = data.settings
-      ? new IkasThemeJsonSettings(data.settings)
-      : new IkasThemeJsonSettings();
-    this.customData = data.customData
-      ? data.customData?.map((cd) => new IkasThemeJsonCustomData(cd))
-      : [];
-
-    this.createCheckoutData();
-
-    makeAutoObservable(this);
-  }
-
-  get headerComponent() {
-    return this.components.find((c) => c.isHeader);
-  }
-
-  get footerComponent() {
-    return this.components.find((c) => c.isFooter);
-  }
-
-  private createCheckoutData() {
-    let currentCheckoutComponent = this.components.find(
-      (c) => c.id === CHECKOUT_ID
-    );
-    const currentCheckoutPage = this.pages.find((p) => p.id === CHECKOUT_ID);
-
-    if (!currentCheckoutComponent) {
-      currentCheckoutComponent = new IkasThemeJsonComponent({
-        id: CHECKOUT_ID,
-        dir: "",
-        displayName: "",
-        props: [
-          new IkasThemeJsonComponentProp({
-            name: "showTax",
-            isRequired: false,
-            type: IkasThemeJsonComponentPropType.BOOLEAN,
-          }),
-          new IkasThemeJsonComponentProp({
-            name: "buttonBgColor",
-            isRequired: false,
-            type: IkasThemeJsonComponentPropType.COLOR,
-          }),
-          new IkasThemeJsonComponentProp({
-            name: "buttonTextColor",
-            isRequired: false,
-            type: IkasThemeJsonComponentPropType.COLOR,
-          }),
-          new IkasThemeJsonComponentProp({
-            name: "buttonDisabledBgColor",
-            isRequired: false,
-            type: IkasThemeJsonComponentPropType.COLOR,
-          }),
-          new IkasThemeJsonComponentProp({
-            name: "buttonDisabledTextColor",
-            isRequired: false,
-            type: IkasThemeJsonComponentPropType.COLOR,
-          }),
-
-          new IkasThemeJsonComponentProp({
-            name: "primaryTextColor",
-            isRequired: false,
-            type: IkasThemeJsonComponentPropType.COLOR,
-          }),
-          new IkasThemeJsonComponentProp({
-            name: "secondaryTextColor",
-            isRequired: false,
-            type: IkasThemeJsonComponentPropType.COLOR,
-          }),
-
-          new IkasThemeJsonComponentProp({
-            name: "primaryBgColor",
-            isRequired: false,
-            type: IkasThemeJsonComponentPropType.COLOR,
-          }),
-          new IkasThemeJsonComponentProp({
-            name: "secondaryBgColor",
-            isRequired: false,
-            type: IkasThemeJsonComponentPropType.COLOR,
-          }),
-          new IkasThemeJsonComponentProp({
-            name: "borderColor",
-            isRequired: false,
-            type: IkasThemeJsonComponentPropType.COLOR,
-          }),
-          new IkasThemeJsonComponentProp({
-            name: "cardBgColor",
-            isRequired: false,
-            type: IkasThemeJsonComponentPropType.COLOR,
-          }),
-
-          new IkasThemeJsonComponentProp({
-            name: "errorColor",
-            isRequired: false,
-            type: IkasThemeJsonComponentPropType.COLOR,
-          }),
-          new IkasThemeJsonComponentProp({
-            name: "errorLightColor",
-            isRequired: false,
-            type: IkasThemeJsonComponentPropType.COLOR,
-          }),
-          new IkasThemeJsonComponentProp({
-            name: "warningColor",
-            isRequired: false,
-            type: IkasThemeJsonComponentPropType.COLOR,
-          }),
-          new IkasThemeJsonComponentProp({
-            name: "warningLightColor",
-            isRequired: false,
-            type: IkasThemeJsonComponentPropType.COLOR,
-          }),
-          new IkasThemeJsonComponentProp({
-            name: "successColor",
-            isRequired: false,
-            type: IkasThemeJsonComponentPropType.COLOR,
-          }),
-          new IkasThemeJsonComponentProp({
-            name: "successLightColor",
-            isRequired: false,
-            type: IkasThemeJsonComponentPropType.COLOR,
-          }),
-        ],
-      });
-      this.components.push(currentCheckoutComponent);
-    }
-
-    if (!currentCheckoutPage) {
-      this.pages.push(
-        new IkasThemeJsonPage({
-          id: CHECKOUT_ID,
-          type: IkasThemeJsonPageType.CHECKOUT,
-          components: [
-            new IkasThemeJsonPageComponent({
-              componentId: currentCheckoutComponent.id,
-              propValues: {
-                showTax: true,
-                buttonBgColor: CHECKOUT_BUTTON_BG_COLOR,
-                buttonTextColor: CHECKOUT_BUTTON_TEXT_COLOR,
-                buttonDisabledBgColor: CHECKOUT_BUTTON_DISABLED_BG_COLOR,
-                buttonDisabledTextColor: CHECKOUT_BUTTON_DISABLED_TEXT_COLOR,
-
-                primaryTextColor: CHECKOUT_PRIMARY_TEXT_COLOR,
-                secondaryTextColor: CHECKOUT_SECONDARY_TEXT_COLOR,
-
-                primaryBgColor: CHECKOUT_PRIMARY_BG_COLOR,
-                secondaryBgColor: CHECKOUT_SECONDARY_BG_COLOR,
-                borderColor: CHECKOUT_BORDER_COLOR,
-                cardBgColor: CHECKOUT_CARD_BG_COLOR,
-
-                errorColor: CHECKOUT_ERROR_COLOR,
-                errorLightColor: CHECKOUT_ERROR_LIGHT_COLOR,
-                warningColor: CHECKOUT_WARNING_COLOR,
-                warningLightColor: CHECKOUT_WARNING_LIGHT_COLOR,
-                successColor: CHECKOUT_SUCCESS_COLOR,
-                successLightColor: CHECKOUT_SUCCESS_LIGHT_COLOR,
-              },
-            }),
-          ],
-        })
-      );
-    }
-  }
-}
-
-const CHECKOUT_BUTTON_BG_COLOR = "#272727";
-const CHECKOUT_BUTTON_TEXT_COLOR = "#FFFFFF";
-const CHECKOUT_BUTTON_DISABLED_BG_COLOR = "#F7F7F9";
-const CHECKOUT_BUTTON_DISABLED_TEXT_COLOR = "#8A8B94";
-
-const CHECKOUT_PRIMARY_TEXT_COLOR = "#272727";
-const CHECKOUT_SECONDARY_TEXT_COLOR = "#8A8B94";
-
-const CHECKOUT_PRIMARY_BG_COLOR = "#FFFFFF";
-const CHECKOUT_SECONDARY_BG_COLOR = "#F7F7F9";
-const CHECKOUT_BORDER_COLOR = "#E5E4E9";
-const CHECKOUT_CARD_BG_COLOR = "#F7F7F9";
-
-const CHECKOUT_ERROR_COLOR = "#FB4E4E";
-const CHECKOUT_ERROR_LIGHT_COLOR = "#FCF3F4";
-const CHECKOUT_WARNING_COLOR = "#FFBC1F";
-const CHECKOUT_WARNING_LIGHT_COLOR = "#FFFAEE";
-const CHECKOUT_SUCCESS_COLOR = "#2DCA73";
-const CHECKOUT_SUCCESS_LIGHT_COLOR = "#F6FFED";

package/src/models/data/theme-json/page/component/index.ts

@@ -1,22 +0,0 @@
-import { makeAutoObservable } from "mobx";
-import { IkasThemeJsonPageComponent as IThemeJsonPageComponent } from "@ikas/storefront-models";
-
-export class IkasThemeJsonPageComponent implements IThemeJsonPageComponent {
-  id: string;
-  componentId: string;
-
-  // Prop value for a component can either be exact values to pass to the component,
-  // or it can be a data to derive the actual value the component needs
-  // key: propName
-  // e.g for a "Text" prop ---------> text: "TextValue"
-  // e.g for a "ProductList" prop --> productList: ProductListPropValue
-  propValues: Record<string, any>;
-
-  constructor(data: Partial<IkasThemeJsonPageComponent>) {
-    this.id = data.id || "";
-    this.componentId = data.componentId || "";
-    this.propValues = data.propValues || {};
-
-    makeAutoObservable(this);
-  }
-}

package/src/models/data/theme-json/page/index.ts

@@ -1,54 +0,0 @@
-import { makeAutoObservable } from "mobx";
-import { IkasThemeJsonPageComponent } from "./component";
-import {
-  IkasThemeJsonPage as IThemeJsonPage,
-  IkasThemeJsonPageType,
-} from "@ikas/storefront-models";
-
-export class IkasThemeJsonPage implements IThemeJsonPage {
-  id: string;
-  name: string | null;
-  type: IkasThemeJsonPageType;
-  slug: string | null;
-  pageTitle: string | null;
-  description: string | null;
-  components: IkasThemeJsonPageComponent[];
-  specifications: IkasThemeJsonPageSpecification[] | null;
-  canonicals: string[] | null;
-  disableIndex: boolean | null;
-
-  constructor(data: Partial<IkasThemeJsonPage>) {
-    this.id = data.id || Date.now() + "";
-    this.name = data.name || null;
-    this.type = data.type || IkasThemeJsonPageType.INDEX;
-    this.slug = data.slug || null;
-    this.pageTitle = data.pageTitle || null;
-    this.description = data.description || null;
-    this.components = data.components
-      ? data.components.map((c) => new IkasThemeJsonPageComponent(c))
-      : [];
-    this.specifications = data.specifications
-      ? data.specifications.map((s) => new IkasThemeJsonPageSpecification(s))
-      : null;
-    this.canonicals = data.canonicals || null;
-    this.disableIndex = data.disableIndex ?? null;
-
-    makeAutoObservable(this);
-  }
-}
-
-export class IkasThemeJsonPageSpecification {
-  id: string;
-  components: IkasThemeJsonPageComponent[];
-
-  constructor(data: Partial<IkasThemeJsonPageSpecification>) {
-    this.id = data.id || "";
-    this.components = data.components
-      ? data.components.map((c) => new IkasThemeJsonPageComponent(c))
-      : [];
-
-    makeAutoObservable(this);
-  }
-}
-
-export { IkasThemeJsonPageType };

package/src/models/data/theme-json/settings/color/index.ts

@@ -1,35 +0,0 @@
-import { makeAutoObservable } from "mobx";
-import {
-  IkasThemeJsonColor as IThemeJsonColor,
-  IkasThemeJsonColorTranslation as IThemeJsonColorTranslation,
-} from "@ikas/storefront-models";
-
-export class IkasThemeJsonColor implements IThemeJsonColor {
-  id: string;
-  displayName: string;
-  key: string;
-  color: string;
-  translations: {
-    [locale: string]: IkasThemeJsonColorTranslation;
-  } = {};
-
-  constructor(data: Partial<IkasThemeJsonColor>) {
-    this.id = data.id || "";
-    this.displayName = data.displayName || "";
-    this.key = data.key || "";
-    this.color = data.color || "";
-    this.translations = data.translations || {};
-
-    makeAutoObservable(this);
-  }
-}
-
-export class IkasThemeJsonColorTranslation
-  implements IThemeJsonColorTranslation
-{
-  displayName: string | null;
-
-  constructor(data: Partial<IkasThemeJsonColorTranslation> = {}) {
-    this.displayName = data.displayName || null;
-  }
-}

package/src/models/data/theme-json/settings/favicon/index.ts

@@ -1,12 +0,0 @@
-import { makeAutoObservable } from "mobx";
-import { IkasThemeJsonFavicon as IThemeJsonFavicon } from "@ikas/storefront-models";
-
-export class IkasThemeJsonFavicon implements IThemeJsonFavicon {
-  id: string | null;
-
-  constructor(data?: Partial<IkasThemeJsonFavicon>) {
-    this.id = data?.id || null;
-
-    makeAutoObservable(this);
-  }
-}

package/src/models/data/theme-json/settings/font-family/index.ts

@@ -1,14 +0,0 @@
-import { makeAutoObservable } from "mobx";
-import { IkasThemeJsonFontFamily as IThemeJsonFontFamily } from "@ikas/storefront-models";
-
-export class IkasThemeJsonFontFamily implements IThemeJsonFontFamily {
-  name: string | null;
-  variants: string[] | null;
-
-  constructor(data: Partial<IThemeJsonFontFamily> = {}) {
-    this.name = data.name || null;
-    this.variants = data.variants || null;
-
-    makeAutoObservable(this);
-  }
-}

package/src/models/data/theme-json/settings/index.ts

@@ -1,30 +0,0 @@
-import { IkasThemeJsonStockPreference } from "@ikas/storefront-models";
-import { makeAutoObservable } from "mobx";
-import { IkasThemeJsonColor } from "./color";
-import { IkasThemeJsonFavicon } from "./favicon";
-import { IkasThemeJsonFontFamily } from "./font-family";
-import { IkasThemeJsonSettings as IThemeJsonSettings } from "@ikas/storefront-models";
-
-export class IkasThemeJsonSettings implements IThemeJsonSettings {
-  colors: IkasThemeJsonColor[];
-  favicon: IkasThemeJsonFavicon;
-  stockPreference: IkasThemeJsonStockPreference;
-  fontFamily: IkasThemeJsonFontFamily;
-
-  constructor(data: Partial<IkasThemeJsonSettings> = {}) {
-    this.colors = data.colors
-      ? data.colors.map((c) => new IkasThemeJsonColor(c))
-      : [];
-
-    this.favicon = data.favicon?.id ? data.favicon : new IkasThemeJsonFavicon();
-    this.stockPreference =
-      data.stockPreference || IkasThemeJsonStockPreference.SHOW_ALL;
-    this.fontFamily = data.fontFamily
-      ? new IkasThemeJsonFontFamily(data.fontFamily)
-      : new IkasThemeJsonFontFamily();
-
-    makeAutoObservable(this);
-  }
-}
-
-export { IkasThemeJsonStockPreference };

package/src/models/data/variant-type/index.ts

@@ -1,44 +0,0 @@
-import { IkasVariantTypeFunctions } from "@ikas/storefront-model-functions";
-import {
-  IkasVariantSelectionType,
-  IkasVariantType as IVariantType,
-  IkasVariantTypeTranslation,
-} from "@ikas/storefront-models";
-import { makeAutoObservable } from "mobx";
-import { IkasVariantValue } from "./variant-value";
-
-export class IkasVariantType implements IVariantType {
-  id: string;
-  name: string;
-  selectionType: IkasVariantSelectionType;
-  values: IkasVariantValue[];
-  translations?: IkasVariantTypeTranslation[] | null;
-
-  constructor(data: Partial<IVariantType> = {}) {
-    this.id = data.id || "";
-    this.name = data.name || "";
-    this.selectionType = data.selectionType || IkasVariantSelectionType.CHOICE;
-    this.values = data.values
-      ? data.values.map(
-          (v) =>
-            new IkasVariantValue({
-              ...v,
-              variantTypeId: this.id,
-            })
-        )
-      : [];
-    this.translations = data.translations;
-
-    makeAutoObservable(this);
-  }
-
-  get isColorSelection() {
-    return IkasVariantTypeFunctions.isColorSelection(this);
-  }
-
-  get slug() {
-    return IkasVariantTypeFunctions.getIkasVariantTypeSlug(this);
-  }
-}
-
-export { IkasVariantSelectionType };

package/src/models/data/variant-type/variant-value/index.ts

@@ -1,32 +0,0 @@
-import { IkasImage } from "../../image";
-import { IkasVariantValue as IVariantValue } from "@ikas/storefront-models";
-import { makeAutoObservable } from "mobx";
-import { IkasVariantValueFunctions } from "@ikas/storefront-model-functions";
-
-export class IkasVariantValue implements IVariantValue {
-  id: string;
-  name: string;
-  colorCode: string | null = null;
-  thumbnailImageId: string | null = null;
-  variantTypeId: string;
-
-  // Extra
-  thumbnailImage?: IkasImage;
-
-  constructor(data: IVariantValue) {
-    this.id = data.id;
-    this.name = data.name;
-    this.colorCode = data.colorCode || null;
-    this.variantTypeId = data.variantTypeId;
-
-    this.thumbnailImage = data.thumbnailImage
-      ? new IkasImage(data.thumbnailImage)
-      : undefined;
-
-    makeAutoObservable(this);
-  }
-
-  get slug() {
-    return IkasVariantValueFunctions.getIkasVariantValueSlug(this);
-  }
-}

package/src/models/index.ts

@@ -1,2 +0,0 @@
-export * from "./data";
-export * from "./ui";