import React from 'react';
import { FlexList } from '../FlexList/FlexList';
import { Typography } from './Typography';
export var ColorTable = function ColorTable() {
  return /*#__PURE__*/React.createElement(FlexList, null, /*#__PURE__*/React.createElement(FlexList, {
    direction: "column"
  }, /*#__PURE__*/React.createElement(Typography, {
    color: "black"
  }, "black"), /*#__PURE__*/React.createElement(Typography, {
    color: "white"
  }, /*#__PURE__*/React.createElement("span", {
    style: {
      background: 'black'
    }
  }, "white"))), /*#__PURE__*/React.createElement(FlexList, {
    direction: "column"
  }, /*#__PURE__*/React.createElement(Typography, {
    color: "orange10"
  }, "orange-10"), /*#__PURE__*/React.createElement(Typography, {
    color: "orange15"
  }, "orange-15"), /*#__PURE__*/React.createElement(Typography, {
    color: "orange20"
  }, "orange-20"), /*#__PURE__*/React.createElement(Typography, {
    color: "orange30"
  }, "orange-30"), /*#__PURE__*/React.createElement(Typography, {
    color: "orange40"
  }, "orange-40"), /*#__PURE__*/React.createElement(Typography, {
    color: "orange45"
  }, "orange-45"), /*#__PURE__*/React.createElement(Typography, {
    color: "orange50"
  }, "orange-50"), /*#__PURE__*/React.createElement(Typography, {
    color: "orange60"
  }, "orange-60"), /*#__PURE__*/React.createElement(Typography, {
    color: "orange70"
  }, "orange-70"), /*#__PURE__*/React.createElement(Typography, {
    color: "orange85"
  }, "orange-85"), /*#__PURE__*/React.createElement(Typography, {
    color: "orange90"
  }, "orange-90"), /*#__PURE__*/React.createElement(Typography, {
    color: "orange94"
  }, "orange-94"), /*#__PURE__*/React.createElement(Typography, {
    color: "orange96"
  }, "orange-96"), /*#__PURE__*/React.createElement(Typography, {
    color: "orange98"
  }, "orange-98")), /*#__PURE__*/React.createElement(FlexList, {
    direction: "column"
  }, /*#__PURE__*/React.createElement(Typography, {
    color: "blue10"
  }, "blue-10"), /*#__PURE__*/React.createElement(Typography, {
    color: "blue15"
  }, "blue-15"), /*#__PURE__*/React.createElement(Typography, {
    color: "blue20"
  }, "blue-20"), /*#__PURE__*/React.createElement(Typography, {
    color: "blue30"
  }, "blue-30"), /*#__PURE__*/React.createElement(Typography, {
    color: "blue40"
  }, "blue-40"), /*#__PURE__*/React.createElement(Typography, {
    color: "blue45"
  }, "blue-45"), /*#__PURE__*/React.createElement(Typography, {
    color: "blue50"
  }, "blue-50"), /*#__PURE__*/React.createElement(Typography, {
    color: "blue60"
  }, "blue-60"), /*#__PURE__*/React.createElement(Typography, {
    color: "blue70"
  }, "blue-70"), /*#__PURE__*/React.createElement(Typography, {
    color: "blue85"
  }, "blue-85"), /*#__PURE__*/React.createElement(Typography, {
    color: "blue90"
  }, "blue-90"), /*#__PURE__*/React.createElement(Typography, {
    color: "blue94"
  }, "blue-94"), /*#__PURE__*/React.createElement(Typography, {
    color: "blue96"
  }, "blue-96"), /*#__PURE__*/React.createElement(Typography, {
    color: "blue98"
  }, "blue-98")), /*#__PURE__*/React.createElement(FlexList, {
    direction: "column"
  }, /*#__PURE__*/React.createElement(Typography, {
    color: "red10"
  }, "red-10"), /*#__PURE__*/React.createElement(Typography, {
    color: "red15"
  }, "red-15"), /*#__PURE__*/React.createElement(Typography, {
    color: "red20"
  }, "red-20"), /*#__PURE__*/React.createElement(Typography, {
    color: "red30"
  }, "red-30"), /*#__PURE__*/React.createElement(Typography, {
    color: "red40"
  }, "red-40"), /*#__PURE__*/React.createElement(Typography, {
    color: "red45"
  }, "red-45"), /*#__PURE__*/React.createElement(Typography, {
    color: "red50"
  }, "red-50"), /*#__PURE__*/React.createElement(Typography, {
    color: "red60"
  }, "red-60"), /*#__PURE__*/React.createElement(Typography, {
    color: "red70"
  }, "red-70"), /*#__PURE__*/React.createElement(Typography, {
    color: "red85"
  }, "red-85"), /*#__PURE__*/React.createElement(Typography, {
    color: "red90"
  }, "red-90"), /*#__PURE__*/React.createElement(Typography, {
    color: "red94"
  }, "red-94"), /*#__PURE__*/React.createElement(Typography, {
    color: "red96"
  }, "red-96"), /*#__PURE__*/React.createElement(Typography, {
    color: "red98"
  }, "red-98")), /*#__PURE__*/React.createElement(FlexList, {
    direction: "column"
  }, /*#__PURE__*/React.createElement(Typography, {
    color: "yellow10"
  }, "yellow-10"), /*#__PURE__*/React.createElement(Typography, {
    color: "yellow15"
  }, "yellow-15"), /*#__PURE__*/React.createElement(Typography, {
    color: "yellow20"
  }, "yellow-20"), /*#__PURE__*/React.createElement(Typography, {
    color: "yellow30"
  }, "yellow-30"), /*#__PURE__*/React.createElement(Typography, {
    color: "yellow40"
  }, "yellow-40"), /*#__PURE__*/React.createElement(Typography, {
    color: "yellow45"
  }, "yellow-45"), /*#__PURE__*/React.createElement(Typography, {
    color: "yellow50"
  }, "yellow-50"), /*#__PURE__*/React.createElement(Typography, {
    color: "yellow60"
  }, "yellow-60"), /*#__PURE__*/React.createElement(Typography, {
    color: "yellow70"
  }, "yellow-70"), /*#__PURE__*/React.createElement(Typography, {
    color: "yellow85"
  }, "yellow-85"), /*#__PURE__*/React.createElement(Typography, {
    color: "yellow90"
  }, "yellow-90"), /*#__PURE__*/React.createElement(Typography, {
    color: "yellow94"
  }, "yellow-94"), /*#__PURE__*/React.createElement(Typography, {
    color: "yellow96"
  }, "yellow-96"), /*#__PURE__*/React.createElement(Typography, {
    color: "yellow98"
  }, "yellow-98")), /*#__PURE__*/React.createElement(FlexList, {
    direction: "column"
  }, /*#__PURE__*/React.createElement(Typography, {
    color: "green10"
  }, "green-10"), /*#__PURE__*/React.createElement(Typography, {
    color: "green15"
  }, "green-15"), /*#__PURE__*/React.createElement(Typography, {
    color: "green20"
  }, "green-20"), /*#__PURE__*/React.createElement(Typography, {
    color: "green30"
  }, "green-30"), /*#__PURE__*/React.createElement(Typography, {
    color: "green40"
  }, "green-40"), /*#__PURE__*/React.createElement(Typography, {
    color: "green45"
  }, "green-45"), /*#__PURE__*/React.createElement(Typography, {
    color: "green50"
  }, "green-50"), /*#__PURE__*/React.createElement(Typography, {
    color: "green60"
  }, "green-60"), /*#__PURE__*/React.createElement(Typography, {
    color: "green70"
  }, "green-70"), /*#__PURE__*/React.createElement(Typography, {
    color: "green85"
  }, "green-85"), /*#__PURE__*/React.createElement(Typography, {
    color: "green90"
  }, "green-90"), /*#__PURE__*/React.createElement(Typography, {
    color: "green94"
  }, "green-94"), /*#__PURE__*/React.createElement(Typography, {
    color: "green96"
  }, "green-96"), /*#__PURE__*/React.createElement(Typography, {
    color: "green98"
  }, "green-98")), /*#__PURE__*/React.createElement(FlexList, {
    direction: "column"
  }, /*#__PURE__*/React.createElement(Typography, {
    color: "purple10"
  }, "purple-10"), /*#__PURE__*/React.createElement(Typography, {
    color: "purple15"
  }, "purple-15"), /*#__PURE__*/React.createElement(Typography, {
    color: "purple20"
  }, "purple-20"), /*#__PURE__*/React.createElement(Typography, {
    color: "purple30"
  }, "purple-30"), /*#__PURE__*/React.createElement(Typography, {
    color: "purple40"
  }, "purple-40"), /*#__PURE__*/React.createElement(Typography, {
    color: "purple45"
  }, "purple-45"), /*#__PURE__*/React.createElement(Typography, {
    color: "purple50"
  }, "purple-50"), /*#__PURE__*/React.createElement(Typography, {
    color: "purple60"
  }, "purple-60"), /*#__PURE__*/React.createElement(Typography, {
    color: "purple70"
  }, "purple-70"), /*#__PURE__*/React.createElement(Typography, {
    color: "purple85"
  }, "purple-85"), /*#__PURE__*/React.createElement(Typography, {
    color: "purple90"
  }, "purple-90"), /*#__PURE__*/React.createElement(Typography, {
    color: "purple94"
  }, "purple-94"), /*#__PURE__*/React.createElement(Typography, {
    color: "purple96"
  }, "purple-96"), /*#__PURE__*/React.createElement(Typography, {
    color: "purple98"
  }, "purple-98")), /*#__PURE__*/React.createElement(FlexList, {
    direction: "column"
  }, /*#__PURE__*/React.createElement(Typography, {
    color: "gray10"
  }, "gray-10"), /*#__PURE__*/React.createElement(Typography, {
    color: "gray15"
  }, "gray-15"), /*#__PURE__*/React.createElement(Typography, {
    color: "gray20"
  }, "gray-20"), /*#__PURE__*/React.createElement(Typography, {
    color: "gray30"
  }, "gray-30"), /*#__PURE__*/React.createElement(Typography, {
    color: "gray40"
  }, "gray-40"), /*#__PURE__*/React.createElement(Typography, {
    color: "gray45"
  }, "gray-45"), /*#__PURE__*/React.createElement(Typography, {
    color: "gray50"
  }, "gray-50"), /*#__PURE__*/React.createElement(Typography, {
    color: "gray60"
  }, "gray-60"), /*#__PURE__*/React.createElement(Typography, {
    color: "gray70"
  }, "gray-70"), /*#__PURE__*/React.createElement(Typography, {
    color: "gray85"
  }, "gray-85"), /*#__PURE__*/React.createElement(Typography, {
    color: "gray90"
  }, "gray-90"), /*#__PURE__*/React.createElement(Typography, {
    color: "gray94"
  }, "gray-94"), /*#__PURE__*/React.createElement(Typography, {
    color: "gray96"
  }, "gray-96"), /*#__PURE__*/React.createElement(Typography, {
    color: "gray98"
  }, "gray-98")), /*#__PURE__*/React.createElement(FlexList, {
    direction: "column"
  }, /*#__PURE__*/React.createElement(Typography, {
    color: "cyan10"
  }, "cyan-10"), /*#__PURE__*/React.createElement(Typography, {
    color: "cyan15"
  }, "cyan-15"), /*#__PURE__*/React.createElement(Typography, {
    color: "cyan20"
  }, "cyan-20"), /*#__PURE__*/React.createElement(Typography, {
    color: "cyan30"
  }, "cyan-30"), /*#__PURE__*/React.createElement(Typography, {
    color: "cyan40"
  }, "cyan-40"), /*#__PURE__*/React.createElement(Typography, {
    color: "cyan45"
  }, "cyan-45"), /*#__PURE__*/React.createElement(Typography, {
    color: "cyan50"
  }, "cyan-50"), /*#__PURE__*/React.createElement(Typography, {
    color: "cyan60"
  }, "cyan-60"), /*#__PURE__*/React.createElement(Typography, {
    color: "cyan70"
  }, "cyan-70"), /*#__PURE__*/React.createElement(Typography, {
    color: "cyan85"
  }, "cyan-85"), /*#__PURE__*/React.createElement(Typography, {
    color: "cyan90"
  }, "cyan-90"), /*#__PURE__*/React.createElement(Typography, {
    color: "cyan94"
  }, "cyan-94"), /*#__PURE__*/React.createElement(Typography, {
    color: "cyan96"
  }, "cyan-96"), /*#__PURE__*/React.createElement(Typography, {
    color: "cyan98"
  }, "cyan-98")), /*#__PURE__*/React.createElement(FlexList, {
    direction: "column"
  }, /*#__PURE__*/React.createElement(Typography, {
    color: "magenta10"
  }, "magenta-10"), /*#__PURE__*/React.createElement(Typography, {
    color: "magenta15"
  }, "magenta-15"), /*#__PURE__*/React.createElement(Typography, {
    color: "magenta20"
  }, "magenta-20"), /*#__PURE__*/React.createElement(Typography, {
    color: "magenta30"
  }, "magenta-30"), /*#__PURE__*/React.createElement(Typography, {
    color: "magenta40"
  }, "magenta-40"), /*#__PURE__*/React.createElement(Typography, {
    color: "magenta45"
  }, "magenta-45"), /*#__PURE__*/React.createElement(Typography, {
    color: "magenta50"
  }, "magenta-50"), /*#__PURE__*/React.createElement(Typography, {
    color: "magenta60"
  }, "magenta-60"), /*#__PURE__*/React.createElement(Typography, {
    color: "magenta70"
  }, "magenta-70"), /*#__PURE__*/React.createElement(Typography, {
    color: "magenta85"
  }, "magenta-85"), /*#__PURE__*/React.createElement(Typography, {
    color: "magenta90"
  }, "magenta-90"), /*#__PURE__*/React.createElement(Typography, {
    color: "magenta94"
  }, "magenta-94"), /*#__PURE__*/React.createElement(Typography, {
    color: "magenta96"
  }, "magenta-96"), /*#__PURE__*/React.createElement(Typography, {
    color: "magenta98"
  }, "magenta-98")));
};
//# sourceMappingURL=Typography.colors.story.js.map