@tolokoban/ui
Version:
React components with theme
21 lines • 3.57 kB
JavaScript
import { jsx as _jsx } from "react/jsx-runtime";
import { useChangeableValue } from "../../hooks/changeable-value.js";
import { ViewLabel } from "../Label/index.js";
import { ViewTouchable } from "../Touchable/index.js";
import { Theme, classnameCommon, styleColor, styleCommon, } from "./../../theme/index.js";
import Styles from "./Options.module.css";
const $ = Theme.classNames;
export function ViewOptions(props) {
const { label, children } = props;
const [value, setValue] = useChangeableValue(props);
return (_jsx(ViewLabel, { value: label, fullwidth: props.fullwidth, children: _jsx("div", { className: $.join(Styles.Options, props.className,
// eslint-disable-next-line @typescript-eslint/no-unsafe-call
classnameCommon(props)), style: Object.assign(Object.assign({}, styleCommon(props)), styleColor(props)), children: children.map((child) => {
var _a;
const key = typeof value === "number"
? parseFloat(`${(_a = child.key) !== null && _a !== void 0 ? _a : "0"}`)
: child.key;
return key === value ? (_jsx("div", { className: $.join(Styles.button, Styles.selected), style: styleColor({ color: props.colorSelection }), children: child }, key)) : (_jsx(ViewTouchable, { className: $.join(Styles.button, Styles.unselected), style: styleColor({ color: props.color }), onClick: () => setValue(key), children: child }, key));
}) }) }));
}
//# sourceMappingURL=data:application/json;base64,eyJ2ZXJzaW9uIjozLCJmaWxlIjoiT3B0aW9ucy5qcyIsInNvdXJjZVJvb3QiOiIiLCJzb3VyY2VzIjpbIi4uLy4uLy4uL3NyYy92aWV3L09wdGlvbnMvT3B0aW9ucy50c3giXSwibmFtZXMiOltdLCJtYXBwaW5ncyI6IjtBQUVBLE9BQU8sRUFBRSxrQkFBa0IsRUFBRSxNQUFNLGlDQUFpQyxDQUFBO0FBRXBFLE9BQU8sRUFBRSxTQUFTLEVBQUUsTUFBTSxtQkFBbUIsQ0FBQTtBQUM3QyxPQUFPLEVBQUUsYUFBYSxFQUFFLE1BQU0sdUJBQXVCLENBQUE7QUFDckQsT0FBTyxFQUVILEtBQUssRUFDTCxlQUFlLEVBQ2YsVUFBVSxFQUNWLFdBQVcsR0FDZCxNQUFNLFNBQVMsQ0FBQTtBQUVoQixPQUFPLE1BQU0sTUFBTSxzQkFBc0IsQ0FBQTtBQWlCekMsTUFBTSxDQUFDLEdBQUcsS0FBSyxDQUFDLFVBQVUsQ0FBQTtBQUUxQixNQUFNLFVBQVUsV0FBVyxDQUFJLEtBQTBCO0lBQ3JELE1BQU0sRUFBRSxLQUFLLEVBQUUsUUFBUSxFQUFFLEdBQUcsS0FBSyxDQUFBO0lBQ2pDLE1BQU0sQ0FBQyxLQUFLLEVBQUUsUUFBUSxDQUFDLEdBQUcsa0JBQWtCLENBQUMsS0FBSyxDQUFDLENBQUE7SUFDbkQsT0FBTyxDQUNILEtBQUMsU0FBUyxJQUFDLEtBQUssRUFBRSxLQUFLLEVBQUUsU0FBUyxFQUFFLEtBQUssQ0FBQyxTQUFTLFlBQy9DLGNBQ0ksU0FBUyxFQUFFLENBQUMsQ0FBQyxJQUFJLENBQ2IsTUFBTSxDQUFDLE9BQU8sRUFDZCxLQUFLLENBQUMsU0FBUztZQUNmLDZEQUE2RDtZQUM3RCxlQUFlLENBQUMsS0FBSyxDQUFDLENBQ3pCLEVBQ0QsS0FBSyxrQ0FBTyxXQUFXLENBQUMsS0FBSyxDQUFDLEdBQUssVUFBVSxDQUFDLEtBQUssQ0FBQyxhQUVuRCxRQUFRLENBQUMsR0FBRyxDQUFDLENBQUMsS0FBSyxFQUFFLEVBQUU7O2dCQUNwQixNQUFNLEdBQUcsR0FDTCxPQUFPLEtBQUssS0FBSyxRQUFRO29CQUNyQixDQUFDLENBQUMsVUFBVSxDQUFDLEdBQUcsTUFBQSxLQUFLLENBQUMsR0FBRyxtQ0FBSSxHQUFHLEVBQUUsQ0FBQztvQkFDbkMsQ0FBQyxDQUFDLEtBQUssQ0FBQyxHQUFHLENBQUE7Z0JBQ25CLE9BQU8sR0FBRyxLQUFLLEtBQUssQ0FBQyxDQUFDLENBQUMsQ0FDbkIsY0FDSSxTQUFTLEVBQUUsQ0FBQyxDQUFDLElBQUksQ0FBQyxNQUFNLENBQUMsTUFBTSxFQUFFLE1BQU0sQ0FBQyxRQUFRLENBQUMsRUFFakQsS0FBSyxFQUFFLFVBQVUsQ0FBQyxFQUFFLEtBQUssRUFBRSxLQUFLLENBQUMsY0FBYyxFQUFFLENBQUMsWUFFakQsS0FBSyxJQUhELEdBQUcsQ0FJTixDQUNULENBQUMsQ0FBQyxDQUFDLENBQ0EsS0FBQyxhQUFhLElBQ1YsU0FBUyxFQUFFLENBQUMsQ0FBQyxJQUFJLENBQUMsTUFBTSxDQUFDLE1BQU0sRUFBRSxNQUFNLENBQUMsVUFBVSxDQUFDLEVBRW5ELEtBQUssRUFBRSxVQUFVLENBQUMsRUFBRSxLQUFLLEVBQUUsS0FBSyxDQUFDLEtBQUssRUFBRSxDQUFDLEVBQ3pDLE9BQU8sRUFBRSxHQUFHLEVBQUUsQ0FBQyxRQUFRLENBQUMsR0FBUSxDQUFDLFlBRWhDLEtBQUssSUFKRCxHQUFHLENBS0ksQ0FDbkIsQ0FBQTtZQUNMLENBQUMsQ0FBQyxHQUNBLEdBQ0UsQ0FDZixDQUFBO0FBQ0wsQ0FBQyJ9