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 81 82 83 84 85 86 87 88 89 90 91 92 93 94 95 96 97 98 99 100 101 102 103 104 105 106 107 108 | 1x 1x 1x 1x 1x 1x 1x 1x 1x 1x | import React from "react";
import { useAppSelector } from "store/hooks";
import {
customEventSelectors,
variableSelectors,
} from "store/features/entities/entitiesSelectors";
import { ScriptValue } from "shared/lib/scriptValue/types";
import ValueSelect from "components/forms/ValueSelect";
import { VariableIndexBracket } from "components/forms/VariableIndexInput";
import styled from "styled-components";
interface ArraySetProps {
name: string;
variableId: string;
value: ScriptValue[];
entityId: string;
onChange: (newValue: ScriptValue[]) => void;
}
export const VariableIndexInputGroup = styled.div`
display: flex;
flex-direction: column;
width: 100%;
`;
const ArrayValueRow = styled.div`
display: flex;
width: 100%;
box-sizing: border-box;
align-items: center;
gap: 10px;
& > * {
margin-bottom: 10px;
}
`;
const VariableBracketContainer = styled.div`
display: flex;
flex: 0 1;
flex-direction: row;
height: 20px;
align-items: center;
`;
export const ArraySet = ({
name,
variableId,
value,
entityId,
onChange,
}: ArraySetProps) => {
const variableIsLocal = variableId && variableId.startsWith("L");
const variableIsParam = variableId && variableId.startsWith("V");
const customEvent = useAppSelector((state) =>
customEventSelectors.selectById(state, entityId),
);
const variable = useAppSelector((state) => {
let id = variableId;
if (variableIsLocal) {
id = `${entityId}__${variableId}`;
}
return variableSelectors.selectById(state, id);
});
let arrayLength = 1;
if (
variableIsParam &&
customEvent.variables[variableId]?.passByReference === "array"
) {
arrayLength = customEvent.variables[variableId].length;
} else if (variable?.type === "array") {
arrayLength = variable.length;
}
const onChangeValue = (i: number) => (newValue: ScriptValue) => {
const newValues = Array.from(
{ length: arrayLength },
(_, index) => value[index] ?? { type: "number", value: 0 },
);
newValues[i] = newValue;
onChange(newValues);
};
return (
<VariableIndexInputGroup>
{Array.from({ length: arrayLength }, (_, i) => (
<ArrayValueRow key={i}>
<VariableBracketContainer>
<VariableIndexBracket $type="open" />
<div>{i}</div>
<VariableIndexBracket $type="close" />
</VariableBracketContainer>
<ValueSelect
name={`${name}_${variableId}_${i}_value`}
entityId={entityId}
value={value[i] ?? { type: "number", value: 0 }}
onChange={onChangeValue(i)}
innerValue
/>
</ArrayValueRow>
))}
</VariableIndexInputGroup>
);
};
|