@spartacus/storefront
Version:
Spartacus Storefront is a package that you can include in your application, which allows you to add default storefront features.
105 lines (104 loc) • 3.95 kB
TypeScript
import { DeferLoadingStrategy } from '@spartacus/core';
import { LaunchConfig } from '../launch-dialog/index';
import * as i0 from "@angular/core";
/**
* The `BREAKPOINT` typing defaults to five default screen names:
* xs, sm, md, lg, xl.
*
* The type can be extended to allow for custom screens, such as XLL or `tablet`.
*
* While the screen names are fully configurable, other features might have
* pre-configured layout settings per screen. Page layouts or table configurations,
* for example, are driven by screen size. In case you change the screen size or
* introduce new screen names, you might loose out on these configurations.
*/
export declare enum BREAKPOINT {
xs = "xs",
sm = "sm",
md = "md",
lg = "lg",
xl = "xl"
}
export declare type LayoutSections = 'header' | 'footer' | 'LandingPage2Template' | string;
export declare type SlotConfig = {
/** The cms page slots are mapped by the `slot.position`. */
slots?: string[];
/**
* The page fold identifies the last expected page slot above-the-fold.
* It's perfectly fine to specify this by indication, but keep in mind that
* a more precise indication will gain a more positive impact on performance.
*/
pageFold?: string;
};
export declare type SlotGroup = {
/** The page slot configuration for large screens */
[BREAKPOINT.lg]?: SlotConfig;
/** The page slot configuration for medium screens */
[BREAKPOINT.md]?: SlotConfig;
/** The page slot configuration for small screens */
[BREAKPOINT.sm]?: SlotConfig;
/** The page slot configuration for extra small screens */
[BREAKPOINT.xs]?: SlotConfig;
};
export declare type LayoutSlotConfig = {
[section in LayoutSections]: SlotConfig | SlotGroup | LayoutSlotConfig;
};
export interface BreakPoint {
/**
* The minimum screen width.
*/
min?: number;
/**
* The minimum screen width.
*/
max?: number;
}
/**
* The `LayoutBreakPoints` can be used to configure the size of a specific screen. The screen
* are defined by breakpoints, with a min and/or max value. The breakpoint size is in pixels,
* hence a numeric value is expected.
*/
export declare type LayoutBreakPoints = {
[t in BREAKPOINT]?: number | BreakPoint;
};
/**
* The LayoutConfig supports the configuration of page slots by page templates
* or page sections, such as headers and footers. The configuration also supports
* adaptive design per breakpoint (not per device type), so that the DOM is (re)rendered
* por a given breakpoint.
*/
export declare abstract class LayoutConfig {
/**
* The breakpoint configuration is used to defined various screens. A specific screen name can
* be used to further configure certain features, such as the overall layout or specific
* component configurations.
*/
breakpoints?: LayoutBreakPoints;
layoutSlots?: LayoutSlotConfig;
/**
* Deferred loading is a technique to hold of with the loading / creation
* of DOM elements which are not not in the initial view port.
* This technique wil increase performance.
*/
deferredLoading?: {
/**
* The global strategy will be used as a fallback strategy for all DOM creation,
* but can be overridden by local configuration, i.e. for cms components.
*/
strategy?: DeferLoadingStrategy;
/**
* The intersection margin contains the offset used by the Intersection Observer
* to observe elements outside the view port.
*
* See https://developer.mozilla.org/en-US/docs/Web/API/IntersectionObserver/rootMargin
*/
intersectionMargin?: string;
};
launch?: LaunchConfig;
static ɵfac: i0.ɵɵFactoryDeclaration<LayoutConfig, never>;
static ɵprov: i0.ɵɵInjectableDeclaration<LayoutConfig>;
}
declare module '@spartacus/core' {
interface Config extends LayoutConfig {
}
}