@player-ui/reference-assets-plugin-react 0.8.0--canary.307.9621 → 0.8.0-next.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/cjs/index.cjs +581 -0
- package/dist/cjs/index.cjs.map +1 -0
- package/dist/index.css +703 -0
- package/dist/index.legacy-esm.js +529 -0
- package/dist/index.mjs +529 -0
- package/dist/index.mjs.map +1 -0
- package/package.json +34 -63
- package/src/__tests__/integration.test.tsx +158 -0
- package/src/assets/action/Action.tsx +10 -14
- package/src/assets/action/hooks.tsx +6 -6
- package/src/assets/action/index.ts +2 -2
- package/src/assets/choice/Choice.tsx +52 -0
- package/src/assets/choice/hooks.tsx +34 -0
- package/src/assets/choice/index.ts +2 -0
- package/src/assets/collection/Collection.tsx +6 -9
- package/src/assets/collection/index.tsx +1 -1
- package/src/assets/image/Image.tsx +4 -4
- package/src/assets/image/index.tsx +1 -1
- package/src/assets/index.tsx +7 -6
- package/src/assets/info/Info.tsx +26 -29
- package/src/assets/info/index.tsx +1 -1
- package/src/assets/input/Input.tsx +27 -19
- package/src/assets/input/hooks.tsx +35 -35
- package/src/assets/input/index.tsx +2 -2
- package/src/assets/input/types.ts +2 -2
- package/src/assets/text/Text.tsx +13 -7
- package/src/assets/text/hooks.tsx +6 -6
- package/src/assets/text/index.tsx +2 -2
- package/src/components/Button.tsx +56 -0
- package/src/components/ChoiceItem.tsx +31 -0
- package/src/components/Input.tsx +26 -0
- package/src/components/Label.tsx +26 -0
- package/src/components/Separator.tsx +30 -0
- package/src/global.css +83 -0
- package/src/index.tsx +4 -2
- package/src/intro.stories.mdx +9 -9
- package/src/plugin.tsx +22 -43
- package/src/utils.ts +6 -0
- package/types/assets/action/Action.d.ts +7 -0
- package/types/assets/action/hooks.d.ts +9 -0
- package/types/assets/action/index.d.ts +3 -0
- package/types/assets/choice/Choice.d.ts +6 -0
- package/types/assets/choice/hooks.d.ts +5 -0
- package/types/assets/choice/index.d.ts +3 -0
- package/types/assets/collection/Collection.d.ts +4 -0
- package/types/assets/collection/index.d.ts +2 -0
- package/types/assets/image/Image.d.ts +4 -0
- package/types/assets/image/index.d.ts +2 -0
- package/types/assets/index.d.ts +8 -0
- package/types/assets/info/Info.d.ts +5 -0
- package/types/assets/info/index.d.ts +2 -0
- package/types/assets/input/Input.d.ts +6 -0
- package/types/assets/input/hooks.d.ts +40 -0
- package/types/assets/input/index.d.ts +3 -0
- package/types/assets/input/types.d.ts +3 -0
- package/types/assets/text/Text.d.ts +7 -0
- package/types/assets/text/hooks.d.ts +9 -0
- package/types/assets/text/index.d.ts +3 -0
- package/types/components/Button.d.ts +12 -0
- package/types/components/ChoiceItem.d.ts +7 -0
- package/types/components/Input.d.ts +6 -0
- package/types/components/Label.d.ts +6 -0
- package/types/components/Separator.d.ts +5 -0
- package/types/index.d.ts +4 -0
- package/types/plugin.d.ts +19 -0
- package/types/utils.d.ts +3 -0
- package/dist/index.cjs.js +0 -501
- package/dist/index.d.ts +0 -94
- package/dist/index.esm.js +0 -479
- package/dist/xlr/ActionAsset.json +0 -126
- package/dist/xlr/CollectionAsset.json +0 -40
- package/dist/xlr/InfoAsset.json +0 -58
- package/dist/xlr/InputAsset.json +0 -109
- package/dist/xlr/TextAsset.json +0 -125
- package/dist/xlr/manifest.js +0 -16
- package/dist/xlr/manifest.json +0 -22
package/dist/index.esm.js
DELETED
|
@@ -1,479 +0,0 @@
|
|
|
1
|
-
import React, { useContext } from 'react';
|
|
2
|
-
import { AssetProviderPlugin } from '@player-ui/asset-provider-plugin-react';
|
|
3
|
-
import { FormControl, FormLabel, Input as Input$1, FormErrorMessage, FormHelperText, Link, Flex, Button, Text as Text$1, Box, Stack, Heading, Divider, HStack, ButtonGroup, useTheme, ChakraProvider } from '@chakra-ui/react';
|
|
4
|
-
import { isBackAction, ReferenceAssetsPlugin as ReferenceAssetsPlugin$1 } from '@player-ui/reference-assets-plugin';
|
|
5
|
-
import { ReactAsset, useAssetProps } from '@player-ui/react';
|
|
6
|
-
import { useBeacon } from '@player-ui/beacon-plugin-react';
|
|
7
|
-
import makeClass from 'clsx';
|
|
8
|
-
import { ChevronLeftIcon } from '@chakra-ui/icons';
|
|
9
|
-
|
|
10
|
-
var __defProp$8 = Object.defineProperty;
|
|
11
|
-
var __getOwnPropSymbols$8 = Object.getOwnPropertySymbols;
|
|
12
|
-
var __hasOwnProp$8 = Object.prototype.hasOwnProperty;
|
|
13
|
-
var __propIsEnum$8 = Object.prototype.propertyIsEnumerable;
|
|
14
|
-
var __defNormalProp$8 = (obj, key, value) => key in obj ? __defProp$8(obj, key, { enumerable: true, configurable: true, writable: true, value }) : obj[key] = value;
|
|
15
|
-
var __spreadValues$8 = (a, b) => {
|
|
16
|
-
for (var prop in b || (b = {}))
|
|
17
|
-
if (__hasOwnProp$8.call(b, prop))
|
|
18
|
-
__defNormalProp$8(a, prop, b[prop]);
|
|
19
|
-
if (__getOwnPropSymbols$8)
|
|
20
|
-
for (var prop of __getOwnPropSymbols$8(b)) {
|
|
21
|
-
if (__propIsEnum$8.call(b, prop))
|
|
22
|
-
__defNormalProp$8(a, prop, b[prop]);
|
|
23
|
-
}
|
|
24
|
-
return a;
|
|
25
|
-
};
|
|
26
|
-
const defaultKeyStrings = [
|
|
27
|
-
"Delete",
|
|
28
|
-
"Backspace",
|
|
29
|
-
"Tab",
|
|
30
|
-
"Home",
|
|
31
|
-
"End",
|
|
32
|
-
"ArrowLeft",
|
|
33
|
-
"ArrowRight",
|
|
34
|
-
"ArrowUp",
|
|
35
|
-
"ArrowDown",
|
|
36
|
-
"Escape"
|
|
37
|
-
];
|
|
38
|
-
const getConfig = (userConfig = {}) => {
|
|
39
|
-
return __spreadValues$8({
|
|
40
|
-
liveFormat: true,
|
|
41
|
-
suppressBeacons: false,
|
|
42
|
-
quickFormatDelay: 200,
|
|
43
|
-
slowFormatDelay: 1e3,
|
|
44
|
-
slowFormatKeys: defaultKeyStrings,
|
|
45
|
-
decimalSymbol: ".",
|
|
46
|
-
prefix: "",
|
|
47
|
-
suffix: ""
|
|
48
|
-
}, userConfig);
|
|
49
|
-
};
|
|
50
|
-
const useInputBeacon = (props) => {
|
|
51
|
-
const beaconHandler = useBeacon({ element: "text_input", asset: props });
|
|
52
|
-
return (newValue) => {
|
|
53
|
-
let action = "modified";
|
|
54
|
-
if (newValue === props.value) {
|
|
55
|
-
return;
|
|
56
|
-
}
|
|
57
|
-
if (newValue && !props.value) {
|
|
58
|
-
action = "added";
|
|
59
|
-
} else if (!newValue && props.value) {
|
|
60
|
-
action = "deleted";
|
|
61
|
-
}
|
|
62
|
-
beaconHandler({ action });
|
|
63
|
-
};
|
|
64
|
-
};
|
|
65
|
-
const useInputAsset = (props, config) => {
|
|
66
|
-
var _a;
|
|
67
|
-
const [localValue, setLocalValue] = React.useState((_a = props.value) != null ? _a : "");
|
|
68
|
-
const formatTimerRef = React.useRef(void 0);
|
|
69
|
-
const inputBeacon = useInputBeacon(props);
|
|
70
|
-
const {
|
|
71
|
-
liveFormat,
|
|
72
|
-
suppressBeacons,
|
|
73
|
-
quickFormatDelay,
|
|
74
|
-
slowFormatDelay,
|
|
75
|
-
slowFormatKeys,
|
|
76
|
-
decimalSymbol,
|
|
77
|
-
prefix,
|
|
78
|
-
suffix
|
|
79
|
-
} = getConfig(config);
|
|
80
|
-
function clearPending() {
|
|
81
|
-
if (formatTimerRef.current) {
|
|
82
|
-
clearTimeout(formatTimerRef.current);
|
|
83
|
-
formatTimerRef.current = void 0;
|
|
84
|
-
}
|
|
85
|
-
}
|
|
86
|
-
function getFormatDelaySpeed(e) {
|
|
87
|
-
const key = slowFormatKeys.every((k) => typeof k === "number") ? e.which : e.key;
|
|
88
|
-
return slowFormatKeys.includes(key) ? slowFormatDelay : quickFormatDelay;
|
|
89
|
-
}
|
|
90
|
-
function handleAffixOnFocus(target) {
|
|
91
|
-
let val = target.value;
|
|
92
|
-
if (suffix)
|
|
93
|
-
val = val.substring(0, val.indexOf(suffix));
|
|
94
|
-
if (prefix && !val.includes(prefix)) {
|
|
95
|
-
val = `${prefix}${val}`;
|
|
96
|
-
}
|
|
97
|
-
return val;
|
|
98
|
-
}
|
|
99
|
-
function handlePrefixEdgeCases(e) {
|
|
100
|
-
const target = e.target;
|
|
101
|
-
const start = target.selectionStart;
|
|
102
|
-
const end = target.selectionEnd;
|
|
103
|
-
const pl = prefix.length;
|
|
104
|
-
const atStart = start === pl;
|
|
105
|
-
const atEnd = end === pl;
|
|
106
|
-
if (start && end && start < pl) {
|
|
107
|
-
e.preventDefault();
|
|
108
|
-
target.setSelectionRange(pl, end - start + pl);
|
|
109
|
-
} else if (e.key === "ArrowLeft" && atStart || e.key === "Backspace" && atStart && atEnd || e.key === "Home") {
|
|
110
|
-
e.preventDefault();
|
|
111
|
-
target.setSelectionRange(prefix.length, prefix.length);
|
|
112
|
-
}
|
|
113
|
-
}
|
|
114
|
-
function formatValueWithAffix(value) {
|
|
115
|
-
if (!value)
|
|
116
|
-
return "";
|
|
117
|
-
return `${prefix}${value}${suffix}`;
|
|
118
|
-
}
|
|
119
|
-
const onKeyDownHandler = (currentValue) => {
|
|
120
|
-
var _a2;
|
|
121
|
-
const symbolPosition = currentValue.indexOf(decimalSymbol);
|
|
122
|
-
const newValue = (_a2 = props.format(currentValue)) != null ? _a2 : "";
|
|
123
|
-
const newSymbolPosition = newValue.indexOf(decimalSymbol);
|
|
124
|
-
if ((symbolPosition === -1 || symbolPosition === 0) && newSymbolPosition > 0) {
|
|
125
|
-
return {
|
|
126
|
-
newValue: newValue.includes(prefix) ? `${newValue}` : `${prefix}${newValue}`,
|
|
127
|
-
newCursorPosition: newValue.includes(prefix) ? newSymbolPosition : newSymbolPosition + prefix.length
|
|
128
|
-
};
|
|
129
|
-
}
|
|
130
|
-
return {
|
|
131
|
-
newValue: newValue.includes(prefix) ? `${newValue}` : `${prefix}${newValue}`
|
|
132
|
-
};
|
|
133
|
-
};
|
|
134
|
-
const onBlur = (e) => {
|
|
135
|
-
var _a2;
|
|
136
|
-
clearPending();
|
|
137
|
-
const formatted = (_a2 = prefix ? e.target.value.replace(prefix, "") : props.format(e.target.value)) != null ? _a2 : "";
|
|
138
|
-
if (formatted) {
|
|
139
|
-
props.set(formatted);
|
|
140
|
-
setLocalValue(formatValueWithAffix(formatted));
|
|
141
|
-
} else {
|
|
142
|
-
props.set("");
|
|
143
|
-
setLocalValue("");
|
|
144
|
-
}
|
|
145
|
-
if (!suppressBeacons) {
|
|
146
|
-
inputBeacon(formatted);
|
|
147
|
-
}
|
|
148
|
-
};
|
|
149
|
-
const onChange = (e) => {
|
|
150
|
-
setLocalValue(e.target.value);
|
|
151
|
-
};
|
|
152
|
-
const onKeyDown = (e) => {
|
|
153
|
-
clearPending();
|
|
154
|
-
if (prefix)
|
|
155
|
-
handlePrefixEdgeCases(e);
|
|
156
|
-
const target = e.target;
|
|
157
|
-
if (liveFormat) {
|
|
158
|
-
formatTimerRef.current = setTimeout(() => {
|
|
159
|
-
var _a2, _b;
|
|
160
|
-
const cursorPosition = target.selectionStart;
|
|
161
|
-
const currentValue = target.value;
|
|
162
|
-
if (cursorPosition !== currentValue.length) {
|
|
163
|
-
return;
|
|
164
|
-
}
|
|
165
|
-
const obj = onKeyDownHandler(currentValue);
|
|
166
|
-
setLocalValue(obj.newValue);
|
|
167
|
-
target.selectionStart = (_a2 = obj.newCursorPosition) != null ? _a2 : target.selectionStart;
|
|
168
|
-
target.selectionEnd = (_b = obj.newCursorPosition) != null ? _b : target.selectionEnd;
|
|
169
|
-
}, getFormatDelaySpeed(e));
|
|
170
|
-
}
|
|
171
|
-
};
|
|
172
|
-
const onFocus = (e) => {
|
|
173
|
-
const target = e.target;
|
|
174
|
-
const inputEmpty = target.value === "";
|
|
175
|
-
if (!inputEmpty && suffix || inputEmpty && prefix) {
|
|
176
|
-
setLocalValue(handleAffixOnFocus(target));
|
|
177
|
-
}
|
|
178
|
-
};
|
|
179
|
-
const propsValue = props.value;
|
|
180
|
-
React.useEffect(() => {
|
|
181
|
-
setLocalValue(formatValueWithAffix(propsValue));
|
|
182
|
-
}, [propsValue]);
|
|
183
|
-
React.useEffect(() => clearPending, []);
|
|
184
|
-
return {
|
|
185
|
-
onBlur,
|
|
186
|
-
onChange,
|
|
187
|
-
onKeyDown,
|
|
188
|
-
onFocus,
|
|
189
|
-
value: localValue
|
|
190
|
-
};
|
|
191
|
-
};
|
|
192
|
-
|
|
193
|
-
var __defProp$7 = Object.defineProperty;
|
|
194
|
-
var __getOwnPropSymbols$7 = Object.getOwnPropertySymbols;
|
|
195
|
-
var __hasOwnProp$7 = Object.prototype.hasOwnProperty;
|
|
196
|
-
var __propIsEnum$7 = Object.prototype.propertyIsEnumerable;
|
|
197
|
-
var __defNormalProp$7 = (obj, key, value) => key in obj ? __defProp$7(obj, key, { enumerable: true, configurable: true, writable: true, value }) : obj[key] = value;
|
|
198
|
-
var __spreadValues$7 = (a, b) => {
|
|
199
|
-
for (var prop in b || (b = {}))
|
|
200
|
-
if (__hasOwnProp$7.call(b, prop))
|
|
201
|
-
__defNormalProp$7(a, prop, b[prop]);
|
|
202
|
-
if (__getOwnPropSymbols$7)
|
|
203
|
-
for (var prop of __getOwnPropSymbols$7(b)) {
|
|
204
|
-
if (__propIsEnum$7.call(b, prop))
|
|
205
|
-
__defNormalProp$7(a, prop, b[prop]);
|
|
206
|
-
}
|
|
207
|
-
return a;
|
|
208
|
-
};
|
|
209
|
-
const Input = (props) => {
|
|
210
|
-
const { validation, label, id, note } = props;
|
|
211
|
-
const inputProps = useInputAsset(props);
|
|
212
|
-
return /* @__PURE__ */ React.createElement(FormControl, {
|
|
213
|
-
isInvalid: Boolean(validation)
|
|
214
|
-
}, label && /* @__PURE__ */ React.createElement(FormLabel, {
|
|
215
|
-
htmlFor: id
|
|
216
|
-
}, /* @__PURE__ */ React.createElement(ReactAsset, __spreadValues$7({}, label))), /* @__PURE__ */ React.createElement(Input$1, __spreadValues$7({
|
|
217
|
-
id,
|
|
218
|
-
size: "md"
|
|
219
|
-
}, inputProps)), validation && /* @__PURE__ */ React.createElement(FormErrorMessage, null, validation.message), note && /* @__PURE__ */ React.createElement(FormHelperText, null, /* @__PURE__ */ React.createElement(ReactAsset, __spreadValues$7({}, note))));
|
|
220
|
-
};
|
|
221
|
-
|
|
222
|
-
var __defProp$6 = Object.defineProperty;
|
|
223
|
-
var __defProps = Object.defineProperties;
|
|
224
|
-
var __getOwnPropDescs = Object.getOwnPropertyDescriptors;
|
|
225
|
-
var __getOwnPropSymbols$6 = Object.getOwnPropertySymbols;
|
|
226
|
-
var __hasOwnProp$6 = Object.prototype.hasOwnProperty;
|
|
227
|
-
var __propIsEnum$6 = Object.prototype.propertyIsEnumerable;
|
|
228
|
-
var __defNormalProp$6 = (obj, key, value) => key in obj ? __defProp$6(obj, key, { enumerable: true, configurable: true, writable: true, value }) : obj[key] = value;
|
|
229
|
-
var __spreadValues$6 = (a, b) => {
|
|
230
|
-
for (var prop in b || (b = {}))
|
|
231
|
-
if (__hasOwnProp$6.call(b, prop))
|
|
232
|
-
__defNormalProp$6(a, prop, b[prop]);
|
|
233
|
-
if (__getOwnPropSymbols$6)
|
|
234
|
-
for (var prop of __getOwnPropSymbols$6(b)) {
|
|
235
|
-
if (__propIsEnum$6.call(b, prop))
|
|
236
|
-
__defNormalProp$6(a, prop, b[prop]);
|
|
237
|
-
}
|
|
238
|
-
return a;
|
|
239
|
-
};
|
|
240
|
-
var __spreadProps = (a, b) => __defProps(a, __getOwnPropDescs(b));
|
|
241
|
-
const TextModifierContext = React.createContext(void 0);
|
|
242
|
-
const useText = (props) => {
|
|
243
|
-
let className;
|
|
244
|
-
const modifierContext = useContext(TextModifierContext);
|
|
245
|
-
if (props.modifiers && (modifierContext == null ? void 0 : modifierContext.getClassForModifier)) {
|
|
246
|
-
className = makeClass(...props.modifiers.map(modifierContext.getClassForModifier));
|
|
247
|
-
}
|
|
248
|
-
return __spreadProps(__spreadValues$6({}, useAssetProps(props)), {
|
|
249
|
-
className,
|
|
250
|
-
children: props.value
|
|
251
|
-
});
|
|
252
|
-
};
|
|
253
|
-
|
|
254
|
-
var __defProp$5 = Object.defineProperty;
|
|
255
|
-
var __getOwnPropSymbols$5 = Object.getOwnPropertySymbols;
|
|
256
|
-
var __hasOwnProp$5 = Object.prototype.hasOwnProperty;
|
|
257
|
-
var __propIsEnum$5 = Object.prototype.propertyIsEnumerable;
|
|
258
|
-
var __defNormalProp$5 = (obj, key, value) => key in obj ? __defProp$5(obj, key, { enumerable: true, configurable: true, writable: true, value }) : obj[key] = value;
|
|
259
|
-
var __spreadValues$5 = (a, b) => {
|
|
260
|
-
for (var prop in b || (b = {}))
|
|
261
|
-
if (__hasOwnProp$5.call(b, prop))
|
|
262
|
-
__defNormalProp$5(a, prop, b[prop]);
|
|
263
|
-
if (__getOwnPropSymbols$5)
|
|
264
|
-
for (var prop of __getOwnPropSymbols$5(b)) {
|
|
265
|
-
if (__propIsEnum$5.call(b, prop))
|
|
266
|
-
__defNormalProp$5(a, prop, b[prop]);
|
|
267
|
-
}
|
|
268
|
-
return a;
|
|
269
|
-
};
|
|
270
|
-
const getLinkModifier = (asset) => {
|
|
271
|
-
var _a;
|
|
272
|
-
return (_a = asset.modifiers) == null ? void 0 : _a.find((mod) => {
|
|
273
|
-
var _a2;
|
|
274
|
-
return mod.type === "link" && ((_a2 = mod.metaData) == null ? void 0 : _a2.ref) !== void 0;
|
|
275
|
-
});
|
|
276
|
-
};
|
|
277
|
-
const Text = (props) => {
|
|
278
|
-
const spanProps = useText(props);
|
|
279
|
-
const linkModifier = getLinkModifier(props);
|
|
280
|
-
const { value } = props;
|
|
281
|
-
if (linkModifier) {
|
|
282
|
-
return /* @__PURE__ */ React.createElement(Link, {
|
|
283
|
-
href: linkModifier.metaData.ref
|
|
284
|
-
}, value);
|
|
285
|
-
}
|
|
286
|
-
return /* @__PURE__ */ React.createElement("span", __spreadValues$5({}, spanProps), value);
|
|
287
|
-
};
|
|
288
|
-
|
|
289
|
-
var __defProp$4 = Object.defineProperty;
|
|
290
|
-
var __getOwnPropSymbols$4 = Object.getOwnPropertySymbols;
|
|
291
|
-
var __hasOwnProp$4 = Object.prototype.hasOwnProperty;
|
|
292
|
-
var __propIsEnum$4 = Object.prototype.propertyIsEnumerable;
|
|
293
|
-
var __defNormalProp$4 = (obj, key, value) => key in obj ? __defProp$4(obj, key, { enumerable: true, configurable: true, writable: true, value }) : obj[key] = value;
|
|
294
|
-
var __spreadValues$4 = (a, b) => {
|
|
295
|
-
for (var prop in b || (b = {}))
|
|
296
|
-
if (__hasOwnProp$4.call(b, prop))
|
|
297
|
-
__defNormalProp$4(a, prop, b[prop]);
|
|
298
|
-
if (__getOwnPropSymbols$4)
|
|
299
|
-
for (var prop of __getOwnPropSymbols$4(b)) {
|
|
300
|
-
if (__propIsEnum$4.call(b, prop))
|
|
301
|
-
__defNormalProp$4(a, prop, b[prop]);
|
|
302
|
-
}
|
|
303
|
-
return a;
|
|
304
|
-
};
|
|
305
|
-
const Collection = (props) => {
|
|
306
|
-
var _a;
|
|
307
|
-
return /* @__PURE__ */ React.createElement(Flex, {
|
|
308
|
-
direction: "column",
|
|
309
|
-
gap: "5"
|
|
310
|
-
}, props.label && /* @__PURE__ */ React.createElement("h3", null, /* @__PURE__ */ React.createElement(ReactAsset, __spreadValues$4({}, props.label))), (_a = props.values) == null ? void 0 : _a.map((a) => /* @__PURE__ */ React.createElement(ReactAsset, __spreadValues$4({
|
|
311
|
-
key: a.asset.id
|
|
312
|
-
}, a))));
|
|
313
|
-
};
|
|
314
|
-
|
|
315
|
-
var __defProp$3 = Object.defineProperty;
|
|
316
|
-
var __getOwnPropSymbols$3 = Object.getOwnPropertySymbols;
|
|
317
|
-
var __hasOwnProp$3 = Object.prototype.hasOwnProperty;
|
|
318
|
-
var __propIsEnum$3 = Object.prototype.propertyIsEnumerable;
|
|
319
|
-
var __defNormalProp$3 = (obj, key, value) => key in obj ? __defProp$3(obj, key, { enumerable: true, configurable: true, writable: true, value }) : obj[key] = value;
|
|
320
|
-
var __spreadValues$3 = (a, b) => {
|
|
321
|
-
for (var prop in b || (b = {}))
|
|
322
|
-
if (__hasOwnProp$3.call(b, prop))
|
|
323
|
-
__defNormalProp$3(a, prop, b[prop]);
|
|
324
|
-
if (__getOwnPropSymbols$3)
|
|
325
|
-
for (var prop of __getOwnPropSymbols$3(b)) {
|
|
326
|
-
if (__propIsEnum$3.call(b, prop))
|
|
327
|
-
__defNormalProp$3(a, prop, b[prop]);
|
|
328
|
-
}
|
|
329
|
-
return a;
|
|
330
|
-
};
|
|
331
|
-
const useAction = (props) => {
|
|
332
|
-
const { label } = props;
|
|
333
|
-
const beacon = useBeacon({
|
|
334
|
-
asset: props,
|
|
335
|
-
action: "clicked",
|
|
336
|
-
element: "button"
|
|
337
|
-
});
|
|
338
|
-
return {
|
|
339
|
-
id: props.id,
|
|
340
|
-
onClick: () => {
|
|
341
|
-
beacon();
|
|
342
|
-
props.run();
|
|
343
|
-
},
|
|
344
|
-
children: (label == null ? void 0 : label.asset) ? /* @__PURE__ */ React.createElement(ReactAsset, __spreadValues$3({}, label == null ? void 0 : label.asset)) : null
|
|
345
|
-
};
|
|
346
|
-
};
|
|
347
|
-
|
|
348
|
-
var __defProp$2 = Object.defineProperty;
|
|
349
|
-
var __getOwnPropSymbols$2 = Object.getOwnPropertySymbols;
|
|
350
|
-
var __hasOwnProp$2 = Object.prototype.hasOwnProperty;
|
|
351
|
-
var __propIsEnum$2 = Object.prototype.propertyIsEnumerable;
|
|
352
|
-
var __defNormalProp$2 = (obj, key, value) => key in obj ? __defProp$2(obj, key, { enumerable: true, configurable: true, writable: true, value }) : obj[key] = value;
|
|
353
|
-
var __spreadValues$2 = (a, b) => {
|
|
354
|
-
for (var prop in b || (b = {}))
|
|
355
|
-
if (__hasOwnProp$2.call(b, prop))
|
|
356
|
-
__defNormalProp$2(a, prop, b[prop]);
|
|
357
|
-
if (__getOwnPropSymbols$2)
|
|
358
|
-
for (var prop of __getOwnPropSymbols$2(b)) {
|
|
359
|
-
if (__propIsEnum$2.call(b, prop))
|
|
360
|
-
__defNormalProp$2(a, prop, b[prop]);
|
|
361
|
-
}
|
|
362
|
-
return a;
|
|
363
|
-
};
|
|
364
|
-
const Action = (props) => {
|
|
365
|
-
var _a;
|
|
366
|
-
const { label } = props;
|
|
367
|
-
const buttonProps = useAction(props);
|
|
368
|
-
return /* @__PURE__ */ React.createElement("div", null, /* @__PURE__ */ React.createElement(Button, __spreadValues$2({
|
|
369
|
-
variant: isBackAction(props) ? "ghost" : "solid"
|
|
370
|
-
}, buttonProps), ((_a = props == null ? void 0 : props.metaData) == null ? void 0 : _a.role) === "back" && /* @__PURE__ */ React.createElement(ChevronLeftIcon, null), label && /* @__PURE__ */ React.createElement(Text$1, null, /* @__PURE__ */ React.createElement(ReactAsset, __spreadValues$2({}, label)))));
|
|
371
|
-
};
|
|
372
|
-
|
|
373
|
-
var __defProp$1 = Object.defineProperty;
|
|
374
|
-
var __getOwnPropSymbols$1 = Object.getOwnPropertySymbols;
|
|
375
|
-
var __hasOwnProp$1 = Object.prototype.hasOwnProperty;
|
|
376
|
-
var __propIsEnum$1 = Object.prototype.propertyIsEnumerable;
|
|
377
|
-
var __defNormalProp$1 = (obj, key, value) => key in obj ? __defProp$1(obj, key, { enumerable: true, configurable: true, writable: true, value }) : obj[key] = value;
|
|
378
|
-
var __spreadValues$1 = (a, b) => {
|
|
379
|
-
for (var prop in b || (b = {}))
|
|
380
|
-
if (__hasOwnProp$1.call(b, prop))
|
|
381
|
-
__defNormalProp$1(a, prop, b[prop]);
|
|
382
|
-
if (__getOwnPropSymbols$1)
|
|
383
|
-
for (var prop of __getOwnPropSymbols$1(b)) {
|
|
384
|
-
if (__propIsEnum$1.call(b, prop))
|
|
385
|
-
__defNormalProp$1(a, prop, b[prop]);
|
|
386
|
-
}
|
|
387
|
-
return a;
|
|
388
|
-
};
|
|
389
|
-
const Info = (props) => {
|
|
390
|
-
var _a, _b, _c, _d;
|
|
391
|
-
return /* @__PURE__ */ React.createElement(Box, {
|
|
392
|
-
minW: { base: void 0, md: "md" }
|
|
393
|
-
}, /* @__PURE__ */ React.createElement(Stack, {
|
|
394
|
-
gap: "10"
|
|
395
|
-
}, props.title && /* @__PURE__ */ React.createElement(Heading, {
|
|
396
|
-
size: "lg",
|
|
397
|
-
as: "h1"
|
|
398
|
-
}, /* @__PURE__ */ React.createElement(ReactAsset, __spreadValues$1({}, props.title))), props.subTitle && /* @__PURE__ */ React.createElement(Heading, {
|
|
399
|
-
size: "md",
|
|
400
|
-
as: "h3"
|
|
401
|
-
}, /* @__PURE__ */ React.createElement(ReactAsset, __spreadValues$1({}, props.subTitle))), /* @__PURE__ */ React.createElement(Box, null, props.primaryInfo && /* @__PURE__ */ React.createElement(ReactAsset, __spreadValues$1({}, props.primaryInfo))), /* @__PURE__ */ React.createElement(Stack, {
|
|
402
|
-
gap: "4"
|
|
403
|
-
}, (props == null ? void 0 : props.segmentedActions) && /* @__PURE__ */ React.createElement(Divider, null), /* @__PURE__ */ React.createElement(HStack, {
|
|
404
|
-
justifyContent: "space-between"
|
|
405
|
-
}, /* @__PURE__ */ React.createElement(ButtonGroup, {
|
|
406
|
-
spacing: "6"
|
|
407
|
-
}, (_b = (_a = props == null ? void 0 : props.segmentedActions) == null ? void 0 : _a.prev) == null ? void 0 : _b.map((a) => /* @__PURE__ */ React.createElement(ReactAsset, __spreadValues$1({
|
|
408
|
-
key: a.asset.id
|
|
409
|
-
}, a)))), /* @__PURE__ */ React.createElement(ButtonGroup, {
|
|
410
|
-
spacing: "6"
|
|
411
|
-
}, (_d = (_c = props == null ? void 0 : props.segmentedActions) == null ? void 0 : _c.next) == null ? void 0 : _d.map((a) => /* @__PURE__ */ React.createElement(ReactAsset, __spreadValues$1({
|
|
412
|
-
key: a.asset.id
|
|
413
|
-
}, a))))))));
|
|
414
|
-
};
|
|
415
|
-
|
|
416
|
-
var __defProp = Object.defineProperty;
|
|
417
|
-
var __getOwnPropSymbols = Object.getOwnPropertySymbols;
|
|
418
|
-
var __hasOwnProp = Object.prototype.hasOwnProperty;
|
|
419
|
-
var __propIsEnum = Object.prototype.propertyIsEnumerable;
|
|
420
|
-
var __defNormalProp = (obj, key, value) => key in obj ? __defProp(obj, key, { enumerable: true, configurable: true, writable: true, value }) : obj[key] = value;
|
|
421
|
-
var __spreadValues = (a, b) => {
|
|
422
|
-
for (var prop in b || (b = {}))
|
|
423
|
-
if (__hasOwnProp.call(b, prop))
|
|
424
|
-
__defNormalProp(a, prop, b[prop]);
|
|
425
|
-
if (__getOwnPropSymbols)
|
|
426
|
-
for (var prop of __getOwnPropSymbols(b)) {
|
|
427
|
-
if (__propIsEnum.call(b, prop))
|
|
428
|
-
__defNormalProp(a, prop, b[prop]);
|
|
429
|
-
}
|
|
430
|
-
return a;
|
|
431
|
-
};
|
|
432
|
-
const Image = (props) => {
|
|
433
|
-
const { metaData, caption, altText } = props;
|
|
434
|
-
console.log(props);
|
|
435
|
-
return /* @__PURE__ */ React.createElement("figure", {
|
|
436
|
-
className: "figure"
|
|
437
|
-
}, /* @__PURE__ */ React.createElement("img", {
|
|
438
|
-
className: "figure-img img-fluid",
|
|
439
|
-
src: metaData.ref,
|
|
440
|
-
alt: altText
|
|
441
|
-
}), caption && /* @__PURE__ */ React.createElement("figcaption", {
|
|
442
|
-
className: "figure-caption",
|
|
443
|
-
style: { marginTop: 15 }
|
|
444
|
-
}, /* @__PURE__ */ React.createElement(ReactAsset, __spreadValues({}, caption))));
|
|
445
|
-
};
|
|
446
|
-
|
|
447
|
-
const OptionalChakraThemeProvider = (props) => {
|
|
448
|
-
const theme = useTheme();
|
|
449
|
-
if (theme) {
|
|
450
|
-
return /* @__PURE__ */ React.createElement(React.Fragment, null, props.children);
|
|
451
|
-
}
|
|
452
|
-
return /* @__PURE__ */ React.createElement(ChakraProvider, null, props.children);
|
|
453
|
-
};
|
|
454
|
-
class ReferenceAssetsPlugin {
|
|
455
|
-
constructor() {
|
|
456
|
-
this.name = "reference-assets-web-plugin";
|
|
457
|
-
}
|
|
458
|
-
applyReact(reactPlayer) {
|
|
459
|
-
reactPlayer.registerPlugin(new AssetProviderPlugin([
|
|
460
|
-
["input", Input],
|
|
461
|
-
["text", Text],
|
|
462
|
-
["action", Action],
|
|
463
|
-
["info", Info],
|
|
464
|
-
["collection", Collection],
|
|
465
|
-
["image", Image]
|
|
466
|
-
]));
|
|
467
|
-
reactPlayer.hooks.webComponent.tap(this.name, (Comp) => {
|
|
468
|
-
return () => {
|
|
469
|
-
return /* @__PURE__ */ React.createElement(OptionalChakraThemeProvider, null, /* @__PURE__ */ React.createElement(Comp, null));
|
|
470
|
-
};
|
|
471
|
-
});
|
|
472
|
-
}
|
|
473
|
-
apply(player) {
|
|
474
|
-
player.registerPlugin(new ReferenceAssetsPlugin$1());
|
|
475
|
-
}
|
|
476
|
-
}
|
|
477
|
-
|
|
478
|
-
export { Action, Collection, Image, Info, Input, ReferenceAssetsPlugin, Text, TextModifierContext, getConfig, getLinkModifier, useAction, useInputAsset, useInputBeacon, useText };
|
|
479
|
-
//# sourceMappingURL=index.esm.js.map
|
|
@@ -1,126 +0,0 @@
|
|
|
1
|
-
{
|
|
2
|
-
"source": "/home/circleci/.cache/bazel/_bazel_circleci/e8362d362e14c7d23506d1dfa3aea8b8/sandbox/processwrapper-sandbox/3566/execroot/player/node_modules/@player-ui/reference-assets-plugin/dist/index.d.ts",
|
|
3
|
-
"name": "ActionAsset",
|
|
4
|
-
"type": "object",
|
|
5
|
-
"properties": {
|
|
6
|
-
"value": {
|
|
7
|
-
"required": false,
|
|
8
|
-
"node": {
|
|
9
|
-
"type": "string",
|
|
10
|
-
"title": "ActionAsset.value",
|
|
11
|
-
"description": "The transition value of the action in the state machine"
|
|
12
|
-
}
|
|
13
|
-
},
|
|
14
|
-
"label": {
|
|
15
|
-
"required": false,
|
|
16
|
-
"node": {
|
|
17
|
-
"type": "ref",
|
|
18
|
-
"ref": "AssetWrapper<AnyTextAsset>",
|
|
19
|
-
"genericArguments": [
|
|
20
|
-
{
|
|
21
|
-
"type": "ref",
|
|
22
|
-
"ref": "AnyTextAsset"
|
|
23
|
-
}
|
|
24
|
-
],
|
|
25
|
-
"title": "ActionAsset.label",
|
|
26
|
-
"description": "A text-like asset for the action's label"
|
|
27
|
-
}
|
|
28
|
-
},
|
|
29
|
-
"exp": {
|
|
30
|
-
"required": false,
|
|
31
|
-
"node": {
|
|
32
|
-
"type": "ref",
|
|
33
|
-
"ref": "Expression",
|
|
34
|
-
"title": "ActionAsset.exp",
|
|
35
|
-
"description": "An optional expression to execute before transitioning"
|
|
36
|
-
}
|
|
37
|
-
},
|
|
38
|
-
"accessibility": {
|
|
39
|
-
"required": false,
|
|
40
|
-
"node": {
|
|
41
|
-
"type": "string",
|
|
42
|
-
"title": "ActionAsset.accessibility",
|
|
43
|
-
"description": "An optional string that describes the action for screen-readers"
|
|
44
|
-
}
|
|
45
|
-
},
|
|
46
|
-
"metaData": {
|
|
47
|
-
"required": false,
|
|
48
|
-
"node": {
|
|
49
|
-
"type": "object",
|
|
50
|
-
"properties": {
|
|
51
|
-
"beacon": {
|
|
52
|
-
"required": false,
|
|
53
|
-
"node": {
|
|
54
|
-
"source": "/home/circleci/.cache/bazel/_bazel_circleci/e8362d362e14c7d23506d1dfa3aea8b8/sandbox/processwrapper-sandbox/3566/execroot/player/node_modules/@player-ui/beacon-plugin/dist/index.d.ts",
|
|
55
|
-
"name": "BeaconDataType",
|
|
56
|
-
"type": "or",
|
|
57
|
-
"or": [
|
|
58
|
-
{
|
|
59
|
-
"type": "string",
|
|
60
|
-
"title": "BeaconDataType"
|
|
61
|
-
},
|
|
62
|
-
{
|
|
63
|
-
"type": "record",
|
|
64
|
-
"keyType": {
|
|
65
|
-
"type": "string"
|
|
66
|
-
},
|
|
67
|
-
"valueType": {
|
|
68
|
-
"type": "any"
|
|
69
|
-
},
|
|
70
|
-
"title": "BeaconDataType"
|
|
71
|
-
}
|
|
72
|
-
],
|
|
73
|
-
"title": "ActionAsset.metaData.beacon",
|
|
74
|
-
"description": "Additional data to beacon"
|
|
75
|
-
}
|
|
76
|
-
},
|
|
77
|
-
"skipValidation": {
|
|
78
|
-
"required": false,
|
|
79
|
-
"node": {
|
|
80
|
-
"type": "boolean",
|
|
81
|
-
"title": "ActionAsset.metaData.skipValidation",
|
|
82
|
-
"description": "Force transition to the next view without checking for validation"
|
|
83
|
-
}
|
|
84
|
-
},
|
|
85
|
-
"role": {
|
|
86
|
-
"required": false,
|
|
87
|
-
"node": {
|
|
88
|
-
"type": "string",
|
|
89
|
-
"title": "ActionAsset.metaData.role",
|
|
90
|
-
"description": "string value to decide for the left anchor sign"
|
|
91
|
-
}
|
|
92
|
-
}
|
|
93
|
-
},
|
|
94
|
-
"additionalProperties": false,
|
|
95
|
-
"title": "ActionAsset.metaData",
|
|
96
|
-
"description": "Additional optional data to assist with the action interactions on the page"
|
|
97
|
-
}
|
|
98
|
-
}
|
|
99
|
-
},
|
|
100
|
-
"additionalProperties": false,
|
|
101
|
-
"title": "ActionAsset",
|
|
102
|
-
"description": "User actions can be represented in several places.\nEach view typically has one or more actions that allow the user to navigate away from that view.\nIn addition, several asset types can have actions that apply to that asset only.",
|
|
103
|
-
"genericTokens": [
|
|
104
|
-
{
|
|
105
|
-
"symbol": "AnyTextAsset",
|
|
106
|
-
"constraints": {
|
|
107
|
-
"type": "ref",
|
|
108
|
-
"ref": "Asset"
|
|
109
|
-
},
|
|
110
|
-
"default": {
|
|
111
|
-
"type": "ref",
|
|
112
|
-
"ref": "Asset"
|
|
113
|
-
}
|
|
114
|
-
}
|
|
115
|
-
],
|
|
116
|
-
"extends": {
|
|
117
|
-
"type": "ref",
|
|
118
|
-
"ref": "Asset<'action'>",
|
|
119
|
-
"genericArguments": [
|
|
120
|
-
{
|
|
121
|
-
"type": "string",
|
|
122
|
-
"const": "action"
|
|
123
|
-
}
|
|
124
|
-
]
|
|
125
|
-
}
|
|
126
|
-
}
|
|
@@ -1,40 +0,0 @@
|
|
|
1
|
-
{
|
|
2
|
-
"source": "/home/circleci/.cache/bazel/_bazel_circleci/e8362d362e14c7d23506d1dfa3aea8b8/sandbox/processwrapper-sandbox/3566/execroot/player/node_modules/@player-ui/reference-assets-plugin/dist/index.d.ts",
|
|
3
|
-
"name": "CollectionAsset",
|
|
4
|
-
"type": "object",
|
|
5
|
-
"properties": {
|
|
6
|
-
"label": {
|
|
7
|
-
"required": false,
|
|
8
|
-
"node": {
|
|
9
|
-
"type": "ref",
|
|
10
|
-
"ref": "AssetWrapper",
|
|
11
|
-
"title": "CollectionAsset.label",
|
|
12
|
-
"description": "An optional label to title the collection"
|
|
13
|
-
}
|
|
14
|
-
},
|
|
15
|
-
"values": {
|
|
16
|
-
"required": false,
|
|
17
|
-
"node": {
|
|
18
|
-
"type": "array",
|
|
19
|
-
"elementType": {
|
|
20
|
-
"type": "ref",
|
|
21
|
-
"ref": "AssetWrapper"
|
|
22
|
-
},
|
|
23
|
-
"title": "CollectionAsset.values",
|
|
24
|
-
"description": "The string value to show"
|
|
25
|
-
}
|
|
26
|
-
}
|
|
27
|
-
},
|
|
28
|
-
"additionalProperties": false,
|
|
29
|
-
"title": "CollectionAsset",
|
|
30
|
-
"extends": {
|
|
31
|
-
"type": "ref",
|
|
32
|
-
"ref": "Asset<'collection'>",
|
|
33
|
-
"genericArguments": [
|
|
34
|
-
{
|
|
35
|
-
"type": "string",
|
|
36
|
-
"const": "collection"
|
|
37
|
-
}
|
|
38
|
-
]
|
|
39
|
-
}
|
|
40
|
-
}
|