@qwanyx/ai-editor 1.4.3 → 1.4.5
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.
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"file":"PageEditor.d.ts","sourceRoot":"","sources":["../../src/components/PageEditor.tsx"],"names":[],"mappings":"AAGA,OAAO,EACL,YAAY,EAOb,MAAM,eAAe,CAAA;
|
|
1
|
+
{"version":3,"file":"PageEditor.d.ts","sourceRoot":"","sources":["../../src/components/PageEditor.tsx"],"names":[],"mappings":"AAGA,OAAO,EACL,YAAY,EAOb,MAAM,eAAe,CAAA;AAqsBtB,MAAM,WAAW,eAAe;IAC9B,eAAe,CAAC,EAAE,YAAY,CAAA;IAC9B,QAAQ,CAAC,EAAE,CAAC,QAAQ,EAAE,YAAY,KAAK,IAAI,CAAA;IAC3C,SAAS,CAAC,EAAE,MAAM,CAAA;IAClB,SAAS,CAAC,EAAE,OAAO,CAAA;CACpB;AAED,wBAAgB,UAAU,CAAC,EACzB,eAAe,EACf,QAAQ,EACR,SAAS,EACT,SAAgB,GACjB,EAAE,eAAe,2CAYjB;AAED,eAAe,UAAU,CAAA"}
|
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"file":"Section.d.ts","sourceRoot":"","sources":["../../src/components/Section.tsx"],"names":[],"mappings":"AAGA,OAAO,EAAE,OAAO,IAAI,WAAW,EAAE,MAAM,eAAe,CAAA;
|
|
1
|
+
{"version":3,"file":"Section.d.ts","sourceRoot":"","sources":["../../src/components/Section.tsx"],"names":[],"mappings":"AAGA,OAAO,EAAE,OAAO,IAAI,WAAW,EAAE,MAAM,eAAe,CAAA;AAqLtD,UAAU,qBAAqB;IAC7B,OAAO,EAAE,WAAW,CAAA;IACpB,KAAK,EAAE,MAAM,CAAA;IACb,aAAa,EAAE,MAAM,CAAA;IACrB,aAAa,CAAC,EAAE,OAAO,CAAA;CACxB;AAED,wBAAgB,gBAAgB,CAAC,EAAE,OAAO,EAAE,KAAK,EAAE,aAAa,EAAE,aAAqB,EAAE,EAAE,qBAAqB,2CA8D/G;AAED,eAAe,gBAAgB,CAAA"}
|
|
@@ -11,56 +11,53 @@ const PageContext_1 = require("../context/PageContext");
|
|
|
11
11
|
// ============================================
|
|
12
12
|
const styles = {
|
|
13
13
|
container: {
|
|
14
|
-
|
|
14
|
+
marginBottom: '1rem',
|
|
15
15
|
},
|
|
16
|
-
|
|
17
|
-
|
|
18
|
-
|
|
19
|
-
|
|
20
|
-
|
|
21
|
-
|
|
22
|
-
|
|
23
|
-
|
|
16
|
+
// Section toolbar - always visible in edit mode
|
|
17
|
+
sectionToolbar: {
|
|
18
|
+
display: 'flex',
|
|
19
|
+
alignItems: 'center',
|
|
20
|
+
gap: '0.5rem',
|
|
21
|
+
padding: '0.25rem 0.5rem',
|
|
22
|
+
backgroundColor: '#f8f9fa',
|
|
23
|
+
borderBottom: '1px solid #e9ecef',
|
|
24
|
+
fontSize: '0.75rem',
|
|
25
|
+
color: '#666',
|
|
24
26
|
},
|
|
25
|
-
|
|
26
|
-
|
|
27
|
-
|
|
27
|
+
toolbarLabel: {
|
|
28
|
+
fontWeight: 500,
|
|
29
|
+
marginRight: '0.5rem',
|
|
28
30
|
},
|
|
29
|
-
|
|
30
|
-
position: 'absolute',
|
|
31
|
-
top: '8px',
|
|
32
|
-
left: '8px',
|
|
31
|
+
toolbarActions: {
|
|
33
32
|
display: 'flex',
|
|
34
33
|
gap: '0.25rem',
|
|
35
|
-
|
|
36
|
-
padding: '0.25rem',
|
|
37
|
-
borderRadius: '4px',
|
|
38
|
-
boxShadow: '0 2px 8px rgba(0,0,0,0.15)',
|
|
39
|
-
zIndex: 10,
|
|
34
|
+
marginLeft: 'auto',
|
|
40
35
|
},
|
|
41
|
-
|
|
42
|
-
padding: '0.5rem',
|
|
36
|
+
toolbarBtn: {
|
|
37
|
+
padding: '0.25rem 0.5rem',
|
|
43
38
|
border: 'none',
|
|
44
|
-
borderRadius: '
|
|
39
|
+
borderRadius: '3px',
|
|
45
40
|
backgroundColor: 'transparent',
|
|
46
41
|
cursor: 'pointer',
|
|
47
|
-
fontSize: '
|
|
42
|
+
fontSize: '0.75rem',
|
|
43
|
+
color: '#666',
|
|
48
44
|
display: 'flex',
|
|
49
45
|
alignItems: 'center',
|
|
50
|
-
|
|
51
|
-
minWidth: '32px',
|
|
52
|
-
transition: 'background-color 0.2s',
|
|
46
|
+
gap: '0.25rem',
|
|
53
47
|
},
|
|
54
|
-
|
|
55
|
-
backgroundColor: '#
|
|
48
|
+
toolbarBtnHover: {
|
|
49
|
+
backgroundColor: '#e9ecef',
|
|
56
50
|
},
|
|
57
|
-
|
|
51
|
+
toolbarBtnDanger: {
|
|
58
52
|
color: '#dc3545',
|
|
59
53
|
},
|
|
60
|
-
|
|
61
|
-
|
|
62
|
-
|
|
63
|
-
|
|
54
|
+
wrapper: {
|
|
55
|
+
border: '1px solid #e9ecef',
|
|
56
|
+
borderTop: 'none',
|
|
57
|
+
},
|
|
58
|
+
wrapperSelected: {
|
|
59
|
+
borderColor: '#007bff',
|
|
60
|
+
boxShadow: '0 0 0 2px rgba(0, 123, 255, 0.1)',
|
|
64
61
|
},
|
|
65
62
|
emptyLayout: {
|
|
66
63
|
padding: '2rem',
|
|
@@ -73,25 +70,36 @@ const styles = {
|
|
|
73
70
|
};
|
|
74
71
|
function ToolbarButton({ onClick, title, children, danger, disabled }) {
|
|
75
72
|
const [isHovered, setIsHovered] = (0, react_1.useState)(false);
|
|
76
|
-
return ((0, jsx_runtime_1.jsx)("button", { onClick:
|
|
77
|
-
|
|
78
|
-
|
|
79
|
-
|
|
73
|
+
return ((0, jsx_runtime_1.jsx)("button", { onClick: (e) => {
|
|
74
|
+
e.stopPropagation();
|
|
75
|
+
onClick();
|
|
76
|
+
}, title: title, disabled: disabled, style: {
|
|
77
|
+
...styles.toolbarBtn,
|
|
78
|
+
...(isHovered ? styles.toolbarBtnHover : {}),
|
|
79
|
+
...(danger ? styles.toolbarBtnDanger : {}),
|
|
80
80
|
opacity: disabled ? 0.5 : 1,
|
|
81
81
|
cursor: disabled ? 'not-allowed' : 'pointer',
|
|
82
82
|
}, onMouseEnter: () => setIsHovered(true), onMouseLeave: () => setIsHovered(false), children: children }));
|
|
83
83
|
}
|
|
84
|
-
function SectionToolbar({ sectionId, canMoveUp, canMoveDown }) {
|
|
84
|
+
function SectionToolbar({ sectionId, layoutType, index, canMoveUp, canMoveDown, isSelected, onSelect }) {
|
|
85
85
|
const { moveSection, deleteSection, duplicateSection } = (0, PageContext_1.usePageContext)();
|
|
86
|
-
return ((0, jsx_runtime_1.jsxs)("div", { style:
|
|
87
|
-
|
|
88
|
-
|
|
89
|
-
|
|
90
|
-
|
|
86
|
+
return ((0, jsx_runtime_1.jsxs)("div", { style: {
|
|
87
|
+
...styles.sectionToolbar,
|
|
88
|
+
backgroundColor: isSelected ? '#e7f1ff' : '#f8f9fa',
|
|
89
|
+
borderTop: '1px solid #e9ecef',
|
|
90
|
+
borderLeft: '1px solid #e9ecef',
|
|
91
|
+
borderRight: '1px solid #e9ecef',
|
|
92
|
+
borderTopLeftRadius: '4px',
|
|
93
|
+
borderTopRightRadius: '4px',
|
|
94
|
+
cursor: 'pointer',
|
|
95
|
+
}, onClick: onSelect, children: [(0, jsx_runtime_1.jsxs)("span", { style: styles.toolbarLabel, children: ["\u00A7", index + 1] }), (0, jsx_runtime_1.jsx)("span", { style: { color: '#999' }, children: layoutType }), (0, jsx_runtime_1.jsxs)("div", { style: styles.toolbarActions, children: [(0, jsx_runtime_1.jsx)(ToolbarButton, { onClick: () => moveSection(sectionId, 'up'), title: "Monter", disabled: !canMoveUp, children: "\u2191" }), (0, jsx_runtime_1.jsx)(ToolbarButton, { onClick: () => moveSection(sectionId, 'down'), title: "Descendre", disabled: !canMoveDown, children: "\u2193" }), (0, jsx_runtime_1.jsx)(ToolbarButton, { onClick: () => duplicateSection(sectionId), title: "Dupliquer", children: "\u29C9" }), (0, jsx_runtime_1.jsx)(ToolbarButton, { onClick: () => {
|
|
96
|
+
if (window.confirm('Supprimer cette section ?')) {
|
|
97
|
+
deleteSection(sectionId);
|
|
98
|
+
}
|
|
99
|
+
}, title: "Supprimer", danger: true, children: "\u2715" })] })] }));
|
|
91
100
|
}
|
|
92
101
|
function SectionComponent({ section, index, totalSections, isPreviewMode = false }) {
|
|
93
102
|
const { isEditing, updateSection, selectedSectionId, selectSection } = (0, PageContext_1.usePageContext)();
|
|
94
|
-
const [isHovered, setIsHovered] = (0, react_1.useState)(false);
|
|
95
103
|
const isSelected = selectedSectionId === section.id;
|
|
96
104
|
const showEditingUI = isEditing && !isPreviewMode;
|
|
97
105
|
const LayoutComponent = (0, layouts_1.getLayoutComponent)(section.layoutType);
|
|
@@ -100,19 +108,20 @@ function SectionComponent({ section, index, totalSections, isPreviewMode = false
|
|
|
100
108
|
}, [section.id, updateSection]);
|
|
101
109
|
const wrapperStyle = {
|
|
102
110
|
...styles.wrapper,
|
|
103
|
-
...(isHovered && showEditingUI ? styles.wrapperHover : {}),
|
|
104
111
|
...(isSelected && showEditingUI ? styles.wrapperSelected : {}),
|
|
105
112
|
backgroundColor: section.backgroundColor || 'transparent',
|
|
106
113
|
padding: section.padding || 0,
|
|
114
|
+
borderBottomLeftRadius: '4px',
|
|
115
|
+
borderBottomRightRadius: '4px',
|
|
107
116
|
};
|
|
108
117
|
if (!LayoutComponent) {
|
|
109
118
|
return ((0, jsx_runtime_1.jsx)("div", { style: styles.container, children: (0, jsx_runtime_1.jsxs)("div", { style: styles.emptyLayout, children: ["Layout \"", section.layoutType, "\" non trouv\u00E9"] }) }));
|
|
110
119
|
}
|
|
111
|
-
const
|
|
120
|
+
const handleSelect = () => {
|
|
112
121
|
if (showEditingUI) {
|
|
113
122
|
selectSection(section.id);
|
|
114
123
|
}
|
|
115
124
|
};
|
|
116
|
-
return ((0, jsx_runtime_1.
|
|
125
|
+
return ((0, jsx_runtime_1.jsxs)("div", { style: styles.container, children: [showEditingUI && ((0, jsx_runtime_1.jsx)(SectionToolbar, { sectionId: section.id, layoutType: section.layoutType, index: index, canMoveUp: index > 0, canMoveDown: index < totalSections - 1, isSelected: isSelected, onSelect: handleSelect })), (0, jsx_runtime_1.jsx)("div", { style: wrapperStyle, className: section.className, children: (0, jsx_runtime_1.jsx)(LayoutComponent, { section: section, isEditing: showEditingUI, onContentChange: handleContentChange }) })] }));
|
|
117
126
|
}
|
|
118
127
|
exports.default = SectionComponent;
|