@griddo/ax 11.10.13-rc.1 → 11.10.13
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/package.json +2 -2
- package/src/api/config.tsx +2 -2
- package/src/components/Fields/CheckField/index.tsx +5 -4
- package/src/components/Fields/ReferenceField/AutoPanel/index.tsx +17 -17
- package/src/components/Fields/UniqueCheck/index.tsx +16 -21
- package/src/components/Tooltip/index.tsx +20 -35
- package/src/schemas/pages/GlobalPage.tsx +0 -17
- package/src/schemas/pages/Page.tsx +0 -17
- package/src/components/Fields/UniqueCheck/style.tsx +0 -17
package/package.json
CHANGED
|
@@ -1,7 +1,7 @@
|
|
|
1
1
|
{
|
|
2
2
|
"name": "@griddo/ax",
|
|
3
3
|
"description": "Griddo Author Experience",
|
|
4
|
-
"version": "11.10.13
|
|
4
|
+
"version": "11.10.13",
|
|
5
5
|
"authors": [
|
|
6
6
|
"Álvaro Sánchez' <alvaro.sanches@secuoyas.com>",
|
|
7
7
|
"Diego M. Béjar <diego.bejar@secuoyas.com>",
|
|
@@ -217,5 +217,5 @@
|
|
|
217
217
|
"publishConfig": {
|
|
218
218
|
"access": "public"
|
|
219
219
|
},
|
|
220
|
-
"gitHead": "
|
|
220
|
+
"gitHead": "5ef68e06e83afec7cac87f0bcea17863f3bc5a91"
|
|
221
221
|
}
|
package/src/api/config.tsx
CHANGED
|
@@ -6,8 +6,8 @@ const headers = {
|
|
|
6
6
|
"Content-type": "application/json; charset=UTF-8",
|
|
7
7
|
accept: "application/json",
|
|
8
8
|
"x-application-id": "griddo-ax",
|
|
9
|
-
|
|
10
|
-
|
|
9
|
+
"x-client-version": packageJson.version,
|
|
10
|
+
"x-client-name": "AX",
|
|
11
11
|
};
|
|
12
12
|
|
|
13
13
|
export const template = {
|
|
@@ -1,5 +1,6 @@
|
|
|
1
|
+
import React from "react";
|
|
2
|
+
import { ICheck } from "@ax/types";
|
|
1
3
|
import Icon from "@ax/components/Icon";
|
|
2
|
-
import type { ICheck } from "@ax/types";
|
|
3
4
|
|
|
4
5
|
import * as S from "./style";
|
|
5
6
|
|
|
@@ -22,12 +23,12 @@ const CheckField = (props: ICheckFieldProps): JSX.Element => {
|
|
|
22
23
|
|
|
23
24
|
const handleChange = (e: React.ChangeEvent<HTMLInputElement>) => {
|
|
24
25
|
const isChecked = e.target.checked;
|
|
25
|
-
onChange
|
|
26
|
+
onChange && onChange({ value, isChecked });
|
|
26
27
|
};
|
|
27
28
|
|
|
28
|
-
const handleMouseOver = () => setHoverCheck
|
|
29
|
+
const handleMouseOver = () => setHoverCheck && setHoverCheck(true);
|
|
29
30
|
|
|
30
|
-
const handleMouseLeave = () => setHoverCheck
|
|
31
|
+
const handleMouseLeave = () => setHoverCheck && setHoverCheck(false);
|
|
31
32
|
|
|
32
33
|
return (
|
|
33
34
|
<S.Wrapper className={className}>
|
|
@@ -1,7 +1,7 @@
|
|
|
1
|
-
import { useState } from "react";
|
|
1
|
+
import React, { useState } from "react";
|
|
2
2
|
import { connect } from "react-redux";
|
|
3
3
|
|
|
4
|
-
import
|
|
4
|
+
import { IDataSource, ILanguage, IRootState, ISchemaField, ISite, IStructuredData } from "@ax/types";
|
|
5
5
|
import {
|
|
6
6
|
Button,
|
|
7
7
|
FloatingMenu,
|
|
@@ -14,8 +14,7 @@ import {
|
|
|
14
14
|
UniqueCheck,
|
|
15
15
|
} from "@ax/components";
|
|
16
16
|
|
|
17
|
-
import
|
|
18
|
-
import { useReference } from "../Context";
|
|
17
|
+
import { IReferenceState, IRefField, ISource, useReference } from "../Context";
|
|
19
18
|
import AutoItem from "./AutoItem";
|
|
20
19
|
|
|
21
20
|
import * as S from "./style";
|
|
@@ -37,9 +36,9 @@ const AutoPanel = (props: IProps): JSX.Element => {
|
|
|
37
36
|
};
|
|
38
37
|
const [configState, setConfigState] = useState<IConfigState>(initConfig);
|
|
39
38
|
const initToggle = {
|
|
40
|
-
isSiteActive:
|
|
41
|
-
isLangActive:
|
|
42
|
-
isGlobalActive:
|
|
39
|
+
isSiteActive: state.site && state.site !== "global" ? true : false,
|
|
40
|
+
isLangActive: state.lang ? true : false,
|
|
41
|
+
isGlobalActive: state.site && state.site === "global" ? true : false,
|
|
43
42
|
errorSite: false,
|
|
44
43
|
errorLang: false,
|
|
45
44
|
errorMsg: "",
|
|
@@ -131,8 +130,8 @@ const AutoPanel = (props: IProps): JSX.Element => {
|
|
|
131
130
|
title: "",
|
|
132
131
|
value: state.quantity,
|
|
133
132
|
onChange: (quantity: number) => setState((state: IReferenceState) => ({ ...state, quantity })),
|
|
134
|
-
maxValue: validators
|
|
135
|
-
minValue: validators
|
|
133
|
+
maxValue: validators && validators.maxValue ? validators.maxValue : undefined,
|
|
134
|
+
minValue: validators && validators.minValue ? validators.minValue : undefined,
|
|
136
135
|
};
|
|
137
136
|
|
|
138
137
|
const checkErrors = (): boolean => {
|
|
@@ -259,7 +258,7 @@ const AutoPanel = (props: IProps): JSX.Element => {
|
|
|
259
258
|
};
|
|
260
259
|
|
|
261
260
|
const handleLangChange = (value: string) => {
|
|
262
|
-
const lang = value.length ? parseInt(value
|
|
261
|
+
const lang = value.length ? parseInt(value) : undefined;
|
|
263
262
|
setState((state: IReferenceState) => ({ ...state, lang }));
|
|
264
263
|
if (value) {
|
|
265
264
|
setToggleState({ ...toggleState, isLangActive: true, errorLang: false, errorMsg: "" });
|
|
@@ -296,8 +295,7 @@ const AutoPanel = (props: IProps): JSX.Element => {
|
|
|
296
295
|
state.sources.map((singleSource: ISource) => {
|
|
297
296
|
const source = state.sourceTitles.find((el: IDataSource) => el.id === singleSource.structuredData);
|
|
298
297
|
const { filters = [], filterOperator, globalOperator } = singleSource;
|
|
299
|
-
|
|
300
|
-
return (
|
|
298
|
+
return source ? (
|
|
301
299
|
<AutoItem
|
|
302
300
|
key={singleSource.structuredData}
|
|
303
301
|
source={source}
|
|
@@ -311,7 +309,9 @@ const AutoPanel = (props: IProps): JSX.Element => {
|
|
|
311
309
|
globalOperator={globalOperator}
|
|
312
310
|
siteID={state.site || site?.id}
|
|
313
311
|
/>
|
|
314
|
-
)
|
|
312
|
+
) : (
|
|
313
|
+
<></>
|
|
314
|
+
);
|
|
315
315
|
})}
|
|
316
316
|
</S.SourcesWrapper>
|
|
317
317
|
<S.RadioWrapper>
|
|
@@ -383,9 +383,9 @@ const AutoPanel = (props: IProps): JSX.Element => {
|
|
|
383
383
|
</S.SubConfigContent>
|
|
384
384
|
</S.ConfigWrapper>
|
|
385
385
|
</>
|
|
386
|
-
) :
|
|
387
|
-
|
|
388
|
-
}
|
|
386
|
+
) : (
|
|
387
|
+
<></>
|
|
388
|
+
)}
|
|
389
389
|
|
|
390
390
|
<S.OptionLabel
|
|
391
391
|
onClick={() => toggleConfig("isDataOpen")}
|
|
@@ -483,7 +483,7 @@ const AutoPanel = (props: IProps): JSX.Element => {
|
|
|
483
483
|
<UniqueCheck
|
|
484
484
|
name="preferenceLanguageCheck"
|
|
485
485
|
options={[
|
|
486
|
-
{ title: `${currentLang} content shown first` },
|
|
486
|
+
{ value: false, name: "preferenceLanguage", title: `${currentLang} content shown first` },
|
|
487
487
|
]}
|
|
488
488
|
value={state.preferenceLanguage}
|
|
489
489
|
onChange={handlePreferenceLanguageChange}
|
|
@@ -1,9 +1,8 @@
|
|
|
1
|
+
import React from "react";
|
|
1
2
|
import { CheckField } from "@ax/components";
|
|
2
3
|
|
|
3
|
-
import * as S from "./style";
|
|
4
|
-
|
|
5
4
|
const UniqueCheck = (props: IProps) => {
|
|
6
|
-
const { name, value, options, onChange, disabled, inversed = false, className
|
|
5
|
+
const { name, value, options, onChange, disabled, inversed = false, className } = props;
|
|
7
6
|
const uniqueOption = options[0];
|
|
8
7
|
|
|
9
8
|
const handleChange = (changeEvt: ICheckEvent) => {
|
|
@@ -11,22 +10,17 @@ const UniqueCheck = (props: IProps) => {
|
|
|
11
10
|
onChange(isChecked);
|
|
12
11
|
};
|
|
13
12
|
|
|
14
|
-
const classes = description ? "with-subtitle" : "";
|
|
15
|
-
|
|
16
13
|
return (
|
|
17
|
-
<
|
|
18
|
-
|
|
19
|
-
|
|
20
|
-
|
|
21
|
-
|
|
22
|
-
|
|
23
|
-
|
|
24
|
-
|
|
25
|
-
|
|
26
|
-
|
|
27
|
-
/>
|
|
28
|
-
<S.Subtitle>{description}</S.Subtitle>
|
|
29
|
-
</S.Wrapper>
|
|
14
|
+
<CheckField
|
|
15
|
+
name={name}
|
|
16
|
+
checked={!!value && value}
|
|
17
|
+
title={uniqueOption.title}
|
|
18
|
+
value={value}
|
|
19
|
+
onChange={handleChange}
|
|
20
|
+
disabled={disabled}
|
|
21
|
+
inversed={inversed}
|
|
22
|
+
className={className}
|
|
23
|
+
/>
|
|
30
24
|
);
|
|
31
25
|
};
|
|
32
26
|
|
|
@@ -37,16 +31,17 @@ interface ICheckEvent {
|
|
|
37
31
|
|
|
38
32
|
interface IProps {
|
|
39
33
|
name: string;
|
|
40
|
-
value:
|
|
34
|
+
value: any;
|
|
41
35
|
options: ICheck[];
|
|
42
|
-
onChange
|
|
36
|
+
onChange: any;
|
|
43
37
|
disabled?: boolean;
|
|
44
38
|
inversed?: boolean;
|
|
45
39
|
className?: string;
|
|
46
|
-
description?: string;
|
|
47
40
|
}
|
|
48
41
|
|
|
49
42
|
interface ICheck {
|
|
43
|
+
name: string;
|
|
44
|
+
value: any;
|
|
50
45
|
title: string;
|
|
51
46
|
}
|
|
52
47
|
|
|
@@ -1,11 +1,9 @@
|
|
|
1
|
-
import
|
|
2
|
-
import { useCallback, useEffect, useLayoutEffect, useRef, useState } from "react";
|
|
3
|
-
|
|
1
|
+
import React, { useEffect, useRef, useState } from "react";
|
|
4
2
|
import { useHandleClickOutside } from "@ax/hooks";
|
|
5
3
|
|
|
6
4
|
import * as S from "./style";
|
|
7
5
|
|
|
8
|
-
const Tooltip = (props: ITooltipProps) => {
|
|
6
|
+
const Tooltip = (props: ITooltipProps): JSX.Element => {
|
|
9
7
|
const { content, children, hideOnClick = true, bottom, left, expanded, top } = props;
|
|
10
8
|
|
|
11
9
|
const initialState: IState = {
|
|
@@ -17,31 +15,26 @@ const Tooltip = (props: ITooltipProps) => {
|
|
|
17
15
|
const [state, setState] = useState(initialState);
|
|
18
16
|
const { active, childrenWidth, clicked, fixOutOfBounds } = state;
|
|
19
17
|
|
|
20
|
-
const changeState =
|
|
18
|
+
const changeState = (value: any) => {
|
|
21
19
|
setState((state) => ({ ...state, ...value }));
|
|
22
|
-
}
|
|
20
|
+
};
|
|
23
21
|
|
|
24
22
|
const childrenRef = useRef<HTMLDivElement>(null);
|
|
25
23
|
const tipRef = useRef<HTMLDivElement>(null);
|
|
26
|
-
|
|
24
|
+
|
|
25
|
+
let timeout: any;
|
|
27
26
|
|
|
28
27
|
const showTip = () => {
|
|
29
28
|
if (!clicked) {
|
|
30
|
-
|
|
31
|
-
clearTimeout(timeoutRef.current);
|
|
32
|
-
}
|
|
33
|
-
timeoutRef.current = setTimeout(() => {
|
|
29
|
+
timeout = setTimeout(() => {
|
|
34
30
|
changeState({ active: true });
|
|
35
31
|
}, 1000);
|
|
36
32
|
}
|
|
37
33
|
};
|
|
38
34
|
|
|
39
35
|
const hideTip = () => {
|
|
40
|
-
|
|
41
|
-
|
|
42
|
-
timeoutRef.current = null;
|
|
43
|
-
}
|
|
44
|
-
changeState({ active: false, fixOutOfBounds: 0 });
|
|
36
|
+
clearInterval(timeout);
|
|
37
|
+
changeState({ active: false });
|
|
45
38
|
};
|
|
46
39
|
|
|
47
40
|
const handleClick = () => {
|
|
@@ -51,8 +44,8 @@ const Tooltip = (props: ITooltipProps) => {
|
|
|
51
44
|
}
|
|
52
45
|
};
|
|
53
46
|
|
|
54
|
-
const handleClickOutside = (e:
|
|
55
|
-
if (childrenRef.current
|
|
47
|
+
const handleClickOutside = (e: any) => {
|
|
48
|
+
if (childrenRef.current && childrenRef.current.contains(e.target)) {
|
|
56
49
|
return;
|
|
57
50
|
}
|
|
58
51
|
changeState({ clicked: false });
|
|
@@ -60,22 +53,16 @@ const Tooltip = (props: ITooltipProps) => {
|
|
|
60
53
|
|
|
61
54
|
useHandleClickOutside(clicked, handleClickOutside);
|
|
62
55
|
|
|
56
|
+
// biome-ignore lint/correctness/useExhaustiveDependencies: TODO: fix this
|
|
63
57
|
useEffect(() => {
|
|
64
|
-
|
|
65
|
-
if (timeoutRef.current) {
|
|
66
|
-
clearTimeout(timeoutRef.current);
|
|
67
|
-
}
|
|
68
|
-
};
|
|
69
|
-
}, []);
|
|
70
|
-
|
|
71
|
-
useEffect(() => {
|
|
72
|
-
if (childrenRef.current?.children[0]) {
|
|
58
|
+
if (childrenRef.current && childrenRef.current.children[0]) {
|
|
73
59
|
const childrenWidth = childrenRef.current.children[0].clientWidth;
|
|
74
60
|
changeState({ childrenWidth });
|
|
75
61
|
}
|
|
76
|
-
}, [
|
|
62
|
+
}, [childrenRef]);
|
|
77
63
|
|
|
78
|
-
|
|
64
|
+
// biome-ignore lint/correctness/useExhaustiveDependencies: TODO: fix this
|
|
65
|
+
useEffect(() => {
|
|
79
66
|
if (active && tipRef.current) {
|
|
80
67
|
const clientRect = tipRef.current.getBoundingClientRect();
|
|
81
68
|
|
|
@@ -85,13 +72,11 @@ const Tooltip = (props: ITooltipProps) => {
|
|
|
85
72
|
changeState({ fixOutOfBounds: left });
|
|
86
73
|
} else if (right > windowSize) {
|
|
87
74
|
changeState({ fixOutOfBounds: right - windowSize });
|
|
88
|
-
} else {
|
|
89
|
-
changeState({ fixOutOfBounds: 0 });
|
|
90
75
|
}
|
|
91
76
|
}
|
|
92
|
-
}, [
|
|
77
|
+
}, [tipRef, active]);
|
|
93
78
|
|
|
94
|
-
if (!content) return
|
|
79
|
+
if (!content) return children;
|
|
95
80
|
|
|
96
81
|
return (
|
|
97
82
|
<S.Tooltip
|
|
@@ -127,8 +112,8 @@ interface IState {
|
|
|
127
112
|
}
|
|
128
113
|
|
|
129
114
|
export interface ITooltipProps {
|
|
130
|
-
content?: string | boolean | JSX.Element | JSX.Element
|
|
131
|
-
children:
|
|
115
|
+
content?: string | boolean | JSX.Element[] | JSX.Element;
|
|
116
|
+
children: any;
|
|
132
117
|
hideOnClick?: boolean;
|
|
133
118
|
bottom?: boolean;
|
|
134
119
|
left?: number;
|
|
@@ -151,22 +151,6 @@ export default {
|
|
|
151
151
|
},
|
|
152
152
|
],
|
|
153
153
|
},
|
|
154
|
-
{
|
|
155
|
-
title: "GEO (LLMS)",
|
|
156
|
-
type: "FieldGroup",
|
|
157
|
-
key: "geo",
|
|
158
|
-
collapsed: true,
|
|
159
|
-
fields: [
|
|
160
|
-
{
|
|
161
|
-
type: "UniqueCheck",
|
|
162
|
-
key: "isLlmsEnabled",
|
|
163
|
-
options: [
|
|
164
|
-
{ "title": "Include this page in LLMs.txt" }
|
|
165
|
-
],
|
|
166
|
-
description: "If enabled, this page will be listed in LLMs.txt for language models."
|
|
167
|
-
},
|
|
168
|
-
],
|
|
169
|
-
},
|
|
170
154
|
{
|
|
171
155
|
title: "Analytics Data Layer",
|
|
172
156
|
type: "FieldGroup",
|
|
@@ -222,6 +206,5 @@ export default {
|
|
|
222
206
|
socialTitle: "",
|
|
223
207
|
socialDescription: "",
|
|
224
208
|
socialImage: {},
|
|
225
|
-
isLlmsEnabled: true,
|
|
226
209
|
},
|
|
227
210
|
};
|
|
@@ -217,22 +217,6 @@ export default {
|
|
|
217
217
|
},
|
|
218
218
|
],
|
|
219
219
|
},
|
|
220
|
-
{
|
|
221
|
-
title: "GEO (LLMS)",
|
|
222
|
-
type: "FieldGroup",
|
|
223
|
-
key: "geo",
|
|
224
|
-
collapsed: true,
|
|
225
|
-
fields: [
|
|
226
|
-
{
|
|
227
|
-
type: "UniqueCheck",
|
|
228
|
-
key: "isLlmsEnabled",
|
|
229
|
-
options: [
|
|
230
|
-
{ "title": "Include this page in LLMs.txt" }
|
|
231
|
-
],
|
|
232
|
-
description: "If enabled, this page will be listed in LLMs.txt for language models."
|
|
233
|
-
},
|
|
234
|
-
],
|
|
235
|
-
},
|
|
236
220
|
{
|
|
237
221
|
title: "Analytics Data Layer",
|
|
238
222
|
type: "FieldGroup",
|
|
@@ -296,6 +280,5 @@ export default {
|
|
|
296
280
|
customizeThemes: false,
|
|
297
281
|
headerTheme: null,
|
|
298
282
|
footerTheme: null,
|
|
299
|
-
isLlmsEnabled: true,
|
|
300
283
|
},
|
|
301
284
|
};
|
|
@@ -1,17 +0,0 @@
|
|
|
1
|
-
import styled from "styled-components";
|
|
2
|
-
|
|
3
|
-
const Wrapper = styled.div`
|
|
4
|
-
&.with-subtitle label {
|
|
5
|
-
${(p) => p.theme.textStyle.uiL};
|
|
6
|
-
font-weight: 600;
|
|
7
|
-
}
|
|
8
|
-
`;
|
|
9
|
-
|
|
10
|
-
const Subtitle = styled.div`
|
|
11
|
-
${(p) => p.theme.textStyle.uiS};
|
|
12
|
-
font-weight: 400;
|
|
13
|
-
color: ${(p) => p.theme.color.textHighEmphasis};
|
|
14
|
-
padding-left: ${(p) => p.theme.spacing.m};
|
|
15
|
-
`;
|
|
16
|
-
|
|
17
|
-
export { Wrapper, Subtitle };
|