@levo-so/studio 0.1.0
This diff represents the content of publicly available package versions that have been released to one of the supported registries. The information contained in this diff is provided for informational purposes only and reflects changes between package versions as they appear in their respective public registries.
- package/dist/blockSmith/ContentSchemaGenerator.d.ts +4 -0
- package/dist/blockSmith/DefaultContentGenerator.d.ts +2 -0
- package/dist/blockSmith/DefaultStylesGenerator.d.ts +2 -0
- package/dist/blockSmith/index.d.ts +3 -0
- package/dist/blockSmith/variablePropertMap.d.ts +2 -0
- package/dist/bridge/Highlighter.d.ts +8 -0
- package/dist/bridge/PreviewHighlighter.d.ts +2 -0
- package/dist/bridge/StudioBlockPreview.d.ts +7 -0
- package/dist/bridge/StudioPagePreview.d.ts +16 -0
- package/dist/bridge/StudioPreview.d.ts +20 -0
- package/dist/bridge/constants.d.ts +7 -0
- package/dist/bridge/index.d.ts +5 -0
- package/dist/bridge/types.d.ts +33 -0
- package/dist/bridge/utils.d.ts +7 -0
- package/dist/components/ActionWrapper.d.ts +8 -0
- package/dist/components/BackgroundVideo.d.ts +6 -0
- package/dist/components/backgroundPresets/Beams.d.ts +10 -0
- package/dist/components/backgroundPresets/Dots.d.ts +12 -0
- package/dist/components/backgroundPresets/Gradient.d.ts +10 -0
- package/dist/components/backgroundPresets/Grid.d.ts +14 -0
- package/dist/components/backgroundPresets/Waves.d.ts +12 -0
- package/dist/components/backgroundPresets/exports.d.ts +10 -0
- package/dist/components/backgroundPresets/index.d.ts +9 -0
- package/dist/components/backgroundPresets/presetSystem.d.ts +10 -0
- package/dist/components/backgroundPresets/presetUtils.d.ts +19 -0
- package/dist/components/backgroundPresets/presets.d.ts +39 -0
- package/dist/components/withBlockProps copy.d.ts +61 -0
- package/dist/components/withBlockProps.d.ts +61 -0
- package/dist/contentEngine/cache.d.ts +5 -0
- package/dist/contentEngine/config.d.ts +3 -0
- package/dist/contentEngine/content.d.ts +21 -0
- package/dist/contentEngine/getPage.d.ts +8 -0
- package/dist/contentEngine/head_code.d.ts +3 -0
- package/dist/contentEngine/index.d.ts +7 -0
- package/dist/contentEngine/sourceFetcher.d.ts +12 -0
- package/dist/contentEngine/themeUtils.d.ts +81 -0
- package/dist/contentEngine/types.d.ts +25 -0
- package/dist/contentEngine/urlBuilder.d.ts +3 -0
- package/dist/contentEngine/useContentEngine.d.ts +9 -0
- package/dist/core/BlockRegistry.d.ts +20 -0
- package/dist/core/LevoBlock.d.ts +15 -0
- package/dist/core/LevoPage.d.ts +12 -0
- package/dist/core/index.d.ts +4 -0
- package/dist/elements/Box.d.ts +7 -0
- package/dist/elements/Button.d.ts +10 -0
- package/dist/elements/Carousel.d.ts +19 -0
- package/dist/elements/Container.d.ts +6 -0
- package/dist/elements/Form.d.ts +6 -0
- package/dist/elements/Heading.d.ts +7 -0
- package/dist/elements/Icon.d.ts +10 -0
- package/dist/elements/Iframe.d.ts +7 -0
- package/dist/elements/Image.d.ts +17 -0
- package/dist/elements/Link.d.ts +6 -0
- package/dist/elements/Media.d.ts +22 -0
- package/dist/elements/Section.d.ts +7 -0
- package/dist/elements/Typography.d.ts +8 -0
- package/dist/elements/accordion/index.d.ts +20 -0
- package/dist/elements/index.d.ts +16 -0
- package/dist/elements/popover/index.d.ts +17 -0
- package/dist/index.css +1 -0
- package/dist/index.d.ts +15 -0
- package/dist/index.js +10762 -0
- package/dist/interfaces/block.d.ts +50 -0
- package/dist/interfaces/contentSchema.d.ts +29 -0
- package/dist/interfaces/index.d.ts +7 -0
- package/dist/interfaces/levoBlock.d.ts +203 -0
- package/dist/interfaces/site.d.ts +179 -0
- package/dist/interfaces/sites.d.ts +32 -0
- package/dist/interfaces/theme.d.ts +144 -0
- package/dist/pixel/constants/borderRadius.d.ts +43 -0
- package/dist/pixel/constants/colorOptions.d.ts +73 -0
- package/dist/pixel/constants/fontSizeOptions.d.ts +58 -0
- package/dist/pixel/constants/marginOptions.d.ts +183 -0
- package/dist/pixel/constants/spaceOptions.d.ts +178 -0
- package/dist/pixel/index.d.ts +3 -0
- package/dist/pixel/optionsMap.d.ts +14 -0
- package/dist/pixel/propertyMap.d.ts +2 -0
- package/dist/providers/AuthProvider.d.ts +25 -0
- package/dist/providers/BlockContext.d.ts +16 -0
- package/dist/providers/index.d.ts +3 -0
- package/dist/theme/defaultTheme.d.ts +3 -0
- package/dist/utils/blockHelpers.d.ts +5 -0
- package/dist/utils/blocksLevoClient.d.ts +5 -0
- package/dist/utils/colorUtils.d.ts +54 -0
- package/dist/utils/getKeysWithValue.d.ts +3 -0
- package/dist/utils/index.d.ts +3 -0
- package/dist/utils/withBlockPropsUtils.d.ts +132 -0
- package/package.json +72 -0
|
@@ -0,0 +1,7 @@
|
|
|
1
|
+
import { BlockComponent } from '../interfaces';
|
|
2
|
+
import { StudioData } from './StudioPreview';
|
|
3
|
+
export declare const StudioBlockPreview: React.FC<{
|
|
4
|
+
blocks: Record<string, BlockComponent>;
|
|
5
|
+
studioData: StudioData["blockData"] | undefined;
|
|
6
|
+
}>;
|
|
7
|
+
//# sourceMappingURL=StudioBlockPreview.d.ts.map
|
|
@@ -0,0 +1,16 @@
|
|
|
1
|
+
import { IPageExpanded } from '../interfaces';
|
|
2
|
+
import { ILevoPageProps } from '../core';
|
|
3
|
+
import { IPageDataContext } from '../contentEngine';
|
|
4
|
+
interface StudioPageData {
|
|
5
|
+
pageData: IPageExpanded;
|
|
6
|
+
parsedPageData: IPageExpanded;
|
|
7
|
+
context?: IPageDataContext;
|
|
8
|
+
headCode?: string;
|
|
9
|
+
}
|
|
10
|
+
export declare const StudioPagePreview: React.FC<{
|
|
11
|
+
blocks: ILevoPageProps["blocks"];
|
|
12
|
+
renderHighlights?: boolean;
|
|
13
|
+
studioData: StudioPageData | undefined;
|
|
14
|
+
}>;
|
|
15
|
+
export {};
|
|
16
|
+
//# sourceMappingURL=StudioPagePreview.d.ts.map
|
|
@@ -0,0 +1,20 @@
|
|
|
1
|
+
import { IBlockInstance, IPageExpanded, ITheme, BlockComponent } from '../interfaces';
|
|
2
|
+
import { IPageDataContext } from '../contentEngine';
|
|
3
|
+
export type StudioData = {
|
|
4
|
+
pageData?: {
|
|
5
|
+
pageData: IPageExpanded;
|
|
6
|
+
parsedPageData: IPageExpanded;
|
|
7
|
+
context?: IPageDataContext;
|
|
8
|
+
headCode?: string;
|
|
9
|
+
};
|
|
10
|
+
blockData?: {
|
|
11
|
+
blockData: IBlockInstance;
|
|
12
|
+
parsedBlockData: IBlockInstance;
|
|
13
|
+
context?: IPageDataContext;
|
|
14
|
+
theme?: ITheme;
|
|
15
|
+
};
|
|
16
|
+
};
|
|
17
|
+
export declare const StudioPreview: React.FC<{
|
|
18
|
+
blocks: Record<string, BlockComponent>;
|
|
19
|
+
}>;
|
|
20
|
+
//# sourceMappingURL=StudioPreview.d.ts.map
|
|
@@ -0,0 +1,33 @@
|
|
|
1
|
+
export type SelectableType = "block" | "element" | "repeatable" | "repeatableParent";
|
|
2
|
+
export interface HighlightRect {
|
|
3
|
+
top: number;
|
|
4
|
+
left: number;
|
|
5
|
+
width: number;
|
|
6
|
+
height: number;
|
|
7
|
+
}
|
|
8
|
+
export interface SelectableItem {
|
|
9
|
+
type: SelectableType;
|
|
10
|
+
rect: HighlightRect | null;
|
|
11
|
+
element: HTMLElement | null;
|
|
12
|
+
parentBlockId?: string;
|
|
13
|
+
}
|
|
14
|
+
export interface SelectionState {
|
|
15
|
+
selected: Record<SelectableType, SelectableItem | null>;
|
|
16
|
+
hovered: Record<SelectableType, SelectableItem | null>;
|
|
17
|
+
}
|
|
18
|
+
export interface ISelection {
|
|
19
|
+
blockId?: string;
|
|
20
|
+
elementKey?: string;
|
|
21
|
+
repeatableKey?: string;
|
|
22
|
+
repeatableParentKey?: string;
|
|
23
|
+
}
|
|
24
|
+
export interface StudioState {
|
|
25
|
+
selected: ISelection;
|
|
26
|
+
hovered: ISelection;
|
|
27
|
+
actions: {
|
|
28
|
+
openBlockEditor: (params: ISelection) => void;
|
|
29
|
+
setHovered: (params: ISelection) => void;
|
|
30
|
+
setSelected: (params: ISelection) => void;
|
|
31
|
+
};
|
|
32
|
+
}
|
|
33
|
+
//# sourceMappingURL=types.d.ts.map
|
|
@@ -0,0 +1,7 @@
|
|
|
1
|
+
import { ISelection, HighlightRect, SelectionState } from './types';
|
|
2
|
+
export declare function getElementCoordinates(element: HTMLElement): HighlightRect;
|
|
3
|
+
export declare function getSelectionFromElement(element: HTMLElement): ISelection | null;
|
|
4
|
+
export declare function findElementBySelection(selection: ISelection): HTMLElement | null;
|
|
5
|
+
export declare function createSelectionState(element: HTMLElement, type: "selected" | "hovered"): SelectionState;
|
|
6
|
+
export declare function updateSelectionRects(selections: SelectionState): SelectionState;
|
|
7
|
+
//# sourceMappingURL=utils.d.ts.map
|
|
@@ -0,0 +1,10 @@
|
|
|
1
|
+
import { default as React } from 'react';
|
|
2
|
+
interface BackgroundBeamsProps {
|
|
3
|
+
className?: string;
|
|
4
|
+
primaryColor?: string;
|
|
5
|
+
secondaryColor?: string;
|
|
6
|
+
lineColor?: string;
|
|
7
|
+
}
|
|
8
|
+
export declare const BackgroundBeams: React.MemoExoticComponent<({ className, primaryColor, secondaryColor, lineColor, }: BackgroundBeamsProps) => import("react/jsx-runtime").JSX.Element>;
|
|
9
|
+
export {};
|
|
10
|
+
//# sourceMappingURL=Beams.d.ts.map
|
|
@@ -0,0 +1,12 @@
|
|
|
1
|
+
import { default as React } from 'react';
|
|
2
|
+
interface BackgroundDotsProps {
|
|
3
|
+
className?: string;
|
|
4
|
+
dotColor?: string;
|
|
5
|
+
dotSize?: number;
|
|
6
|
+
spacing?: number;
|
|
7
|
+
isAnimated?: boolean;
|
|
8
|
+
speed?: number;
|
|
9
|
+
}
|
|
10
|
+
export declare const BackgroundDots: React.MemoExoticComponent<({ className, dotColor, dotSize, spacing, isAnimated, speed, }: BackgroundDotsProps) => import("react/jsx-runtime").JSX.Element>;
|
|
11
|
+
export {};
|
|
12
|
+
//# sourceMappingURL=Dots.d.ts.map
|
|
@@ -0,0 +1,10 @@
|
|
|
1
|
+
import { default as React } from 'react';
|
|
2
|
+
interface BackgroundGradientProps {
|
|
3
|
+
className?: string;
|
|
4
|
+
fromColor?: string;
|
|
5
|
+
toColor?: string;
|
|
6
|
+
direction?: string;
|
|
7
|
+
}
|
|
8
|
+
export declare const BackgroundGradient: React.MemoExoticComponent<({ className, fromColor, toColor, direction }: BackgroundGradientProps) => import("react/jsx-runtime").JSX.Element>;
|
|
9
|
+
export {};
|
|
10
|
+
//# sourceMappingURL=Gradient.d.ts.map
|
|
@@ -0,0 +1,14 @@
|
|
|
1
|
+
import { default as React } from 'react';
|
|
2
|
+
interface BackgroundGridProps {
|
|
3
|
+
className?: string;
|
|
4
|
+
lineColor?: string;
|
|
5
|
+
lineWidth?: number;
|
|
6
|
+
spacing?: number;
|
|
7
|
+
isInteractive?: boolean;
|
|
8
|
+
hoverColor?: string;
|
|
9
|
+
rows?: number;
|
|
10
|
+
cols?: number;
|
|
11
|
+
}
|
|
12
|
+
export declare const BackgroundGrid: React.MemoExoticComponent<({ className, lineColor, lineWidth, spacing, isInteractive, hoverColor, rows, cols, }: BackgroundGridProps) => import("react/jsx-runtime").JSX.Element>;
|
|
13
|
+
export {};
|
|
14
|
+
//# sourceMappingURL=Grid.d.ts.map
|
|
@@ -0,0 +1,12 @@
|
|
|
1
|
+
import { default as React } from 'react';
|
|
2
|
+
interface BackgroundWavesProps {
|
|
3
|
+
className?: string;
|
|
4
|
+
primaryColor?: string;
|
|
5
|
+
secondaryColor?: string;
|
|
6
|
+
amplitude?: number;
|
|
7
|
+
frequency?: number;
|
|
8
|
+
speed?: number;
|
|
9
|
+
}
|
|
10
|
+
export declare const BackgroundWaves: React.MemoExoticComponent<({ className, primaryColor, secondaryColor, amplitude, frequency, speed, }: BackgroundWavesProps) => import("react/jsx-runtime").JSX.Element>;
|
|
11
|
+
export {};
|
|
12
|
+
//# sourceMappingURL=Waves.d.ts.map
|
|
@@ -0,0 +1,10 @@
|
|
|
1
|
+
export { default as BackgroundEffects } from './index';
|
|
2
|
+
export * from './presets';
|
|
3
|
+
export * from './presetSystem';
|
|
4
|
+
export * from './presetUtils';
|
|
5
|
+
export { BackgroundBeams } from './Beams';
|
|
6
|
+
export { BackgroundDots } from './Dots';
|
|
7
|
+
export { BackgroundGrid } from './Grid';
|
|
8
|
+
export { BackgroundGradient } from './Gradient';
|
|
9
|
+
export { BackgroundWaves } from './Waves';
|
|
10
|
+
//# sourceMappingURL=exports.d.ts.map
|
|
@@ -0,0 +1,9 @@
|
|
|
1
|
+
import { default as React } from 'react';
|
|
2
|
+
import { BackgroundEffectConfig } from '../../interfaces';
|
|
3
|
+
interface BackgroundEffectsProps {
|
|
4
|
+
config?: BackgroundEffectConfig;
|
|
5
|
+
presetId?: string;
|
|
6
|
+
}
|
|
7
|
+
declare const BackgroundEffects: React.FC<BackgroundEffectsProps>;
|
|
8
|
+
export default BackgroundEffects;
|
|
9
|
+
//# sourceMappingURL=index.d.ts.map
|
|
@@ -0,0 +1,10 @@
|
|
|
1
|
+
/**
|
|
2
|
+
* Background Preset System
|
|
3
|
+
*
|
|
4
|
+
* This module provides a complete preset system for background effects,
|
|
5
|
+
* including built-in presets and application logic.
|
|
6
|
+
*/
|
|
7
|
+
export { BUILT_IN_PRESETS, PRESET_CATEGORIES, PRESET_MAP, getPresetsByCategory, getAvailableCategories, } from './presets';
|
|
8
|
+
export { getEffectConfigFromPresetId, type PresetOperationResult, } from './presetUtils';
|
|
9
|
+
export type { BackgroundPreset, BackgroundEffectConfig } from '../../interfaces';
|
|
10
|
+
//# sourceMappingURL=presetSystem.d.ts.map
|
|
@@ -0,0 +1,19 @@
|
|
|
1
|
+
import { BackgroundEffectConfig } from '../../interfaces';
|
|
2
|
+
/**
|
|
3
|
+
* Result type for preset operations
|
|
4
|
+
*/
|
|
5
|
+
export interface PresetOperationResult {
|
|
6
|
+
success: boolean;
|
|
7
|
+
config?: BackgroundEffectConfig;
|
|
8
|
+
error?: string;
|
|
9
|
+
}
|
|
10
|
+
/**
|
|
11
|
+
* Get the effect configuration from a preset ID
|
|
12
|
+
* This is the main mapping function from preset ID to effect config
|
|
13
|
+
*/
|
|
14
|
+
export declare const getEffectConfigFromPresetId: (presetId: string) => BackgroundEffectConfig | null;
|
|
15
|
+
/**
|
|
16
|
+
* Sanitizes a background effect configuration by removing invalid values
|
|
17
|
+
*/
|
|
18
|
+
export declare const sanitizeBackgroundEffectConfig: (config: BackgroundEffectConfig) => BackgroundEffectConfig;
|
|
19
|
+
//# sourceMappingURL=presetUtils.d.ts.map
|
|
@@ -0,0 +1,39 @@
|
|
|
1
|
+
import { BackgroundPreset } from '../../interfaces';
|
|
2
|
+
/**
|
|
3
|
+
* Built-in background effect presets organized by category
|
|
4
|
+
*/
|
|
5
|
+
export declare const BUILT_IN_PRESETS: BackgroundPreset[];
|
|
6
|
+
/**
|
|
7
|
+
* Preset categories with metadata
|
|
8
|
+
*/
|
|
9
|
+
export declare const PRESET_CATEGORIES: {
|
|
10
|
+
readonly minimal: {
|
|
11
|
+
readonly label: "Minimal";
|
|
12
|
+
readonly description: "Clean, subtle effects that enhance without overwhelming";
|
|
13
|
+
};
|
|
14
|
+
readonly dynamic: {
|
|
15
|
+
readonly label: "Dynamic";
|
|
16
|
+
readonly description: "Animated effects that add movement and energy";
|
|
17
|
+
};
|
|
18
|
+
readonly interactive: {
|
|
19
|
+
readonly label: "Interactive";
|
|
20
|
+
readonly description: "Effects that respond to user interaction";
|
|
21
|
+
};
|
|
22
|
+
readonly custom: {
|
|
23
|
+
readonly label: "Custom";
|
|
24
|
+
readonly description: "User-created custom presets";
|
|
25
|
+
};
|
|
26
|
+
};
|
|
27
|
+
/**
|
|
28
|
+
* Map of preset IDs to their configurations for quick lookup
|
|
29
|
+
*/
|
|
30
|
+
export declare const PRESET_MAP: Map<string, BackgroundPreset>;
|
|
31
|
+
/**
|
|
32
|
+
* Get presets by category
|
|
33
|
+
*/
|
|
34
|
+
export declare function getPresetsByCategory(category: BackgroundPreset["category"]): BackgroundPreset[];
|
|
35
|
+
/**
|
|
36
|
+
* Get all available preset categories
|
|
37
|
+
*/
|
|
38
|
+
export declare function getAvailableCategories(): Array<BackgroundPreset["category"]>;
|
|
39
|
+
//# sourceMappingURL=presets.d.ts.map
|
|
@@ -0,0 +1,61 @@
|
|
|
1
|
+
import { ComponentType, ForwardRefExoticComponent, ReactElement, RefAttributes, ReactNode } from 'react';
|
|
2
|
+
import { IFieldConfig, IStyles } from '../interfaces';
|
|
3
|
+
type RenderFunction = (item: unknown, index: number) => ReactNode;
|
|
4
|
+
type BlockChildren = ReactNode | RenderFunction;
|
|
5
|
+
/**
|
|
6
|
+
* Base props interface for all studio elements
|
|
7
|
+
*
|
|
8
|
+
* These props are automatically injected by the withBlockProps HOC
|
|
9
|
+
* and provide access to element configuration, styling, and content
|
|
10
|
+
*/
|
|
11
|
+
export interface BaseElementProps {
|
|
12
|
+
elementKey: string;
|
|
13
|
+
styles?: IStyles;
|
|
14
|
+
config?: IFieldConfig;
|
|
15
|
+
content?: any;
|
|
16
|
+
generatedClassName?: string;
|
|
17
|
+
}
|
|
18
|
+
export interface WithBlockPropsComponent<P = {}> {
|
|
19
|
+
(props: P & {
|
|
20
|
+
children?: BlockChildren;
|
|
21
|
+
}): ReactElement | null;
|
|
22
|
+
}
|
|
23
|
+
/**
|
|
24
|
+
* withBlockProps - Higher-Order Component for Studio Elements
|
|
25
|
+
*
|
|
26
|
+
* This HOC enhances studio elements with block data and generates CSS classes
|
|
27
|
+
* for theme-based styling and targeting. It bridges the gap between block data
|
|
28
|
+
* and individual element instances.
|
|
29
|
+
*
|
|
30
|
+
* Key Features:
|
|
31
|
+
* 1. Injects element-specific config, styles, and content from block data
|
|
32
|
+
* 2. Generates CSS classes for element targeting and theme variants
|
|
33
|
+
* 3. Handles nested data access via dot-notation element keys
|
|
34
|
+
* 4. Provides consistent interface for all studio elements
|
|
35
|
+
* 5. Added support for Framer Motion animations driven by studio config
|
|
36
|
+
*
|
|
37
|
+
* CSS Class Generation:
|
|
38
|
+
* - Base class: `levo-{blockId}-{elementKey}` for unique element targeting
|
|
39
|
+
* - Variant classes: `levo-variant-{groupId}-{variantId}` for theme variants
|
|
40
|
+
*
|
|
41
|
+
* The generated classes enable:
|
|
42
|
+
* - Element-specific styling in CSS
|
|
43
|
+
* - Theme variant styling via class selectors
|
|
44
|
+
* - CSS cascade integration with theme system
|
|
45
|
+
*
|
|
46
|
+
* @example
|
|
47
|
+
* // Element with theme variants selected
|
|
48
|
+
* <Button elementKey="hero.button" />
|
|
49
|
+
*
|
|
50
|
+
* // If config.selectedVariants = { variants: "primary", sizes: "large" }
|
|
51
|
+
* // Renders with classes:
|
|
52
|
+
* // "levo-block123-hero-button levo-variant-variants-primary levo-variant-sizes-large"
|
|
53
|
+
*
|
|
54
|
+
* @param WrappedComponent - The component to enhance with block props
|
|
55
|
+
* @returns Enhanced component with automatic prop injection
|
|
56
|
+
*/
|
|
57
|
+
export declare const withBlockProps: <P extends BaseElementProps & {
|
|
58
|
+
children?: BlockChildren;
|
|
59
|
+
}, R>(WrappedComponent: ComponentType<P> | ForwardRefExoticComponent<P & RefAttributes<R>>) => WithBlockPropsComponent<P>;
|
|
60
|
+
export {};
|
|
61
|
+
//# sourceMappingURL=withBlockProps%20copy.d.ts.map
|
|
@@ -0,0 +1,61 @@
|
|
|
1
|
+
import { ComponentType, ForwardRefExoticComponent, ReactElement, RefAttributes, ReactNode } from 'react';
|
|
2
|
+
import { IFieldConfig, IStyles } from '../interfaces';
|
|
3
|
+
type RenderFunction = (item: unknown, index: number) => ReactNode;
|
|
4
|
+
type BlockChildren = ReactNode | RenderFunction;
|
|
5
|
+
/**
|
|
6
|
+
* Base props interface for all studio elements
|
|
7
|
+
*
|
|
8
|
+
* These props are automatically injected by the withBlockProps HOC
|
|
9
|
+
* and provide access to element configuration, styling, and content
|
|
10
|
+
*/
|
|
11
|
+
export interface BaseElementProps {
|
|
12
|
+
elementKey: string;
|
|
13
|
+
styles?: IStyles;
|
|
14
|
+
config?: IFieldConfig;
|
|
15
|
+
content?: any;
|
|
16
|
+
generatedClassName?: string;
|
|
17
|
+
}
|
|
18
|
+
export interface WithBlockPropsComponent<P = {}> {
|
|
19
|
+
(props: P & {
|
|
20
|
+
children?: BlockChildren;
|
|
21
|
+
}): ReactElement | null;
|
|
22
|
+
}
|
|
23
|
+
/**
|
|
24
|
+
* withBlockProps - Higher-Order Component for Studio Elements
|
|
25
|
+
*
|
|
26
|
+
* This HOC enhances studio elements with block data and generates CSS classes
|
|
27
|
+
* for theme-based styling and targeting. It bridges the gap between block data
|
|
28
|
+
* and individual element instances.
|
|
29
|
+
*
|
|
30
|
+
* Key Features:
|
|
31
|
+
* 1. Injects element-specific config, styles, and content from block data
|
|
32
|
+
* 2. Generates CSS classes for element targeting and theme variants
|
|
33
|
+
* 3. Handles nested data access via dot-notation element keys
|
|
34
|
+
* 4. Provides consistent interface for all studio elements
|
|
35
|
+
* 5. Added support for Framer Motion animations driven by studio config
|
|
36
|
+
*
|
|
37
|
+
* CSS Class Generation:
|
|
38
|
+
* - Base class: `levo-{blockId}-{elementKey}` for unique element targeting
|
|
39
|
+
* - Variant classes: `levo-variant-{groupId}-{variantId}` for theme variants
|
|
40
|
+
*
|
|
41
|
+
* The generated classes enable:
|
|
42
|
+
* - Element-specific styling in CSS
|
|
43
|
+
* - Theme variant styling via class selectors
|
|
44
|
+
* - CSS cascade integration with theme system
|
|
45
|
+
*
|
|
46
|
+
* @example
|
|
47
|
+
* // Element with theme variants selected
|
|
48
|
+
* <Button elementKey="hero.button" />
|
|
49
|
+
*
|
|
50
|
+
* // If config.selectedVariants = { variants: "primary", sizes: "large" }
|
|
51
|
+
* // Renders with classes:
|
|
52
|
+
* // "levo-block123-hero-button levo-variant-variants-primary levo-variant-sizes-large"
|
|
53
|
+
*
|
|
54
|
+
* @param WrappedComponent - The component to enhance with block props
|
|
55
|
+
* @returns Enhanced component with automatic prop injection
|
|
56
|
+
*/
|
|
57
|
+
export declare const withBlockProps: <P extends BaseElementProps & {
|
|
58
|
+
children?: BlockChildren;
|
|
59
|
+
}, R>(WrappedComponent: ComponentType<P> | ForwardRefExoticComponent<P & RefAttributes<R>>) => WithBlockPropsComponent<P>;
|
|
60
|
+
export {};
|
|
61
|
+
//# sourceMappingURL=withBlockProps.d.ts.map
|
|
@@ -0,0 +1,21 @@
|
|
|
1
|
+
import { IResponseMultiple } from '@levo-so/core';
|
|
2
|
+
import { IBlockInstance, IPageExpanded, IStudioSource } from '../interfaces';
|
|
3
|
+
import { IPageContext, IPageDataContext } from './types';
|
|
4
|
+
export declare const resolveVariables: ({ skeleton, blockFetchedContent, blockSource, pageContext, }: {
|
|
5
|
+
skeleton: any;
|
|
6
|
+
blockFetchedContent?: Record<string, any>;
|
|
7
|
+
blockSource?: IStudioSource;
|
|
8
|
+
pageContext?: Record<string, any>;
|
|
9
|
+
}) => any;
|
|
10
|
+
export declare const getPageSource: (pageData: IPageExpanded, slugs: Record<string, string>) => Promise<{
|
|
11
|
+
pageContext: IPageContext;
|
|
12
|
+
pageNotFound: boolean;
|
|
13
|
+
}>;
|
|
14
|
+
export declare const parseVariablesFromResolvedSource: (block: IBlockInstance, params: Record<string, unknown>, resolvedSource?: IBlockInstance["source"][0], pageContext?: IPageContext) => Promise<[IBlockInstance, IResponseMultiple["content"] | null]>;
|
|
15
|
+
export declare const getInitialPageContent: (pageData: IPageExpanded, querySlugs: Record<string, string>, urlSlugs: string[]) => Promise<{
|
|
16
|
+
parsedPageData: IPageExpanded;
|
|
17
|
+
context?: IPageDataContext;
|
|
18
|
+
notFound: boolean;
|
|
19
|
+
headCode: string;
|
|
20
|
+
}>;
|
|
21
|
+
//# sourceMappingURL=content.d.ts.map
|
|
@@ -0,0 +1,8 @@
|
|
|
1
|
+
import { IPageFromPath } from '../interfaces';
|
|
2
|
+
export declare const getPageData: ({ workspace, url, draft, visitorParams, }: {
|
|
3
|
+
workspace: string;
|
|
4
|
+
url: string;
|
|
5
|
+
draft?: boolean;
|
|
6
|
+
visitorParams?: Record<string, unknown>;
|
|
7
|
+
}) => Promise<IPageFromPath | null>;
|
|
8
|
+
//# sourceMappingURL=getPage.d.ts.map
|
|
@@ -0,0 +1,12 @@
|
|
|
1
|
+
import { ILemaCollection, IResponseMultiple, IResponseSingle } from '@levo-so/core';
|
|
2
|
+
import { SourceFetchOptions } from './types';
|
|
3
|
+
export declare const fetchSource: ({ source, slugs, params, }: SourceFetchOptions) => Promise<IResponseMultiple | IResponseSingle | null>;
|
|
4
|
+
export declare const fetchCollectionSchema: (source: {
|
|
5
|
+
workspace_id: string;
|
|
6
|
+
collection_id: string;
|
|
7
|
+
}) => Promise<{
|
|
8
|
+
content: {
|
|
9
|
+
data: ILemaCollection | null;
|
|
10
|
+
};
|
|
11
|
+
}>;
|
|
12
|
+
//# sourceMappingURL=sourceFetcher.d.ts.map
|
|
@@ -0,0 +1,81 @@
|
|
|
1
|
+
import { IBlockInstance, ITheme } from '../interfaces';
|
|
2
|
+
/**
|
|
3
|
+
* CSS Custom Properties Generation
|
|
4
|
+
*
|
|
5
|
+
* Converts primitive theme values (colors, fonts, sizes) into CSS custom
|
|
6
|
+
* properties that can be used throughout the application. These variables
|
|
7
|
+
* provide a foundation for consistent styling and easy theme switching.
|
|
8
|
+
*
|
|
9
|
+
* Generated variables are available as:
|
|
10
|
+
* - var(--color-brand) for theme colors
|
|
11
|
+
* - var(--font-heading) for theme fonts
|
|
12
|
+
* - var(--base-spacing) for theme sizes
|
|
13
|
+
*
|
|
14
|
+
* @param theme - Theme configuration object
|
|
15
|
+
* @returns Object mapping CSS property names to values
|
|
16
|
+
*/
|
|
17
|
+
export declare const generateThemeVariables: (theme: ITheme) => {
|
|
18
|
+
"--color-brand": string;
|
|
19
|
+
"--color-brand-foreground": string;
|
|
20
|
+
"--color-brand-secondary": string;
|
|
21
|
+
"--color-brand-secondary-foreground": string;
|
|
22
|
+
"--color-text-1": string;
|
|
23
|
+
"--color-text-2": string;
|
|
24
|
+
"--color-text-3": string;
|
|
25
|
+
"--color-page": string;
|
|
26
|
+
"--color-border": string;
|
|
27
|
+
"--color-background-1": string;
|
|
28
|
+
"--color-background-2": string;
|
|
29
|
+
"--color-background-3": string;
|
|
30
|
+
"--color-icon-primary": string;
|
|
31
|
+
"--color-icon-secondary": string;
|
|
32
|
+
"--font-heading": string;
|
|
33
|
+
"--font-body": string;
|
|
34
|
+
"--base-radius": string;
|
|
35
|
+
"--base-spacing": string;
|
|
36
|
+
"--base-font-size": string;
|
|
37
|
+
"--default-shadow": string;
|
|
38
|
+
};
|
|
39
|
+
/**
|
|
40
|
+
* Complete Theme Processing and CSS Generation
|
|
41
|
+
*
|
|
42
|
+
* This is the main entry point for theme processing. It orchestrates the entire
|
|
43
|
+
* CSS generation pipeline and produces the final CSS output for a page.
|
|
44
|
+
*
|
|
45
|
+
* Processing Steps:
|
|
46
|
+
* 1. Font processing and Google Fonts URL generation
|
|
47
|
+
* 2. CSS custom properties from primitive theme values
|
|
48
|
+
* 3. Component default styles and variant styles from theme configuration
|
|
49
|
+
* 4. Block-specific styles from individual block instances
|
|
50
|
+
* 5. HTML generation with font loading and scoped CSS
|
|
51
|
+
*
|
|
52
|
+
* CSS Scoping:
|
|
53
|
+
* All generated CSS is scoped to [data-levo-page-id='pageID'] to prevent
|
|
54
|
+
* style conflicts between different pages or instances.
|
|
55
|
+
*
|
|
56
|
+
* Output Structure:
|
|
57
|
+
* - Font preload and stylesheet links for performance
|
|
58
|
+
* - Three style blocks: theme variables, default styles, block styles
|
|
59
|
+
* - All CSS properly scoped and organized by purpose
|
|
60
|
+
*
|
|
61
|
+
* @param pageTheme - Complete theme configuration for the page
|
|
62
|
+
* @param blocks - Array of block instances with styling data
|
|
63
|
+
* @param pageID - Unique identifier for CSS scoping
|
|
64
|
+
* @returns Object with processed theme data and HTML for injection
|
|
65
|
+
*/
|
|
66
|
+
export declare const processTheme: ({ pageTheme, blocks, pageID, }: {
|
|
67
|
+
pageTheme: ITheme;
|
|
68
|
+
blocks?: IBlockInstance[];
|
|
69
|
+
pageID: string;
|
|
70
|
+
}) => {
|
|
71
|
+
theme: ITheme;
|
|
72
|
+
fonts: string[];
|
|
73
|
+
fontUrl: string;
|
|
74
|
+
styles: {
|
|
75
|
+
theme: string;
|
|
76
|
+
default: string;
|
|
77
|
+
blocks: string;
|
|
78
|
+
};
|
|
79
|
+
html: string;
|
|
80
|
+
};
|
|
81
|
+
//# sourceMappingURL=themeUtils.d.ts.map
|
|
@@ -0,0 +1,25 @@
|
|
|
1
|
+
import { IResponseMultiple } from '@levo-so/core';
|
|
2
|
+
import { IStudioSource } from '../interfaces';
|
|
3
|
+
export interface SourceURL {
|
|
4
|
+
baseUrl: string;
|
|
5
|
+
path: string;
|
|
6
|
+
query?: Record<string, unknown>;
|
|
7
|
+
}
|
|
8
|
+
export interface SourceFetchOptions {
|
|
9
|
+
source: IStudioSource;
|
|
10
|
+
slugs?: Record<string, string>;
|
|
11
|
+
params?: Record<string, unknown>;
|
|
12
|
+
}
|
|
13
|
+
export interface BlockTemplateOptions {
|
|
14
|
+
contentSkeleton: any;
|
|
15
|
+
blockFetchedContent: Record<string, any>;
|
|
16
|
+
blockSource?: IStudioSource;
|
|
17
|
+
pageContext?: Record<string, any>;
|
|
18
|
+
}
|
|
19
|
+
export type IPageContext = Record<string, unknown>;
|
|
20
|
+
export type IBlockContext = Record<string, IResponseMultiple["content"]>;
|
|
21
|
+
export interface IPageDataContext {
|
|
22
|
+
page?: IPageContext;
|
|
23
|
+
blocks: Record<string, IBlockContext>;
|
|
24
|
+
}
|
|
25
|
+
//# sourceMappingURL=types.d.ts.map
|
|
@@ -0,0 +1,9 @@
|
|
|
1
|
+
export declare const useContentEngine: (field_key: string) => {
|
|
2
|
+
query: Record<string, any>;
|
|
3
|
+
setQuery: (newQuery: Record<string, any>) => void;
|
|
4
|
+
loading: boolean;
|
|
5
|
+
data: any;
|
|
6
|
+
meta: import('@levo-so/core').IMeta | undefined;
|
|
7
|
+
};
|
|
8
|
+
export default useContentEngine;
|
|
9
|
+
//# sourceMappingURL=useContentEngine.d.ts.map
|