Diff: STRATO-apps/wordpress_03/app/wp-content/themes/blocksy/static/js/options/OptionsPanel.js
Keine Baseline-Datei – Diff nur gegen leer.
1
-
1
+
import {
2
+
createElement,
3
+
Component,
4
+
Fragment,
5
+
memo,
6
+
useMemo,
7
+
} from '@wordpress/element'
8
+
import GenericOptionType from './GenericOptionType'
9
+
import GenericContainerType from './GenericContainerType'
10
+
import { flattenOptions } from './helpers/get-value-from-input'
11
+
12
+
const OptionsPanel = (props) => {
13
+
let {
14
+
options,
15
+
value,
16
+
onChange, // default | customizer
17
+
18
+
// (values) => {}
19
+
//
20
+
// Optional, provided only in some cases. Used to update multiple
21
+
// values at once.
22
+
// Not supported in customizer since we have to update values one
23
+
// by one there.
24
+
onChangeMultiple = null,
25
+
26
+
// default | taxonomy | gutenberg
27
+
purpose = 'default',
28
+
29
+
hasRevertButton = true,
30
+
renderOptions = null,
31
+
parentValue,
32
+
} = props
33
+
34
+
if (renderOptions) {
35
+
return renderOptions({
36
+
value,
37
+
onChange,
38
+
})
39
+
}
40
+
41
+
let SlotFillProvider = null
42
+
43
+
if (window.wp.components) {
44
+
SlotFillProvider = window.wp.components.SlotFillProvider
45
+
}
46
+
47
+
const renderingChunks = useMemo(() => {
48
+
const localOptions = flattenOptions(options)
49
+
50
+
return [
51
+
...(localOptions.__CT_KEYS_ORDER__
52
+
? Object.keys(localOptions.__CT_KEYS_ORDER__)
53
+
.map((orderKey) => parseInt(orderKey, 10))
54
+
.sort((a, b) => a - b)
55
+
.map(
56
+
(orderKey) =>
57
+
localOptions.__CT_KEYS_ORDER__[orderKey]
58
+
)
59
+
: Object.keys(localOptions)),
60
+
]
61
+
.filter((id) => id !== '__CT_KEYS_ORDER__')
62
+
.map((id) => ({
63
+
...localOptions[id],
64
+
id,
65
+
}))
66
+
.reduce((chunksHolder, currentOptionDescriptor, index) => {
67
+
if (chunksHolder.length === 0) {
68
+
return [[currentOptionDescriptor]]
69
+
}
70
+
71
+
let lastChunk = chunksHolder[chunksHolder.length - 1]
72
+
73
+
if (
74
+
((lastChunk[0].options &&
75
+
lastChunk[0].type === currentOptionDescriptor.type) ||
76
+
currentOptionDescriptor.type === 'ct-tab-group' ||
77
+
currentOptionDescriptor.type === 'ct-tab-group-sync') &&
78
+
/**
79
+
* Do not group rendering chunks for boxes
80
+
*/
81
+
currentOptionDescriptor.type !== 'box' &&
82
+
/**
83
+
* Do not group rendering chunks for ct-popup's
84
+
*/
85
+
currentOptionDescriptor.type !== 'ct-popup'
86
+
) {
87
+
return [
88
+
...chunksHolder.slice(0, -1),
89
+
[...lastChunk, currentOptionDescriptor],
90
+
]
91
+
}
92
+
93
+
return [...chunksHolder, [currentOptionDescriptor]]
94
+
}, [])
95
+
}, [options])
96
+
97
+
let finalResult = renderingChunks.map((renderingChunk) => {
98
+
/**
99
+
* We are dealing with a container
100
+
*/
101
+
if (
102
+
renderingChunk[0].options ||
103
+
renderingChunk[0].type === 'ct-tab-group-sync'
104
+
) {
105
+
return (
106
+
<GenericContainerType
107
+
key={renderingChunk[0].id}
108
+
value={value}
109
+
parentValue={parentValue}
110
+
renderingChunk={renderingChunk}
111
+
onChange={onChange}
112
+
onChangeMultiple={onChangeMultiple}
113
+
purpose={purpose}
114
+
hasRevertButton={hasRevertButton}
115
+
/>
116
+
)
117
+
}
118
+
119
+
/**
120
+
* We have a regular option type here
121
+
*/
122
+
return (
123
+
<GenericOptionType
124
+
hasRevertButton={hasRevertButton}
125
+
purpose={purpose}
126
+
key={renderingChunk[0].id}
127
+
id={renderingChunk[0].id}
128
+
value={value[renderingChunk[0].id]}
129
+
values={value}
130
+
option={renderingChunk[0]}
131
+
onChangeFor={(id, newValue) => onChange(id, newValue)}
132
+
onChange={(newValue) =>
133
+
onChange(renderingChunk[0].id, newValue)
134
+
}
135
+
/>
136
+
)
137
+
})
138
+
139
+
return window.wp.components ? (
140
+
<SlotFillProvider>{finalResult}</SlotFillProvider>
141
+
) : (
142
+
finalResult
143
+
)
144
+
}
145
+
146
+
export default OptionsPanel
147
+