@cntrl-site/components 1.0.12-alpha.2 → 1.0.12-alpha.20

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.
@@ -4,10 +4,12 @@ type FormProps = {
4
4
  settings: FormSettings;
5
5
  content?: unknown;
6
6
  isEditor?: boolean;
7
+ isEditMode?: boolean;
8
+ isPreviewMode?: boolean;
7
9
  activeEvent: string | undefined;
8
10
  onUpdateSettings?: (settings: FormSettings) => void;
9
11
  } & CommonComponentProps;
10
- export declare function Form({ settings, isEditor, metadata, activeEvent }: FormProps): import("react/jsx-runtime").JSX.Element;
12
+ export declare function Form({ settings, isEditor, isEditMode, isPreviewMode, metadata, activeEvent }: FormProps): import("react/jsx-runtime").JSX.Element;
11
13
  export type FormFieldType = 'text' | 'textarea' | 'phone' | 'email';
12
14
  export type FormFieldItem = {
13
15
  name: string;
@@ -518,14 +518,14 @@ export declare const FormComponent: {
518
518
  fieldsToShow: number;
519
519
  fields: ({
520
520
  name: string;
521
- type: "email";
521
+ type: "text";
522
522
  placeholder: string;
523
523
  label: string;
524
524
  isRequired: boolean;
525
525
  error: string;
526
526
  } | {
527
527
  name: string;
528
- type: "text";
528
+ type: "email";
529
529
  placeholder: string;
530
530
  label: string;
531
531
  isRequired: boolean;
@@ -701,23 +701,11 @@ export declare const FormComponent: {
701
701
  } | {
702
702
  type: "group";
703
703
  title: string;
704
- items: ({
704
+ items: {
705
705
  type: "row";
706
706
  title: string;
707
- items: {
708
- type: "group";
709
- title: string;
710
- items: string[];
711
- }[];
712
- } | {
713
- type: "group";
714
- title: string;
715
- items: {
716
- type: "row";
717
- title: string;
718
- items: string[];
719
- }[];
720
- })[];
707
+ items: string[];
708
+ }[];
721
709
  })[];
722
710
  } | {
723
711
  id: string;
@@ -6,10 +6,11 @@ type GridProps = {
6
6
  content?: any;
7
7
  isEditor?: boolean;
8
8
  isPreviewMode?: boolean;
9
+ isEditMode?: boolean;
9
10
  activeEvent: string | undefined;
10
11
  onUpdateSettings?: (settings: GridSettings) => void;
11
12
  } & CommonComponentProps;
12
- export declare function Grid({ settings, content, isEditor, isPreviewMode, metadata, activeEvent, layoutId }: GridProps): import("react/jsx-runtime").JSX.Element;
13
+ export declare function Grid({ settings, content, isEditor, isPreviewMode, isEditMode, metadata, activeEvent, layoutId }: GridProps): import("react/jsx-runtime").JSX.Element;
13
14
  type GridLayoutConfig = {
14
15
  entryWidth: number;
15
16
  horizontalGap: number;
@@ -18,7 +19,7 @@ type GridLayoutConfig = {
18
19
  lockedParam?: 'wrapperWidth' | 'entryWidth' | 'horizontalGap' | null;
19
20
  };
20
21
  type GridSettings = {
21
- type: 'A' | 'B';
22
+ type: 'A' | 'B' | 'C';
22
23
  gridLayout: GridLayoutConfig;
23
24
  textBoxWidth: number;
24
25
  verticalGap: number;
@@ -29,14 +30,20 @@ type GridSettings = {
29
30
  ratioValue: '1:1' | '2:3' | '3:4' | '4:5' | '16:9';
30
31
  reversed: boolean;
31
32
  };
33
+ lightboxImageDisplay?: 'Fit' | 'Cover' | {
34
+ display?: 'Fit' | 'Cover';
35
+ };
32
36
  slider: 'On' | 'Off';
33
37
  sliderTiming: number;
34
38
  direction: 'Horizontal' | 'Vertical' | 'Random';
35
39
  transition: 'Fade' | 'Slide';
40
+ showText: 'Always' | 'On hover';
41
+ alignEntries: 'On' | 'Off';
36
42
  titleMarginTop: number;
37
43
  subtitleMarginTop: number;
38
44
  titleColor: string;
39
45
  subtitleColor: string;
46
+ lightboxCounterColor: string;
40
47
  titleFontFamily: string;
41
48
  titleFontSettings?: {
42
49
  fontWeight: number;
@@ -57,5 +64,15 @@ type GridSettings = {
57
64
  subtitleLetterSpacing?: number;
58
65
  subtitleWordSpacing?: number;
59
66
  subtitleTextAppearance?: TextStyles['textAppearance'];
67
+ lightboxCounterFontFamily: string;
68
+ lightboxCounterFontSettings?: {
69
+ fontWeight: number;
70
+ fontStyle: string;
71
+ };
72
+ lightboxCounterFontSize?: number;
73
+ lightboxCounterLineHeight?: number;
74
+ lightboxCounterLetterSpacing?: number;
75
+ lightboxCounterWordSpacing?: number;
76
+ lightboxCounterTextAppearance?: TextStyles['textAppearance'];
60
77
  };
61
78
  export {};
@@ -7,8 +7,9 @@ type LightboxGalleryProps = {
7
7
  portalId: string;
8
8
  activeEvent: 'close' | 'open';
9
9
  isEditor?: boolean;
10
+ isPreviewMode?: boolean;
10
11
  };
11
- export declare const LightboxGallery: ({ settings, content, styles, portalId, activeEvent, isEditor }: LightboxGalleryProps) => import("react/jsx-runtime").JSX.Element;
12
+ export declare const LightboxGallery: ({ settings, content, styles, portalId, activeEvent, isEditor, isPreviewMode }: LightboxGalleryProps) => import("react/jsx-runtime").JSX.Element;
12
13
  type LightboxImage = {
13
14
  image: {
14
15
  url: string;
@@ -1,5 +1,6 @@
1
1
  import { CommonComponentProps } from '../props';
2
2
  import { TextStyles } from '../utils/textStylesToCss';
3
+ import { LayoutItem, LayoutTab } from '../../types/SchemaV1';
3
4
  type ListFontSettings = {
4
5
  fontWeight: number;
5
6
  fontStyle: string;
@@ -13,6 +14,7 @@ type ListColumnTextStyleOverrides = {
13
14
  AColumnTextLineHeight?: number;
14
15
  AColumnTextLetterSpacing?: number;
15
16
  AColumnTextWordSpacing?: number;
17
+ AColumnTextTextAlign?: 'left' | 'center' | 'right' | 'justify';
16
18
  AColumnTextTextAppearance?: TextStyles['textAppearance'];
17
19
  BColumnVerticalAlign?: string;
18
20
  BColumnTextFontFamily?: string;
@@ -21,6 +23,7 @@ type ListColumnTextStyleOverrides = {
21
23
  BColumnTextLineHeight?: number;
22
24
  BColumnTextLetterSpacing?: number;
23
25
  BColumnTextWordSpacing?: number;
26
+ BColumnTextTextAlign?: 'left' | 'center' | 'right' | 'justify';
24
27
  BColumnTextTextAppearance?: TextStyles['textAppearance'];
25
28
  CColumnVerticalAlign?: string;
26
29
  CColumnTextFontFamily?: string;
@@ -29,6 +32,7 @@ type ListColumnTextStyleOverrides = {
29
32
  CColumnTextLineHeight?: number;
30
33
  CColumnTextLetterSpacing?: number;
31
34
  CColumnTextWordSpacing?: number;
35
+ CColumnTextTextAlign?: 'left' | 'center' | 'right' | 'justify';
32
36
  CColumnTextTextAppearance?: TextStyles['textAppearance'];
33
37
  DColumnVerticalAlign?: string;
34
38
  DColumnTextFontFamily?: string;
@@ -37,6 +41,7 @@ type ListColumnTextStyleOverrides = {
37
41
  DColumnTextLineHeight?: number;
38
42
  DColumnTextLetterSpacing?: number;
39
43
  DColumnTextWordSpacing?: number;
44
+ DColumnTextTextAlign?: 'left' | 'center' | 'right' | 'justify';
40
45
  DColumnTextTextAppearance?: TextStyles['textAppearance'];
41
46
  EColumnVerticalAlign?: string;
42
47
  EColumnTextFontFamily?: string;
@@ -45,6 +50,7 @@ type ListColumnTextStyleOverrides = {
45
50
  EColumnTextLineHeight?: number;
46
51
  EColumnTextLetterSpacing?: number;
47
52
  EColumnTextWordSpacing?: number;
53
+ EColumnTextTextAlign?: 'left' | 'center' | 'right' | 'justify';
48
54
  EColumnTextTextAppearance?: TextStyles['textAppearance'];
49
55
  cutLabelTextFontFamily?: string;
50
56
  cutLabelTextFontSettings?: ListFontSettings;
@@ -52,7 +58,9 @@ type ListColumnTextStyleOverrides = {
52
58
  cutLabelTextLineHeight?: number;
53
59
  cutLabelTextLetterSpacing?: number;
54
60
  cutLabelTextWordSpacing?: number;
61
+ cutLabelTextTextAlign?: 'left' | 'center' | 'right' | 'justify';
55
62
  cutLabelTextTextAppearance?: TextStyles['textAppearance'];
63
+ cutLabelVerticalAlign?: string;
56
64
  };
57
65
  export type ListColumnVerticalAlignKey = `${ListColumnPrefix}VerticalAlign`;
58
66
  export type ListSettings = {
@@ -73,6 +81,7 @@ export type ListSettings = {
73
81
  cutCellMinHeight: number;
74
82
  cutLabel: string;
75
83
  entryHoverEffect: 'None' | 'Default' | 'Blinds';
84
+ entryHoverShowOption: 'Always' | 'Link only';
76
85
  rowPaddingTop: number;
77
86
  rowPaddingBottom: number;
78
87
  rowPaddingTopB: number;
@@ -99,13 +108,6 @@ export type ListSettings = {
99
108
  columnsOrder?: string[];
100
109
  textPaddingLR?: number;
101
110
  textColor: string;
102
- textFontFamily: string;
103
- textFontSettings?: ListFontSettings;
104
- textFontSize?: number;
105
- textLineHeight?: number;
106
- textLetterSpacing?: number;
107
- textWordSpacing?: number;
108
- textTextAppearance?: TextStyles['textAppearance'];
109
111
  backgroundColor: string;
110
112
  dividerColor: string;
111
113
  textHoverColor: string;
@@ -131,6 +133,7 @@ type ListProps = {
131
133
  content?: ListContentItem[];
132
134
  isEditor?: boolean;
133
135
  isPreviewMode?: boolean;
136
+ isEditMode?: boolean;
134
137
  activeEvent: string | undefined;
135
138
  onUpdateSettings?: (settings: ListSettings) => void;
136
139
  } & CommonComponentProps;
@@ -142,13 +145,17 @@ export type ListTextStylePrefix = typeof LIST_TEXT_STYLE_PREFIXES[number];
142
145
  export declare const LIST_COLUMN_LETTERS: readonly ["A", "B", "C", "D", "E"];
143
146
  export declare function getListColumnVerticalAlignSettingKey(columnLetter: string): string;
144
147
  export declare const COLUMN_VALIGN_BASIC_OPTIONS: readonly ["Top", "Center", "Bottom"];
148
+ export declare function normalizeListColumnVerticalAlign(value: string | undefined): string;
145
149
  export declare function isBaselineAnchorColumnVerticalAlign(value: string | undefined): boolean;
146
150
  export declare function parseBaselineAnchorLetter(value: string | undefined): string | null;
147
151
  export declare function isValidColumnBaselineVAlign(value: string | undefined, forColumnLetter: string, settings: ListSettings): boolean;
148
152
  export declare function getColumnVerticalAlignOptionsForLetter(columnLetter: string, settings: ListSettings): string[];
149
- export declare const LIST_GLOBAL_TEXT_STYLE_KEYS: readonly ["textFontFamily", "textFontSettings", "textFontSize", "textLineHeight", "textLetterSpacing", "textWordSpacing", "textTextAppearance"];
153
+ export declare const LIST_GLOBAL_TEXT_STYLE_KEYS: readonly ["textFontFamily", "textFontSettings", "textFontSize", "textLineHeight", "textLetterSpacing", "textWordSpacing", "textTextAlign", "textTextAppearance"];
150
154
  export type ListGlobalTextStyleKey = typeof LIST_GLOBAL_TEXT_STYLE_KEYS[number];
151
155
  export declare function getListColumnTextSettingKey(prefix: ListTextStylePrefix, globalKey: ListGlobalTextStyleKey): string;
156
+ export declare const LIST_TEXT_STYLE_TAB_LABELS: Record<ListTextStylePrefix, string>;
157
+ export declare function createListTextStyleTabContentItems(prefix: ListTextStylePrefix): LayoutItem[];
158
+ export declare function createListTextStylePanelTab(): LayoutTab;
152
159
  declare const COLUMN_WIDTH_KEYS: readonly ["AColumnWidth", "BColumnWidth", "CColumnWidth", "DColumnWidth", "EColumnWidth"];
153
160
  type ColumnWidthKey = typeof COLUMN_WIDTH_KEYS[number];
154
161
  export declare function getListMinColumnWidth(designWidthPx?: number): number;
@@ -163,5 +170,5 @@ export declare function resolveListColumnWidths(columns: number, wrapperWidth: n
163
170
  export declare function applyListSettingsChange(nextSettings: ListSettings, prevSettings: ListSettings, options?: {
164
171
  designWidth?: number;
165
172
  }): ListSettings;
166
- export declare function List({ settings, content, isEditor, isPreviewMode, activeEvent, layoutId, onUpdateSettings }: ListProps): import("react/jsx-runtime").JSX.Element;
173
+ export declare function List({ settings, content, isEditor, isPreviewMode, isEditMode, activeEvent, layoutId, onUpdateSettings }: ListProps): import("react/jsx-runtime").JSX.Element;
167
174
  export {};
@@ -1,5 +1,5 @@
1
1
  import { CommonComponentProps } from '../props';
2
- export declare const Marquee: ({ settings, content, isEditor, isPreviewMode }: MarqueeProps) => import("react/jsx-runtime").JSX.Element;
2
+ export declare const Marquee: ({ settings, content, isEditor, isPreviewMode, isEditMode }: MarqueeProps) => import("react/jsx-runtime").JSX.Element;
3
3
  export type MarqueeItem = {
4
4
  image?: {
5
5
  url?: string;
@@ -11,16 +11,21 @@ export type MarqueeSettings = {
11
11
  speed: number;
12
12
  direction: 'left' | 'right';
13
13
  pauseOnHover: 'on' | 'off';
14
- hoverEffect: 'off' | 'brightness' | 'grayscale' | 'saturate' | 'randomize';
14
+ hoverEffect: 'off' | 'brightness' | 'grayscale' | 'randomize';
15
15
  gap: number;
16
16
  imageMaxWidth: number;
17
17
  imageMaxHeight: number;
18
- imageFit: 'cover' | 'contain';
18
+ imageFit: {
19
+ display: 'Fit' | 'Cover';
20
+ ratioValue: '1:1' | '2:3' | '3:4' | '4:5' | '16:9';
21
+ reversed: boolean;
22
+ };
19
23
  };
20
24
  type MarqueeProps = {
21
25
  settings: MarqueeSettings;
22
26
  content?: MarqueeItem[];
23
27
  isEditor?: boolean;
24
28
  isPreviewMode?: boolean;
29
+ isEditMode?: boolean;
25
30
  } & CommonComponentProps;
26
31
  export {};
@@ -1,10 +1,11 @@
1
1
  import { ComponentSchemaV1 } from '../../types/SchemaV1';
2
2
  export declare const MarqueeComponent: {
3
- element: ({ settings, content, isEditor, isPreviewMode }: {
3
+ element: ({ settings, content, isEditor, isPreviewMode, isEditMode }: {
4
4
  settings: import('./Marquee').MarqueeSettings;
5
5
  content?: import('./Marquee').MarqueeItem[];
6
6
  isEditor?: boolean;
7
7
  isPreviewMode?: boolean;
8
+ isEditMode?: boolean;
8
9
  } & import('../props').CommonComponentProps) => import("react/jsx-runtime").JSX.Element;
9
10
  id: string;
10
11
  name: string;
@@ -4,9 +4,10 @@ type OnelinerFormProps = {
4
4
  settings: OnelinerFormSettings;
5
5
  content?: unknown;
6
6
  isEditor?: boolean;
7
+ isPreviewMode?: boolean;
7
8
  activeEvent?: string;
8
9
  } & CommonComponentProps;
9
- export declare const OnelinerForm: ({ settings, isEditor, metadata, activeEvent }: OnelinerFormProps) => import("react/jsx-runtime").JSX.Element;
10
+ export declare const OnelinerForm: ({ settings, isEditor, isPreviewMode, metadata, activeEvent }: OnelinerFormProps) => import("react/jsx-runtime").JSX.Element;
10
11
  type FieldConfig = {
11
12
  name: string;
12
13
  type: 'text' | 'phone' | 'email';
@@ -1,8 +1,9 @@
1
1
  export declare const OnelinerFormComponent: {
2
- element: ({ settings, isEditor, metadata, activeEvent }: {
2
+ element: ({ settings, isEditor, isPreviewMode, metadata, activeEvent }: {
3
3
  settings: import('./OnelinerForm').OnelinerFormSettings;
4
4
  content?: unknown;
5
5
  isEditor?: boolean;
6
+ isPreviewMode?: boolean;
6
7
  activeEvent?: string;
7
8
  } & import('../props').CommonComponentProps) => import("react/jsx-runtime").JSX.Element;
8
9
  id: string;
@@ -4,8 +4,9 @@ type TestimonialsProps = {
4
4
  content?: TestimonialsItem[];
5
5
  isEditor?: boolean;
6
6
  isPreviewMode?: boolean;
7
+ isEditMode?: boolean;
7
8
  } & CommonComponentProps;
8
- export declare const TestimonialGrid: ({ settings, content, isEditor, isPreviewMode }: TestimonialsProps) => import("react/jsx-runtime").JSX.Element;
9
+ export declare const TestimonialGrid: ({ settings, content, isEditor, isPreviewMode, isEditMode }: TestimonialsProps) => import("react/jsx-runtime").JSX.Element;
9
10
  export type TestimonialsItem = {
10
11
  logo?: {
11
12
  url?: string;
@@ -1,6 +1,6 @@
1
1
  import { ComponentSchemaV1 } from '../../types/SchemaV1';
2
2
  export declare const TestimonialGridComponent: {
3
- element: ({ settings, content, isEditor, isPreviewMode }: {
3
+ element: ({ settings, content, isEditor, isPreviewMode, isEditMode }: {
4
4
  settings: {
5
5
  autoplay: "on" | "off";
6
6
  speed: number;
@@ -27,6 +27,7 @@ export declare const TestimonialGridComponent: {
27
27
  content?: import('./TestimonialGrid').TestimonialsItem[];
28
28
  isEditor?: boolean;
29
29
  isPreviewMode?: boolean;
30
+ isEditMode?: boolean;
30
31
  } & import('../props').CommonComponentProps) => import("react/jsx-runtime").JSX.Element;
31
32
  id: string;
32
33
  name: string;
@@ -4,8 +4,9 @@ type TestimonialsProps = {
4
4
  content?: TestimonialsItem[];
5
5
  isEditor?: boolean;
6
6
  isPreviewMode?: boolean;
7
+ isEditMode?: boolean;
7
8
  } & CommonComponentProps;
8
- export declare const TestimonialSingle: ({ settings, content, isEditor, isPreviewMode }: TestimonialsProps) => import("react/jsx-runtime").JSX.Element;
9
+ export declare const TestimonialSingle: ({ settings, content, isEditor, isPreviewMode, isEditMode }: TestimonialsProps) => import("react/jsx-runtime").JSX.Element;
9
10
  export type TestimonialsItem = {
10
11
  image?: {
11
12
  url?: string;
@@ -1,6 +1,6 @@
1
1
  import { ComponentSchemaV1 } from '../../types/SchemaV1';
2
2
  export declare const TestimonialSingleComponent: {
3
- element: ({ settings, content, isEditor, isPreviewMode }: {
3
+ element: ({ settings, content, isEditor, isPreviewMode, isEditMode }: {
4
4
  settings: {
5
5
  autoplay: "on" | "off";
6
6
  delay: number;
@@ -22,6 +22,7 @@ export declare const TestimonialSingleComponent: {
22
22
  content?: import('./TestimonialSingle').TestimonialsItem[];
23
23
  isEditor?: boolean;
24
24
  isPreviewMode?: boolean;
25
+ isEditMode?: boolean;
25
26
  } & import('../props').CommonComponentProps) => import("react/jsx-runtime").JSX.Element;
26
27
  id: string;
27
28
  name: string;
@@ -14,6 +14,7 @@ export type TextStyles = {
14
14
  textDecoration?: string;
15
15
  fontVariant?: string;
16
16
  };
17
+ textAlign?: 'left' | 'center' | 'right' | 'justify';
17
18
  color: string;
18
19
  };
19
20
  export declare const normalizeFontFamilyCssValue: (fontFamily?: string) => string | undefined;
package/dist/index.d.ts CHANGED
@@ -1,3 +1,3 @@
1
1
  export { type Component, isSchemaV1 } from './types/Component';
2
- export type { ComponentSchemaV1, SchemaProperty, PropertyScope, LayoutItem, LayoutRow, LayoutGroup, LayoutSwitcher, SchemaSection, SchemaPanel, SchemaDisplay } from './types/SchemaV1';
2
+ export type { ComponentSchemaV1, SchemaProperty, PropertyScope, LayoutItem, LayoutRow, LayoutGroup, LayoutSwitcher, LayoutTab, SchemaSection, SchemaPanel, SchemaDisplay } from './types/SchemaV1';
3
3
  export { components } from './Components/components';