react-base-guide/lib/components/datepicker/day-of-weeks.js

react ui components

"use strict";
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 styled_components_1 = __importDefault(require("styled-components"));
const Week = styled_components_1.default.div `
  box-sizing: border-box;
  display: flex;
  justify-content: space-between;
  width: 100%;
  user-select: none;
  font-size: 12px;
  opacity: 0.7;
  pointer-events: none;
`;
const Day = styled_components_1.default.div `
  box-sizing: border-box;
  width: 14%;
  height: 32px;
  line-height: 32px;
  text-align: center;
  border-radius: ${p => p.theme.radius.element};
  color: ${p => p.theme.palette.text.primary};
  transition: background 0.3s, box-shadow 0.3s;
  &:nth-child(7n + 7), &:nth-child(7n + 6) {
    color: ${p => p.theme.palette.text.error};
  }
`;
const DaysOfWeek = ({ days }) => ((0, jsx_runtime_1.jsx)(Week, { children: days && days.map((day, key) => ((0, jsx_runtime_1.jsx)(Day, { children: day }, key))) }));
exports.default = DaysOfWeek;
//# sourceMappingURL=day-of-weeks.js.map