@playbooks/ui/dist/index.es-7ZX4yv7W.js

An interface library for Playbooks.

import { jsx } from "react/jsx-runtime";
const isArray = (data) => {
  return Array.isArray(data);
};
const isObject = (data) => {
  return data !== null && data && typeof data === "object";
};
const isEmpty = (data) => {
  if (data === null || data === void 0 || data === "undefined") {
    return true;
  }
  if (isArray(data)) {
    return data.length === 0 ? true : false;
  }
  if (isObject(data)) {
    return Object.keys(data).length === 0 ? true : false;
  }
  return data.length === 0 ? true : false;
};
const tailwindContainer = {
  center: "",
  gutters: ""
};
const tailwindGrid = {
  cols: "",
  rows: "",
  flow: "",
  gap: ""
};
const tailwindCols = {
  sm: "",
  md: "",
  lg: "",
  xl: "",
  xxl: "",
  span: "",
  order: ""
};
const tailwindProps = {
  active: "",
  align: "",
  animation: "",
  aspect: "",
  bgClip: "",
  bgColor: "",
  bgImage: "",
  bgPosition: "",
  bgSize: "",
  border: "",
  borderColor: "",
  borderRadius: "",
  borderStyle: "",
  color: "",
  cursor: "",
  display: "",
  divide: "",
  divideColor: "",
  duration: "",
  fade: "",
  focus: "",
  fontFamily: "",
  fontSize: "",
  fontStyle: "",
  fontWeight: "",
  fontVariant: "",
  flex: "",
  grid: "",
  gridFlow: "",
  group: "",
  height: "",
  hover: "",
  inset: "",
  leading: "",
  lineClamp: "",
  listImg: "",
  listPosition: "",
  listStyle: "",
  location: "",
  margin: "",
  maxHeight: "",
  minHeight: "",
  opacity: "",
  origin: "",
  outline: "",
  outlineColor: "",
  outlineOffset: "",
  overflow: "",
  padding: "",
  placeholderColor: "",
  pointerEvents: "",
  position: "",
  ring: "",
  ringColor: "",
  ringOffset: "",
  ringOffsetColor: "",
  rotate: "",
  scale: "",
  shadow: "",
  shadowColor: "",
  size: "",
  space: "",
  spacing: "",
  stroke: "",
  textDecoration: "",
  textTransform: "",
  tracking: "",
  transform: "",
  transition: "",
  translate: "",
  weight: "",
  whiteSpace: "",
  width: "",
  zIndex: "",
  ...tailwindContainer,
  ...tailwindGrid,
  ...tailwindCols
};
const computeTailwind = (props) => {
  let classes = "";
  Object.keys(props).filter((key, i, s) => s.indexOf(key) === i).map((key) => {
    const data = props[key];
    if (isArray(data)) return;
    if (isObject(data)) return;
    if (isEmpty(data)) return;
    if (typeof data === "function") return;
    classes = classes.concat(data + " ");
  });
  return classes;
};
const computeProps = (props) => {
  const computed = {};
  Object.keys(props).filter((key, i, s) => s.indexOf(key) === i).filter((key) => !Object.keys(tailwindProps).includes(key)).map((key) => {
    const data = props[key];
    return computed[key] = data;
  });
  return computed;
};
const A = ({ name = "A", tailwind, className, ...props }) => {
  const base = {};
  const classes = computeTailwind({ ...base, ...tailwind, className });
  return /* @__PURE__ */ jsx("a", { "data-name": name, className: classes, ...props });
};
const Article = ({ name = "Article", tailwind, className, ...props }) => {
  const base = {};
  const classes = computeTailwind({ ...base, ...tailwind, className });
  return /* @__PURE__ */ jsx("article", { "data-name": name, className: classes, ...props });
};
const Aside = ({ name = "Aside", tailwind, className, ...props }) => {
  const base = {};
  const classes = computeTailwind({ ...base, ...tailwind, className });
  return /* @__PURE__ */ jsx("aside", { "data-name": name, className: classes, ...props });
};
const Blockquote = ({ name = "Blockquote", tailwind, className, ...props }) => {
  const base = {};
  const classes = computeTailwind({ ...base, ...tailwind, className });
  return /* @__PURE__ */ jsx("blockquote", { "data-name": name, className: classes, ...props });
};
const Body = ({ name = "Body", tailwind, className, ...props }) => {
  const base = {};
  const classes = computeTailwind({ ...base, ...tailwind, className });
  return /* @__PURE__ */ jsx("body", { "data-name": name, className: classes, ...props });
};
const Button = ({ name = "Button", tailwind, className, ...props }) => {
  const base = {};
  const classes = computeTailwind({ ...base, ...tailwind, className });
  return /* @__PURE__ */ jsx("button", { "data-name": name, className: classes, ...props });
};
const Caption = ({ name = "Caption", tailwind, className, ...props }) => {
  const base = {};
  const classes = computeTailwind({ ...base, ...tailwind, className });
  return /* @__PURE__ */ jsx("caption", { "data-name": name, className: classes, ...props });
};
const Code = ({ name = "Code", tailwind, className, ...props }) => {
  const base = {};
  const classes = computeTailwind({ ...base, ...tailwind, className });
  return /* @__PURE__ */ jsx("code", { "data-name": name, className: classes, ...props });
};
const Div = ({ name = "Div", tailwind, className, ...props }) => {
  const base = {};
  const classes = computeTailwind({ ...base, ...tailwind, className });
  return /* @__PURE__ */ jsx("div", { "data-name": name, className: classes, ...props });
};
const Form = ({ name = "Form", tailwind, className, ...props }) => {
  const base = {};
  const classes = computeTailwind({ ...base, ...tailwind, className });
  return /* @__PURE__ */ jsx("form", { "data-name": name, className: classes, ...props });
};
const Figure = ({ name = "Figure", tailwind, className, ...props }) => {
  const base = {};
  const classes = computeTailwind({ ...base, ...tailwind, className });
  return /* @__PURE__ */ jsx("figure", { "data-name": name, className: classes, ...props });
};
const Footer = ({ name = "Footer", tailwind, className, ...props }) => {
  const base = {};
  const classes = computeTailwind({ ...base, ...tailwind, className });
  return /* @__PURE__ */ jsx("footer", { "data-name": name, className: classes, ...props });
};
const H1 = ({ name = "H1", tailwind, className, ...props }) => {
  const base = {};
  const classes = computeTailwind({ ...base, ...tailwind, className });
  return /* @__PURE__ */ jsx("h1", { "data-name": name, className: classes, ...props });
};
const H2 = ({ name = "H2", tailwind, className, ...props }) => {
  const base = {};
  const classes = computeTailwind({ ...base, ...tailwind, className });
  return /* @__PURE__ */ jsx("h2", { "data-name": name, className: classes, ...props });
};
const H3 = ({ name = "H3", tailwind, className, ...props }) => {
  const base = {};
  const classes = computeTailwind({ ...base, ...tailwind, className });
  return /* @__PURE__ */ jsx("h3", { "data-name": name, className: classes, ...props });
};
const H4 = ({ name = "H4", tailwind, className, ...props }) => {
  const base = {};
  const classes = computeTailwind({ ...base, ...tailwind, className });
  return /* @__PURE__ */ jsx("h4", { "data-name": name, className: classes, ...props });
};
const H5 = ({ name = "H5", tailwind, className, ...props }) => {
  const base = {};
  const classes = computeTailwind({ ...base, ...tailwind, className });
  return /* @__PURE__ */ jsx("h5", { "data-name": name, className: classes, ...props });
};
const H6 = ({ name = "H6", tailwind, className, ...props }) => {
  const base = {};
  const classes = computeTailwind({ ...base, ...tailwind, className });
  return /* @__PURE__ */ jsx("h6", { "data-name": name, className: classes, ...props });
};
const Header = ({ name = "Header", tailwind, className, ...props }) => {
  const base = {};
  const classes = computeTailwind({ ...base, ...tailwind, className });
  return /* @__PURE__ */ jsx("header", { "data-name": name, className: classes, ...props });
};
const Hr = ({ name = "Hr", tailwind, className, ...props }) => {
  const base = {};
  const classes = computeTailwind({ ...base, ...tailwind, className });
  return /* @__PURE__ */ jsx("hr", { "data-name": name, className: classes, ...props });
};
const Html = ({ name = "HTML", tailwind, className, ...props }) => {
  const base = {};
  const classes = computeTailwind({ ...base, ...tailwind, className });
  return /* @__PURE__ */ jsx("html", { "data-name": name, className: classes, ...props });
};
const Iframe = ({ name = "Iframe", tailwind, className, ...props }) => {
  const base = {};
  const classes = computeTailwind({ ...base, ...tailwind, className });
  return /* @__PURE__ */ jsx("iframe", { "data-name": name, className: classes, ...props });
};
const Img = ({ name = "Img", tailwind, className, ...props }) => {
  const base = {};
  const classes = computeTailwind({ ...base, ...tailwind, className });
  return /* @__PURE__ */ jsx("img", { "data-name": name, className: classes, ...props });
};
const Input = ({ name = "Input", tailwind, className, ...props }) => {
  const base = {};
  const classes = computeTailwind({ ...base, ...tailwind, className });
  return /* @__PURE__ */ jsx("input", { "data-name": name, className: classes, ...props });
};
const Kbd = ({ name = "Kbd", tailwind, className, ...props }) => {
  const base = {};
  const classes = computeTailwind({ ...base, ...tailwind, className });
  return /* @__PURE__ */ jsx("kbd", { "data-name": name, className: classes, ...props });
};
const Label = ({ name = "Label", tailwind, className, ...props }) => {
  const base = {};
  const classes = computeTailwind({ ...base, ...tailwind, className });
  return /* @__PURE__ */ jsx("label", { "data-name": name, className: classes, ...props });
};
const Li = ({ name = "Li", tailwind, className, ...props }) => {
  const base = {};
  const classes = computeTailwind({ ...base, ...tailwind, className });
  return /* @__PURE__ */ jsx("li", { "data-name": name, className: classes, ...props });
};
const Main = ({ name = "Main", tailwind, className, ...props }) => {
  const base = {};
  const classes = computeTailwind({ ...base, ...tailwind, className });
  return /* @__PURE__ */ jsx("main", { "data-name": name, className: classes, ...props });
};
const Nav = ({ name = "Nav", tailwind, className, ...props }) => {
  const base = {};
  const classes = computeTailwind({ ...base, ...tailwind, className });
  return /* @__PURE__ */ jsx("nav", { "data-name": name, className: classes, ...props });
};
const Option = ({ name = "Option", tailwind, className, ...props }) => {
  const base = {};
  const classes = computeTailwind({ ...base, ...tailwind, className });
  return /* @__PURE__ */ jsx("option", { "data-name": name, className: classes, ...props });
};
const P = ({ name = "P", tailwind, className, ...props }) => {
  const base = {};
  const classes = computeTailwind({ ...base, ...tailwind, className });
  return /* @__PURE__ */ jsx("p", { "data-name": name, className: classes, ...props });
};
const Pre = ({ name = "Pre", tailwind, className, ...props }) => {
  const base = {};
  const classes = computeTailwind({ ...base, ...tailwind, className });
  return /* @__PURE__ */ jsx("pre", { "data-name": name, className: classes, ...props });
};
const Section = ({ name = "Section", tailwind, className, ...props }) => {
  const base = {};
  const classes = computeTailwind({ ...base, ...tailwind, className });
  return /* @__PURE__ */ jsx("section", { "data-name": name, className: classes, ...props });
};
const Select = ({ name = "Select", tailwind, className, ...props }) => {
  const base = {};
  const classes = computeTailwind({ ...base, ...tailwind, className });
  return /* @__PURE__ */ jsx("select", { "data-name": name, className: classes, ...props });
};
const Small = ({ name = "Small", tailwind, className, ...props }) => {
  const base = {};
  const classes = computeTailwind({ ...base, ...tailwind, className });
  return /* @__PURE__ */ jsx("small", { "data-name": name, className: classes, ...props });
};
const Span = ({ name = "Span", tailwind, className, ...props }) => {
  const base = {};
  const classes = computeTailwind({ ...base, ...tailwind, className });
  return /* @__PURE__ */ jsx("span", { "data-name": name, className: classes, ...props });
};
const Ul = ({ name = "Ul", tailwind, className, ...props }) => {
  const base = {};
  const classes = computeTailwind({ ...base, ...tailwind, className });
  return /* @__PURE__ */ jsx("ul", { "data-name": name, className: classes, ...props });
};
const Table = ({ name = "Table", tailwind, className, ...props }) => {
  const base = {};
  const classes = computeTailwind({ ...base, ...tailwind, className });
  return /* @__PURE__ */ jsx("table", { "data-name": name, className: classes, ...props });
};
const TBody = ({ name = "TBody", tailwind, className, ...props }) => {
  const base = {};
  const classes = computeTailwind({ ...base, ...tailwind, className });
  return /* @__PURE__ */ jsx("tbody", { "data-name": name, className: classes, ...props });
};
const TD = ({ name = "TD", tailwind, className, ...props }) => {
  const base = {};
  const classes = computeTailwind({ ...base, ...tailwind, className });
  return /* @__PURE__ */ jsx("td", { "data-name": name, className: classes, ...props });
};
const TextArea = ({ name = "TextArea", tailwind, className, ...props }) => {
  const base = {};
  const classes = computeTailwind({ ...base, ...tailwind, className });
  return /* @__PURE__ */ jsx("textarea", { "data-name": name, className: classes, ...props });
};
const TH = ({ name = "TH", tailwind, className, ...props }) => {
  const base = {};
  const classes = computeTailwind({ ...base, ...tailwind, className });
  return /* @__PURE__ */ jsx("th", { "data-name": name, className: classes, ...props });
};
const THead = ({ name = "THead", tailwind, className, ...props }) => {
  const base = {};
  const classes = computeTailwind({ ...base, ...tailwind, className });
  return /* @__PURE__ */ jsx("thead", { "data-name": name, className: classes, ...props });
};
const TR = ({ name = "TR", tailwind, className, ...props }) => {
  const base = {};
  const classes = computeTailwind({ ...base, ...tailwind, className });
  return /* @__PURE__ */ jsx("tr", { "data-name": name, className: classes, ...props });
};
export {
  Article as A,
  Button as B,
  Caption as C,
  Div as D,
  TD as E,
  Footer as F,
  Form as G,
  Header as H,
  Input as I,
  Select as J,
  Kbd as K,
  Label as L,
  Main as M,
  Nav as N,
  Option as O,
  P,
  TextArea as Q,
  Small as S,
  Table as T,
  Ul as U,
  computeProps as a,
  H1 as b,
  computeTailwind as c,
  H2 as d,
  H3 as e,
  H4 as f,
  H5 as g,
  H6 as h,
  Aside as i,
  Blockquote as j,
  Body as k,
  Code as l,
  Figure as m,
  Hr as n,
  Html as o,
  Iframe as p,
  Img as q,
  Li as r,
  Pre as s,
  Span as t,
  A as u,
  Section as v,
  THead as w,
  TR as x,
  TH as y,
  TBody as z
};