@smart-react-components/ui/components/Table/TableElement.js

SRC UI includes React and Styled components.

"use strict";
var __importDefault = (this && this.__importDefault) || function (mod) {
    return (mod && mod.__esModule) ? mod : { "default": mod };
};
Object.defineProperty(exports, "__esModule", { value: true });
const Table_1 = __importDefault(require("@smart-react-components/core/Element/Table"));
const styled_components_1 = __importDefault(require("styled-components"));
exports.default = (0, styled_components_1.default)(Table_1.default).attrs({
    getTableSize: (v, t) => `
    font-size: ${t.$.size.table[v].fontSize};

    > * > tr > * {
      padding: ${t.$.size.table[v].padding.y} ${t.$.size.table[v].padding.x};
    }

    > thead {
      font-size: ${t.$.size.table[v].headFontSize};
    }
  `,
})(({ theme, hasBorderX, hasBorderY, hasHeadBackground, hasHover, isBlock, isSoft, isStriped, palette, shape, stripedOrientation }) => {
    var _a, _b, _c, _d, _e, _f, _g, _h, _j, _k, _l, _m, _o, _p, _q, _r, _s, _t, _u, _v, _w, _x, _y, _z, _0, _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;
    return `
  border-collapse: separate;
  border-spacing: 0;
  empty-cells: hide;
  font-family: ${theme.$.fontFamily.table};

  > thead {
    font-family: ${theme.$.fontFamily.tableHead};
    font-weight: ${theme.$.fontWeight.tableHead};
  }

  ${isBlock
        ? `
      width: 100%;
    `
        : ''}

  > * > tr > * {
    border: solid 0;
    box-sizing: border-box;
    fill: currentcolor;

    ${hasBorderX
        ? `
        border-right-width: ${theme.$.length.table.border};

        &:first-child {
          border-left-width: ${theme.$.length.table.border};
        }
      `
        : ''}

    ${hasBorderY
        ? `
        border-bottom-width: ${theme.$.length.table.border};
      `
        : ''}
  }

  ${hasBorderY
        ? `
      > thead > tr > * {
        border-bottom-width: ${theme.$.length.table.headBorder};
      }

      > *:first-child > tr:first-child > * {
        border-top-width: ${theme.$.length.table.border};
      }
    `
        : ''}

  > *:first-child > tr:first-child > * {
    border-top-left-radius: ${theme.$.radius.table[shape]};
    border-top-right-radius: ${theme.$.radius.table[shape]};
  }

  > *:last-child > tr:last-child > * {
    border-bottom-left-radius: ${theme.$.radius.table[shape]};
    border-bottom-right-radius: ${theme.$.radius.table[shape]};
  }

  ${!isSoft
        ? `
      > * > tr > * {
        background: ${(_c = (_b = (_a = theme.$.palette[palette].table) === null || _a === void 0 ? void 0 : _a.odd) === null || _b === void 0 ? void 0 : _b.background) !== null && _c !== void 0 ? _c : theme.$.palette[palette].background};
        border-color: ${(_f = (_e = (_d = theme.$.palette[palette].table) === null || _d === void 0 ? void 0 : _d.odd) === null || _e === void 0 ? void 0 : _e.border) !== null && _f !== void 0 ? _f : theme.$.palette[palette].dynamicest};
        color: ${(_j = (_h = (_g = theme.$.palette[palette].table) === null || _g === void 0 ? void 0 : _g.odd) === null || _h === void 0 ? void 0 : _h.font) !== null && _j !== void 0 ? _j : theme.$.palette[palette].font};
      }

      ${hasHeadBackground
            ? `
          > thead > tr > * {
            background: ${(_m = (_l = (_k = theme.$.palette[palette].table) === null || _k === void 0 ? void 0 : _k.even) === null || _l === void 0 ? void 0 : _l.background) !== null && _m !== void 0 ? _m : theme.$.palette[palette].dynamic};
            border-color: ${(_q = (_p = (_o = theme.$.palette[palette].table) === null || _o === void 0 ? void 0 : _o.even) === null || _p === void 0 ? void 0 : _p.border) !== null && _q !== void 0 ? _q : theme.$.palette[palette].dynamicest};
            color: ${(_t = (_s = (_r = theme.$.palette[palette].table) === null || _r === void 0 ? void 0 : _r.even) === null || _s === void 0 ? void 0 : _s.font) !== null && _t !== void 0 ? _t : theme.$.palette[palette].font};
          }
        `
            : ''}

      ${isStriped
            ? `
          > tbody > tr:nth-child(${stripedOrientation}) > * {
            background: ${(_w = (_v = (_u = theme.$.palette[palette].table) === null || _u === void 0 ? void 0 : _u.even) === null || _v === void 0 ? void 0 : _v.background) !== null && _w !== void 0 ? _w : theme.$.palette[palette].dynamic};
            border-color: ${(_z = (_y = (_x = theme.$.palette[palette].table) === null || _x === void 0 ? void 0 : _x.even) === null || _y === void 0 ? void 0 : _y.border) !== null && _z !== void 0 ? _z : theme.$.palette[palette].dynamicest};
            color: ${(_2 = (_1 = (_0 = theme.$.palette[palette].table) === null || _0 === void 0 ? void 0 : _0.even) === null || _1 === void 0 ? void 0 : _1.font) !== null && _2 !== void 0 ? _2 : theme.$.palette[palette].font};
          }
        `
            : ''}

      ${hasHover
            ? `
          > tbody > tr {
            > * {
              transition: background 150ms 0s ease-in-out;
            }

            &:hover > * {
              background: ${(_6 = (_5 = (_4 = (_3 = theme.$.palette[palette].table) === null || _3 === void 0 ? void 0 : _3.odd) === null || _4 === void 0 ? void 0 : _4.hover) === null || _5 === void 0 ? void 0 : _5.background) !== null && _6 !== void 0 ? _6 : theme.$.palette[palette].dynamicer};
              border-color: ${(_10 = (_9 = (_8 = (_7 = theme.$.palette[palette].table) === null || _7 === void 0 ? void 0 : _7.odd) === null || _8 === void 0 ? void 0 : _8.hover) === null || _9 === void 0 ? void 0 : _9.border) !== null && _10 !== void 0 ? _10 : theme.$.palette[palette].dynamicest};
              color: ${(_14 = (_13 = (_12 = (_11 = theme.$.palette[palette].table) === null || _11 === void 0 ? void 0 : _11.odd) === null || _12 === void 0 ? void 0 : _12.hover) === null || _13 === void 0 ? void 0 : _13.font) !== null && _14 !== void 0 ? _14 : theme.$.palette[palette].font};
            }

            ${(isStriped && ((_17 = (_16 = (_15 = theme.$.palette[palette].table) === null || _15 === void 0 ? void 0 : _15.even) === null || _16 === void 0 ? void 0 : _16.hover) === null || _17 === void 0 ? void 0 : _17.background))
                ? `
                > tbody > tr:nth-child(${stripedOrientation}) > * {
                  background: ${(_21 = (_20 = (_19 = (_18 = theme.$.palette[palette].table) === null || _18 === void 0 ? void 0 : _18.even) === null || _19 === void 0 ? void 0 : _19.hover) === null || _20 === void 0 ? void 0 : _20.background) !== null && _21 !== void 0 ? _21 : theme.$.palette[palette].dynamicer};
                  border-color: ${(_25 = (_24 = (_23 = (_22 = theme.$.palette[palette].table) === null || _22 === void 0 ? void 0 : _22.even) === null || _23 === void 0 ? void 0 : _23.hover) === null || _24 === void 0 ? void 0 : _24.border) !== null && _25 !== void 0 ? _25 : theme.$.palette[palette].dynamicest};
                  color: ${(_29 = (_28 = (_27 = (_26 = theme.$.palette[palette].table) === null || _26 === void 0 ? void 0 : _26.even) === null || _27 === void 0 ? void 0 : _27.hover) === null || _28 === void 0 ? void 0 : _28.font) !== null && _29 !== void 0 ? _29 : theme.$.palette[palette].font};
                }
              `
                : ''}
          }
        `
            : ''}
    `
        : `
      > * > tr > * {
        background: ${(_33 = (_32 = (_31 = (_30 = theme.$.palette[palette].table) === null || _30 === void 0 ? void 0 : _30.odd) === null || _31 === void 0 ? void 0 : _31.soft) === null || _32 === void 0 ? void 0 : _32.background) !== null && _33 !== void 0 ? _33 : theme.$.palette[palette].softBackground};
        border-color: ${(_37 = (_36 = (_35 = (_34 = theme.$.palette[palette].table) === null || _34 === void 0 ? void 0 : _34.odd) === null || _35 === void 0 ? void 0 : _35.soft) === null || _36 === void 0 ? void 0 : _36.border) !== null && _37 !== void 0 ? _37 : theme.$.palette[palette].softDynamicest};
        color: ${(_41 = (_40 = (_39 = (_38 = theme.$.palette[palette].table) === null || _38 === void 0 ? void 0 : _38.odd) === null || _39 === void 0 ? void 0 : _39.soft) === null || _40 === void 0 ? void 0 : _40.font) !== null && _41 !== void 0 ? _41 : theme.$.palette[palette].softFont};
      }

      ${hasHeadBackground
            ? `
          > thead > tr > * {
            background: ${(_44 = (_43 = (_42 = theme.$.palette[palette].table.even) === null || _42 === void 0 ? void 0 : _42.soft) === null || _43 === void 0 ? void 0 : _43.background) !== null && _44 !== void 0 ? _44 : theme.$.palette[palette].softDynamic};
            border-color: ${(_47 = (_46 = (_45 = theme.$.palette[palette].table.even) === null || _45 === void 0 ? void 0 : _45.soft) === null || _46 === void 0 ? void 0 : _46.border) !== null && _47 !== void 0 ? _47 : theme.$.palette[palette].softDynamicest};
            color: ${(_50 = (_49 = (_48 = theme.$.palette[palette].table.even) === null || _48 === void 0 ? void 0 : _48.soft) === null || _49 === void 0 ? void 0 : _49.font) !== null && _50 !== void 0 ? _50 : theme.$.palette[palette].softFont};
          }
        `
            : ''}

      ${isStriped
            ? `
          > tbody > tr:nth-child(${stripedOrientation}) > * {
            background: ${(_54 = (_53 = (_52 = (_51 = theme.$.palette[palette].table) === null || _51 === void 0 ? void 0 : _51.even) === null || _52 === void 0 ? void 0 : _52.soft) === null || _53 === void 0 ? void 0 : _53.background) !== null && _54 !== void 0 ? _54 : theme.$.palette[palette].softDynamic};
            border-color: ${(_58 = (_57 = (_56 = (_55 = theme.$.palette[palette].table) === null || _55 === void 0 ? void 0 : _55.even) === null || _56 === void 0 ? void 0 : _56.soft) === null || _57 === void 0 ? void 0 : _57.border) !== null && _58 !== void 0 ? _58 : theme.$.palette[palette].softDynamicest};
            color: ${(_62 = (_61 = (_60 = (_59 = theme.$.palette[palette].table) === null || _59 === void 0 ? void 0 : _59.even) === null || _60 === void 0 ? void 0 : _60.soft) === null || _61 === void 0 ? void 0 : _61.font) !== null && _62 !== void 0 ? _62 : theme.$.palette[palette].softFont};
          }
        `
            : ''}

      ${hasHover
            ? `
          > tbody > tr {
            > * {
              transition: background 150ms 0s ease-in-out;
            }

            &:hover > * {
              background: ${(_67 = (_66 = (_65 = (_64 = (_63 = theme.$.palette[palette].table) === null || _63 === void 0 ? void 0 : _63.odd) === null || _64 === void 0 ? void 0 : _64.soft) === null || _65 === void 0 ? void 0 : _65.hover) === null || _66 === void 0 ? void 0 : _66.background) !== null && _67 !== void 0 ? _67 : theme.$.palette[palette].softDynamicer};
              border-color: ${(_72 = (_71 = (_70 = (_69 = (_68 = theme.$.palette[palette].table) === null || _68 === void 0 ? void 0 : _68.odd) === null || _69 === void 0 ? void 0 : _69.soft) === null || _70 === void 0 ? void 0 : _70.hover) === null || _71 === void 0 ? void 0 : _71.border) !== null && _72 !== void 0 ? _72 : theme.$.palette[palette].softDynamicest};
              color: ${(_77 = (_76 = (_75 = (_74 = (_73 = theme.$.palette[palette].table) === null || _73 === void 0 ? void 0 : _73.odd) === null || _74 === void 0 ? void 0 : _74.soft) === null || _75 === void 0 ? void 0 : _75.hover) === null || _76 === void 0 ? void 0 : _76.font) !== null && _77 !== void 0 ? _77 : theme.$.palette[palette].softFont};
            }

            ${(isStriped && ((_80 = (_79 = (_78 = theme.$.palette[palette].table) === null || _78 === void 0 ? void 0 : _78.even) === null || _79 === void 0 ? void 0 : _79.hover) === null || _80 === void 0 ? void 0 : _80.background))
                ? `
                > tbody > tr:nth-child(${stripedOrientation}) > * {
                  background: ${(_85 = (_84 = (_83 = (_82 = (_81 = theme.$.palette[palette].table) === null || _81 === void 0 ? void 0 : _81.even) === null || _82 === void 0 ? void 0 : _82.soft) === null || _83 === void 0 ? void 0 : _83.hover) === null || _84 === void 0 ? void 0 : _84.background) !== null && _85 !== void 0 ? _85 : theme.$.palette[palette].softDynamicer};
                  border-color: ${(_90 = (_89 = (_88 = (_87 = (_86 = theme.$.palette[palette].table) === null || _86 === void 0 ? void 0 : _86.even) === null || _87 === void 0 ? void 0 : _87.soft) === null || _88 === void 0 ? void 0 : _88.hover) === null || _89 === void 0 ? void 0 : _89.border) !== null && _90 !== void 0 ? _90 : theme.$.palette[palette].softDynamicest};
                  color: ${(_95 = (_94 = (_93 = (_92 = (_91 = theme.$.palette[palette].table) === null || _91 === void 0 ? void 0 : _91.even) === null || _92 === void 0 ? void 0 : _92.hover) === null || _93 === void 0 ? void 0 : _93.soft) === null || _94 === void 0 ? void 0 : _94.font) !== null && _95 !== void 0 ? _95 : theme.$.palette[palette].softFont};
                }
              `
                : ''}
          }
        `
            : ''}
    `}
`;
});