Press n or j to go to the next uncovered block, b, p or k for the previous block.
| 1 2 3 4 5 6 7 8 9 10 11 12 13 14 15 16 17 18 19 20 21 22 23 24 25 26 27 28 29 30 31 32 33 34 35 36 37 38 39 40 41 42 43 44 45 46 47 48 49 50 51 52 53 54 55 56 57 58 59 60 61 62 63 64 65 66 67 68 69 70 71 72 73 74 75 76 77 78 79 80 | 1x 1x 1x 1x 1x | import React, { useMemo } from "react";
import l10n from "shared/lib/lang/l10n";
import { CollisionGroup } from "shared/lib/resources/types";
import { ToggleButtonGroup } from "ui/form/ToggleButtonGroup";
type CollisionMaskPickerProps = {
id: string;
includePlayer?: boolean;
includeNone?: boolean;
} & (
| {
multiple: true;
value: CollisionGroup[];
onChange: (newValue: CollisionGroup[]) => void;
}
| {
multiple?: false;
value: CollisionGroup;
onChange: (newValue: CollisionGroup) => void;
}
);
interface CollisionMaskPickerOption {
value: CollisionGroup;
label: React.ReactNode;
title: string;
}
const CollisionMaskPicker = ({
id,
includePlayer,
includeNone,
...props
}: CollisionMaskPickerProps) => {
const options = useMemo(
() =>
([] as CollisionMaskPickerOption[]).concat(
includeNone && !props.multiple
? [
{
value: "",
label: l10n("FIELD_NONE"),
title: l10n("FIELD_NONE"),
},
]
: [],
includePlayer
? [
{
value: "player",
label: l10n("FIELD_PLAYER"),
title: l10n("FIELD_PLAYER"),
},
]
: [],
[
{
value: "1",
label: "1",
title: l10n("FIELD_COLLISION_GROUP_N", { n: 1 }),
},
{
value: "2",
label: "2",
title: l10n("FIELD_COLLISION_GROUP_N", { n: 2 }),
},
{
value: "3",
label: "3",
title: l10n("FIELD_COLLISION_GROUP_N", { n: 3 }),
},
],
) as CollisionMaskPickerOption[],
[includeNone, includePlayer, props.multiple],
);
return <ToggleButtonGroup name={id} options={options} {...props} />;
};
export default CollisionMaskPicker;
|