react-crossword-v2
Version:
A flexible, responsive, and easy-to-use crossword component for React apps
57 lines • 2.56 kB
JavaScript
;
var __importDefault = (this && this.__importDefault) || function (mod) {
return (mod && mod.__esModule) ? mod : { "default": mod };
};
Object.defineProperty(exports, "__esModule", { value: true });
const jsx_runtime_1 = require("react/jsx-runtime");
const react_1 = require("react");
const prop_types_1 = __importDefault(require("prop-types"));
// import styled from 'styled-components';
const context_1 = require("./context");
const Clue_1 = __importDefault(require("./Clue"));
// interface ClueInfo {
// number: string;
// clue: string;
// correct?: boolean;
// }
const directionCluesPropTypes = {
/** direction of this list of clues ("across" or "down") */
direction: prop_types_1.default.string.isRequired,
// /** clues for this List's direction */
// clues: PropTypes.arrayOf(
// PropTypes.shape({
// /** number of the clue (the label shown) */
// number: PropTypes.string.isRequired,
// /** clue text */
// clue: PropTypes.node.isRequired,
// /** whether the answer/guess is correct */
// correct: PropTypes.bool,
// })
// ).isRequired,
};
function DirectionClues({ direction }) {
const { clues,
// selectedPosition: { row: focusedRow, col: focusedCol },
// selectedDirection: currentDirection,
// selectedNumber: currentNumber,
} = (0, react_1.useContext)(context_1.CrosswordContext);
return ((0, jsx_runtime_1.jsxs)("div", Object.assign({ className: "direction" }, { children: [(0, jsx_runtime_1.jsx)("h3", Object.assign({ className: "header" }, { children: direction.toUpperCase() }), void 0), clues === null || clues === void 0 ? void 0 : clues[direction].map(({ number, clue, correct }) => ((0, jsx_runtime_1.jsx)(Clue_1.default, Object.assign({ direction: direction, number: number, correct: correct }, { children: clue }), number)))] }), void 0));
}
exports.default = DirectionClues;
DirectionClues.propTypes = {
/** direction of this list of clues ("across" or "down") */
direction: prop_types_1.default.string.isRequired,
// /** clues for this List's direction */
// clues: PropTypes.arrayOf(
// PropTypes.shape({
// /** number of the clue (the label shown) */
// number: PropTypes.string.isRequired,
// /** clue text */
// clue: PropTypes.node.isRequired,
// /** whether the answer/guess is correct */
// correct: PropTypes.bool,
// })
// ).isRequired,
};
DirectionClues.defaultProps = {};
//# sourceMappingURL=DirectionClues.js.map