@traefik-labs/faency 12.0.7

package/dist/components/Table/Table.js

@@ -0,0 +1,290 @@
+import { jsxs, Fragment, jsx } from "react/jsx-runtime";
+import { ChevronRightIcon } from "@radix-ui/react-icons";
+import { forwardRef, useState, useMemo } from "react";
+import { styled } from "../../stitches.config.js";
+import { Label } from "../Label/Label.js";
+import { Flex } from "../Flex/Flex.js";
+import { Box } from "../Box/Box.js";
+import { Text } from "../Text/Text.js";
+import { elevationVariants } from "../Elevation/Elevation.js";
+const Caption = styled("caption", Text, {
+  display: "table-caption",
+  textAlign: "start",
+  fontVariantNumeric: "proportional-nums",
+  fontWeight: "$medium",
+  lineHeight: "1.25"
+});
+const Tbody = styled("tbody", {
+  width: "100%",
+  verticalAlign: "middle"
+});
+const Th = styled("th", Label, {
+  // override Label
+  display: "table-cell",
+  verticalAlign: "inherit",
+  borderTopLeftRadius: "inherit",
+  borderTopRightRadius: "inherit",
+  textAlign: "start",
+  p: "$2 $3",
+  borderBottom: "1px solid $tableRowBorder",
+  variants: {
+    align: {
+      start: {
+        textAlign: "start"
+      },
+      center: {
+        textAlign: "center"
+      },
+      end: {
+        textAlign: "end"
+      }
+    },
+    transform: {
+      capitalize: {
+        display: "table-cell"
+        // revert Label enforced value
+      }
+    }
+  },
+  defaultVariants: {
+    align: "start"
+  }
+});
+const Td = styled("td", {
+  boxSizing: "border-box",
+  p: "$5 $3",
+  borderBottom: "1px solid $tableRowBorder",
+  fontSize: "$3",
+  lineHeight: "16px",
+  verticalAlign: "inherit",
+  variants: {
+    subtle: {
+      true: {
+        fontWeight: "$regular",
+        color: "$tableSubtleText"
+      }
+    },
+    align: {
+      start: {
+        textAlign: "start"
+      },
+      center: {
+        textAlign: "center"
+      },
+      end: {
+        textAlign: "end"
+      }
+    }
+  },
+  defaultVariants: {
+    align: "start"
+  }
+});
+const StyledTr = styled("tr", {
+  verticalAlign: "inherit",
+  "&:hover": {
+    color: "$tableHoverText"
+  },
+  [`&:last-child > ${Td}`]: {
+    borderBottom: "none"
+  },
+  variants: {
+    interactive: {
+      true: {
+        "&:hover": {
+          backgroundColor: "$tableHoverBackground",
+          cursor: "pointer"
+        }
+      }
+    },
+    active: {
+      true: {
+        backgroundColor: "$tableHoverBackground",
+        color: "$tableActiveText",
+        fontWeight: "$semiBold"
+      }
+    }
+  },
+  compoundVariants: [
+    {
+      interactive: true,
+      active: true,
+      css: {
+        "&:hover": {
+          color: "$tableActiveHoverText"
+        }
+      }
+    }
+  ]
+});
+const AnimatedTr = ({
+  collapsedContentColSpan,
+  isOpen,
+  children
+}) => {
+  const appliedStyle = useMemo(
+    () => isOpen ? { transition: "padding 0.2s ease-out" } : {
+      transition: "padding 0.2s ease-out",
+      lineHeight: 0,
+      fontSize: 0,
+      padding: "0px 16px",
+      border: "none"
+    },
+    [isOpen]
+  );
+  const containerStyle = useMemo(
+    () => isOpen ? { transition: "all 0.2s ease-out" } : {
+      transition: "all 0.2s ease-out",
+      height: 0,
+      overflow: "hidden"
+    },
+    [isOpen]
+  );
+  return /* @__PURE__ */ jsx(Tr, { children: /* @__PURE__ */ jsx(Td, { colSpan: collapsedContentColSpan, css: appliedStyle, children: /* @__PURE__ */ jsx(Box, { css: containerStyle, children }) }) });
+};
+const Tr = forwardRef(
+  ({
+    children,
+    collapsedContent,
+    emptyFirstColumn = false,
+    tableHead = false,
+    collapsedContentColSpan = 1,
+    css,
+    ...props
+  }, ref) => {
+    const [isCollapsed, setIsCollapsed] = useState(false);
+    return /* @__PURE__ */ jsxs(Fragment, { children: [
+      /* @__PURE__ */ jsxs(
+        StyledTr,
+        {
+          ref,
+          css: !!collapsedContent && !isCollapsed ? {
+            ...css,
+            [`&:nth-last-child(2) > ${Td}`]: {
+              borderBottom: "none"
+            }
+          } : { ...css },
+          ...props,
+          children: [
+            emptyFirstColumn ? tableHead ? /* @__PURE__ */ jsx(Th, { css: { width: 24 } }) : /* @__PURE__ */ jsx(Td, {}) : null,
+            !!collapsedContent && /* @__PURE__ */ jsx(
+              Td,
+              {
+                css: { padding: "0 0 0 $3" },
+                onClick: (e) => {
+                  e.stopPropagation();
+                  e.preventDefault();
+                },
+                children: /* @__PURE__ */ jsx(
+                  Flex,
+                  {
+                    align: "center",
+                    justify: "center",
+                    css: {
+                      height: "40px",
+                      "&:hover": {
+                        color: "$tableActiveText"
+                      }
+                    },
+                    onClick: () => setIsCollapsed(!isCollapsed),
+                    children: /* @__PURE__ */ jsx(
+                      ChevronRightIcon,
+                      {
+                        style: {
+                          cursor: "pointer",
+                          transition: "transform 0.2s ease-out",
+                          transform: isCollapsed ? "rotate(90deg)" : "initial"
+                        }
+                      }
+                    )
+                  }
+                )
+              }
+            ),
+            children
+          ]
+        }
+      ),
+      !!collapsedContent && /* @__PURE__ */ jsx(AnimatedTr, { isOpen: isCollapsed, collapsedContentColSpan, children: collapsedContent })
+    ] });
+  }
+);
+const Tfoot = styled("tfoot", {
+  verticalAlign: "middle",
+  position: "relative",
+  borderRadius: "inherit",
+  "&::after": {
+    pointerEvents: "none",
+    content: '""',
+    position: "absolute",
+    inset: 0,
+    backgroundColor: "$tableFooterLayerBackground",
+    borderRadius: "inherit"
+  },
+  [`& ${Td}`]: {
+    fontSize: "$1",
+    color: "$tableHeaderText",
+    fontWeight: "$light",
+    p: "$2 $3"
+  }
+});
+const Thead = styled("thead", {
+  position: "relative",
+  borderTopLeftRadius: "inherit",
+  borderTopRightRadius: "inherit",
+  verticalAlign: "middle",
+  "&::after": {
+    pointerEvents: "none",
+    content: '""',
+    position: "absolute",
+    inset: 0,
+    backgroundColor: "$tableHeaderLayerBackground",
+    borderTopLeftRadius: "inherit",
+    borderTopRightRadius: "inherit"
+  },
+  [`& ${Th}`]: {
+    fontSize: "$1",
+    color: "$tableHeaderText",
+    fontWeight: "$light"
+  }
+});
+const Table = styled("table", {
+  width: "100%",
+  tableLayout: "fixed",
+  boxSizing: "border-box",
+  borderCollapse: "separate",
+  borderSpacing: 0,
+  fontFamily: "$rubik",
+  color: "$tableText",
+  borderRadius: "$3",
+  overflow: "hidden",
+  [`& ${Tbody}:not(:empty) ~ ${Tfoot}`]: {
+    borderTopLeftRadius: "0",
+    borderTopRightRadius: "0",
+    [`& ${Td}`]: {
+      borderTop: "1px solid $tableRowBorder"
+    }
+  },
+  [`& ${Thead}:not(:empty) ~ ${Tfoot}`]: {
+    borderTopLeftRadius: "0",
+    borderTopRightRadius: "0"
+  },
+  variants: {
+    elevation: elevationVariants
+  },
+  defaultVariants: {
+    elevation: 1
+  }
+});
+export {
+  Caption,
+  StyledTr,
+  Table,
+  Tbody,
+  Td,
+  Tfoot,
+  Th,
+  Thead,
+  Tr
+};
+//# sourceMappingURL=Table.js.map

package/dist/components/Table/Table.js.map

@@ -0,0 +1 @@
+{"version":3,"file":"Table.js","sources":["../../../components/Table/Table.tsx"],"sourcesContent":["import { ChevronRightIcon } from '@radix-ui/react-icons';\nimport React, { ComponentProps, ElementRef, forwardRef, ReactNode, useMemo, useState } from 'react';\n\nimport { styled, VariantProps } from '../../stitches.config';\nimport { Box } from '../Box';\nimport { elevationVariants } from '../Elevation';\nimport { Flex } from '../Flex';\nimport { Label } from '../Label';\nimport { Text } from '../Text';\n\nexport const Caption = styled('caption', Text, {\n  display: 'table-caption',\n  textAlign: 'start',\n  fontVariantNumeric: 'proportional-nums',\n  fontWeight: '$medium',\n  lineHeight: '1.25',\n});\n\nexport const Tbody = styled('tbody', {\n  width: '100%',\n  verticalAlign: 'middle',\n});\n\nexport const Th = styled('th', Label, {\n  // override Label\n  display: 'table-cell',\n  verticalAlign: 'inherit',\n\n  borderTopLeftRadius: 'inherit',\n  borderTopRightRadius: 'inherit',\n\n  textAlign: 'start',\n  p: '$2 $3',\n  borderBottom: '1px solid $tableRowBorder',\n\n  variants: {\n    align: {\n      start: {\n        textAlign: 'start',\n      },\n      center: {\n        textAlign: 'center',\n      },\n      end: {\n        textAlign: 'end',\n      },\n    },\n    transform: {\n      capitalize: {\n        display: 'table-cell', // revert Label enforced value\n      },\n    },\n  },\n  defaultVariants: {\n    align: 'start',\n  },\n});\n\nexport const Td = styled('td', {\n  boxSizing: 'border-box',\n  p: '$5 $3',\n  borderBottom: '1px solid $tableRowBorder',\n  fontSize: '$3',\n  lineHeight: '16px',\n  verticalAlign: 'inherit',\n  variants: {\n    subtle: {\n      true: {\n        fontWeight: '$regular',\n        color: '$tableSubtleText',\n      },\n    },\n    align: {\n      start: {\n        textAlign: 'start',\n      },\n      center: {\n        textAlign: 'center',\n      },\n      end: {\n        textAlign: 'end',\n      },\n    },\n  },\n  defaultVariants: {\n    align: 'start',\n  },\n});\n\nexport const StyledTr = styled('tr', {\n  verticalAlign: 'inherit',\n  '&:hover': {\n    color: '$tableHoverText',\n  },\n  [`&:last-child > ${Td}`]: {\n    borderBottom: 'none',\n  },\n\n  variants: {\n    interactive: {\n      true: {\n        '&:hover': {\n          backgroundColor: '$tableHoverBackground',\n          cursor: 'pointer',\n        },\n      },\n    },\n    active: {\n      true: {\n        backgroundColor: '$tableHoverBackground',\n        color: '$tableActiveText',\n        fontWeight: '$semiBold',\n      },\n    },\n  },\n  compoundVariants: [\n    {\n      interactive: true,\n      active: true,\n      css: {\n        '&:hover': {\n          color: '$tableActiveHoverText',\n        },\n      },\n    },\n  ],\n});\n\nconst AnimatedTr = ({\n  collapsedContentColSpan,\n  isOpen,\n  children,\n}: {\n  collapsedContentColSpan: number;\n  isOpen: boolean;\n  children: ReactNode;\n}) => {\n  const appliedStyle = useMemo(\n    () =>\n      isOpen\n        ? { transition: 'padding 0.2s ease-out' }\n        : {\n            transition: 'padding 0.2s ease-out',\n            lineHeight: 0,\n            fontSize: 0,\n            padding: '0px 16px',\n            border: 'none',\n          },\n    [isOpen],\n  );\n\n  const containerStyle = useMemo(\n    () =>\n      isOpen\n        ? { transition: 'all 0.2s ease-out' }\n        : {\n            transition: 'all 0.2s ease-out',\n            height: 0,\n            overflow: 'hidden',\n          },\n    [isOpen],\n  );\n\n  return (\n    <Tr>\n      <Td colSpan={collapsedContentColSpan} css={appliedStyle}>\n        <Box css={containerStyle}>{children}</Box>\n      </Td>\n    </Tr>\n  );\n};\nexport type TrProps = ComponentProps<typeof StyledTr> &\n  VariantProps<typeof StyledTr> & {\n    children: React.ReactNode;\n    collapsedContent?: React.ReactNode;\n    emptyFirstColumn?: boolean;\n    tableHead?: boolean;\n    collapsedContentColSpan?: number;\n  };\n\nexport const Tr = forwardRef<ElementRef<typeof StyledTr>, TrProps>(\n  (\n    {\n      children,\n      collapsedContent,\n      emptyFirstColumn = false,\n      tableHead = false,\n      collapsedContentColSpan = 1,\n      css,\n      ...props\n    },\n    ref,\n  ) => {\n    const [isCollapsed, setIsCollapsed] = useState(false);\n\n    return (\n      <>\n        <StyledTr\n          ref={ref}\n          css={\n            !!collapsedContent && !isCollapsed\n              ? {\n                  ...css,\n                  [`&:nth-last-child(2) > ${Td}`]: {\n                    borderBottom: 'none',\n                  },\n                }\n              : { ...css }\n          }\n          {...props}\n        >\n          {emptyFirstColumn ? tableHead ? <Th css={{ width: 24 }} /> : <Td /> : null}\n          {!!collapsedContent && (\n            <Td\n              css={{ padding: '0 0 0 $3' }}\n              onClick={(e) => {\n                e.stopPropagation();\n                e.preventDefault();\n              }}\n            >\n              <Flex\n                align=\"center\"\n                justify=\"center\"\n                css={{\n                  height: '40px',\n                  '&:hover': {\n                    color: '$tableActiveText',\n                  },\n                }}\n                onClick={() => setIsCollapsed(!isCollapsed)}\n              >\n                <ChevronRightIcon\n                  style={{\n                    cursor: 'pointer',\n                    transition: 'transform 0.2s ease-out',\n                    transform: isCollapsed ? 'rotate(90deg)' : 'initial',\n                  }}\n                />\n              </Flex>\n            </Td>\n          )}\n          {children}\n        </StyledTr>\n        {!!collapsedContent && (\n          <AnimatedTr isOpen={isCollapsed} collapsedContentColSpan={collapsedContentColSpan}>\n            {collapsedContent}\n          </AnimatedTr>\n        )}\n      </>\n    );\n  },\n);\n\nexport const Tfoot = styled('tfoot', {\n  verticalAlign: 'middle',\n  position: 'relative',\n  borderRadius: 'inherit',\n\n  '&::after': {\n    pointerEvents: 'none',\n    content: '\"\"',\n    position: 'absolute',\n    inset: 0,\n    backgroundColor: '$tableFooterLayerBackground',\n    borderRadius: 'inherit',\n  },\n\n  [`& ${Td}`]: {\n    fontSize: '$1',\n    color: '$tableHeaderText',\n    fontWeight: '$light',\n    p: '$2 $3',\n  },\n});\n\nexport const Thead = styled('thead', {\n  position: 'relative',\n  borderTopLeftRadius: 'inherit',\n  borderTopRightRadius: 'inherit',\n  verticalAlign: 'middle',\n\n  '&::after': {\n    pointerEvents: 'none',\n    content: '\"\"',\n    position: 'absolute',\n    inset: 0,\n    backgroundColor: '$tableHeaderLayerBackground',\n    borderTopLeftRadius: 'inherit',\n    borderTopRightRadius: 'inherit',\n  },\n\n  [`& ${Th}`]: {\n    fontSize: '$1',\n    color: '$tableHeaderText',\n    fontWeight: '$light',\n  },\n});\n\nexport const Table = styled('table', {\n  width: '100%',\n  tableLayout: 'fixed',\n  boxSizing: 'border-box',\n  borderCollapse: 'separate',\n  borderSpacing: 0,\n  fontFamily: '$rubik',\n  color: '$tableText',\n  borderRadius: '$3',\n  overflow: 'hidden',\n  [`& ${Tbody}:not(:empty) ~ ${Tfoot}`]: {\n    borderTopLeftRadius: '0',\n    borderTopRightRadius: '0',\n    [`& ${Td}`]: {\n      borderTop: '1px solid $tableRowBorder',\n    },\n  },\n  [`& ${Thead}:not(:empty) ~ ${Tfoot}`]: {\n    borderTopLeftRadius: '0',\n    borderTopRightRadius: '0',\n  },\n\n  variants: {\n    elevation: elevationVariants,\n  },\n  defaultVariants: {\n    elevation: 1,\n  },\n});\n\nexport type TableVariants = VariantProps<typeof Table>;\nexport type TableProps = TableVariants & NonNullable<unknown>;\n"],"names":[],"mappings":"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"}

package/dist/components/Table/Table.themes.cjs

@@ -0,0 +1,33 @@
+"use strict";
+Object.defineProperty(exports, Symbol.toStringTag, { value: "Module" });
+const tinycolor = require("tinycolor2");
+exports.Theme = void 0;
+((Theme2) => {
+  Theme2.getLight = (primaryColor) => ({
+    tableText: tinycolor("black").setAlpha(0.74).toHslString(),
+    tableSubtleText: tinycolor("black").setAlpha(0.51).toHslString(),
+    tableHeaderLayerBackground: tinycolor("black").setAlpha(0.03).toHslString(),
+    tableFooterLayerBackground: tinycolor("black").setAlpha(0.03).toHslString(),
+    tableHeaderText: tinycolor("black").setAlpha(0.51).toHslString(),
+    tableFooterText: tinycolor("black").setAlpha(0.51).toHslString(),
+    tableHoverBackground: tinycolor("black").setAlpha(0.04).toHslString(),
+    tableHoverText: tinycolor("black").setAlpha(0.74).toHslString(),
+    tableActiveText: primaryColor.value,
+    tableActiveHoverText: tinycolor(primaryColor.value).lighten(10).toHslString(),
+    tableRowBorder: "hsl(0, 0%, 87%)"
+  });
+  Theme2.getDark = (primaryColor) => ({
+    tableText: tinycolor("white").setAlpha(0.74).toHslString(),
+    tableSubtleText: tinycolor("white").setAlpha(0.51).toHslString(),
+    tableHeaderLayerBackground: tinycolor("white").setAlpha(0.02).toHslString(),
+    tableFooterLayerBackground: tinycolor("white").setAlpha(0.02).toHslString(),
+    tableHeaderText: tinycolor("white").setAlpha(0.51).toHslString(),
+    tableFooterText: tinycolor("white").setAlpha(0.51).toHslString(),
+    tableHoverBackground: tinycolor(primaryColor.value).setAlpha(0.04).toHslString(),
+    tableHoverText: tinycolor("white").setAlpha(0.74).toHslString(),
+    tableActiveText: "$primary",
+    tableActiveHoverText: tinycolor(primaryColor.value).lighten(10).toHslString(),
+    tableRowBorder: "hsl(209, 21%, 23%)"
+  });
+})(exports.Theme || (exports.Theme = {}));
+//# sourceMappingURL=Table.themes.cjs.map

package/dist/components/Table/Table.themes.cjs.map

@@ -0,0 +1 @@
+{"version":3,"file":"Table.themes.cjs","sources":["../../../components/Table/Table.themes.ts"],"sourcesContent":["import { Property } from '@stitches/react/types/css';\nimport tinycolor from 'tinycolor2';\n\nimport { ColorInfo } from '../../utils/getPrimaryColorInfo';\n\nexport namespace Theme {\n  type Colors = {\n    tableText: Property.Color;\n    tableSubtleText: Property.Color;\n    tableHoverBackground: Property.BackgroundColor;\n    tableActiveText: Property.Color;\n    tableActiveHoverText: Property.Color;\n    tableHeaderLayerBackground: Property.BackgroundColor;\n    tableFooterLayerBackground: Property.BackgroundColor;\n    tableHeaderText: Property.Color;\n    tableFooterText: Property.Color;\n    tableHoverText: Property.Color;\n    tableRowBorder: Property.BorderBottomColor;\n  };\n\n  type Factory = (primaryColor: ColorInfo) => Colors;\n\n  export const getLight: Factory = (primaryColor) => ({\n    tableText: tinycolor('black').setAlpha(0.74).toHslString(),\n    tableSubtleText: tinycolor('black').setAlpha(0.51).toHslString(),\n    tableHeaderLayerBackground: tinycolor('black').setAlpha(0.03).toHslString(),\n    tableFooterLayerBackground: tinycolor('black').setAlpha(0.03).toHslString(),\n    tableHeaderText: tinycolor('black').setAlpha(0.51).toHslString(),\n    tableFooterText: tinycolor('black').setAlpha(0.51).toHslString(),\n    tableHoverBackground: tinycolor('black').setAlpha(0.04).toHslString(),\n    tableHoverText: tinycolor('black').setAlpha(0.74).toHslString(),\n    tableActiveText: primaryColor.value,\n    tableActiveHoverText: tinycolor(primaryColor.value).lighten(10).toHslString(),\n    tableRowBorder: 'hsl(0, 0%, 87%)',\n  });\n\n  export const getDark: Factory = (primaryColor) => ({\n    tableText: tinycolor('white').setAlpha(0.74).toHslString(),\n    tableSubtleText: tinycolor('white').setAlpha(0.51).toHslString(),\n    tableHeaderLayerBackground: tinycolor('white').setAlpha(0.02).toHslString(),\n    tableFooterLayerBackground: tinycolor('white').setAlpha(0.02).toHslString(),\n    tableHeaderText: tinycolor('white').setAlpha(0.51).toHslString(),\n    tableFooterText: tinycolor('white').setAlpha(0.51).toHslString(),\n    tableHoverBackground: tinycolor(primaryColor.value).setAlpha(0.04).toHslString(),\n    tableHoverText: tinycolor('white').setAlpha(0.74).toHslString(),\n    tableActiveText: '$primary',\n    tableActiveHoverText: tinycolor(primaryColor.value).lighten(10).toHslString(),\n    tableRowBorder: 'hsl(209, 21%, 23%)',\n  });\n}\n"],"names":["Theme"],"mappings":";;;AAKiBA,QAAAA,QAAAA;AAAAA,CAAV,CAAUA,WAAV;AAiBQA,SAAA,WAAoB,CAAC,kBAAkB;AAAA,IAClD,WAAW,UAAU,OAAO,EAAE,SAAS,IAAI,EAAE,YAAA;AAAA,IAC7C,iBAAiB,UAAU,OAAO,EAAE,SAAS,IAAI,EAAE,YAAA;AAAA,IACnD,4BAA4B,UAAU,OAAO,EAAE,SAAS,IAAI,EAAE,YAAA;AAAA,IAC9D,4BAA4B,UAAU,OAAO,EAAE,SAAS,IAAI,EAAE,YAAA;AAAA,IAC9D,iBAAiB,UAAU,OAAO,EAAE,SAAS,IAAI,EAAE,YAAA;AAAA,IACnD,iBAAiB,UAAU,OAAO,EAAE,SAAS,IAAI,EAAE,YAAA;AAAA,IACnD,sBAAsB,UAAU,OAAO,EAAE,SAAS,IAAI,EAAE,YAAA;AAAA,IACxD,gBAAgB,UAAU,OAAO,EAAE,SAAS,IAAI,EAAE,YAAA;AAAA,IAClD,iBAAiB,aAAa;AAAA,IAC9B,sBAAsB,UAAU,aAAa,KAAK,EAAE,QAAQ,EAAE,EAAE,YAAA;AAAA,IAChE,gBAAgB;AAAA,EAAA;AAGLA,SAAA,UAAmB,CAAC,kBAAkB;AAAA,IACjD,WAAW,UAAU,OAAO,EAAE,SAAS,IAAI,EAAE,YAAA;AAAA,IAC7C,iBAAiB,UAAU,OAAO,EAAE,SAAS,IAAI,EAAE,YAAA;AAAA,IACnD,4BAA4B,UAAU,OAAO,EAAE,SAAS,IAAI,EAAE,YAAA;AAAA,IAC9D,4BAA4B,UAAU,OAAO,EAAE,SAAS,IAAI,EAAE,YAAA;AAAA,IAC9D,iBAAiB,UAAU,OAAO,EAAE,SAAS,IAAI,EAAE,YAAA;AAAA,IACnD,iBAAiB,UAAU,OAAO,EAAE,SAAS,IAAI,EAAE,YAAA;AAAA,IACnD,sBAAsB,UAAU,aAAa,KAAK,EAAE,SAAS,IAAI,EAAE,YAAA;AAAA,IACnE,gBAAgB,UAAU,OAAO,EAAE,SAAS,IAAI,EAAE,YAAA;AAAA,IAClD,iBAAiB;AAAA,IACjB,sBAAsB,UAAU,aAAa,KAAK,EAAE,QAAQ,EAAE,EAAE,YAAA;AAAA,IAChE,gBAAgB;AAAA,EAAA;AAClB,GA3CeA,QAAAA,UAAAA,gBAAA,CAAA,EAAA;"}

package/dist/components/Table/Table.themes.js

@@ -0,0 +1,34 @@
+import tinycolor from "tinycolor2";
+var Theme;
+((Theme2) => {
+  Theme2.getLight = (primaryColor) => ({
+    tableText: tinycolor("black").setAlpha(0.74).toHslString(),
+    tableSubtleText: tinycolor("black").setAlpha(0.51).toHslString(),
+    tableHeaderLayerBackground: tinycolor("black").setAlpha(0.03).toHslString(),
+    tableFooterLayerBackground: tinycolor("black").setAlpha(0.03).toHslString(),
+    tableHeaderText: tinycolor("black").setAlpha(0.51).toHslString(),
+    tableFooterText: tinycolor("black").setAlpha(0.51).toHslString(),
+    tableHoverBackground: tinycolor("black").setAlpha(0.04).toHslString(),
+    tableHoverText: tinycolor("black").setAlpha(0.74).toHslString(),
+    tableActiveText: primaryColor.value,
+    tableActiveHoverText: tinycolor(primaryColor.value).lighten(10).toHslString(),
+    tableRowBorder: "hsl(0, 0%, 87%)"
+  });
+  Theme2.getDark = (primaryColor) => ({
+    tableText: tinycolor("white").setAlpha(0.74).toHslString(),
+    tableSubtleText: tinycolor("white").setAlpha(0.51).toHslString(),
+    tableHeaderLayerBackground: tinycolor("white").setAlpha(0.02).toHslString(),
+    tableFooterLayerBackground: tinycolor("white").setAlpha(0.02).toHslString(),
+    tableHeaderText: tinycolor("white").setAlpha(0.51).toHslString(),
+    tableFooterText: tinycolor("white").setAlpha(0.51).toHslString(),
+    tableHoverBackground: tinycolor(primaryColor.value).setAlpha(0.04).toHslString(),
+    tableHoverText: tinycolor("white").setAlpha(0.74).toHslString(),
+    tableActiveText: "$primary",
+    tableActiveHoverText: tinycolor(primaryColor.value).lighten(10).toHslString(),
+    tableRowBorder: "hsl(209, 21%, 23%)"
+  });
+})(Theme || (Theme = {}));
+export {
+  Theme
+};
+//# sourceMappingURL=Table.themes.js.map

package/dist/components/Table/Table.themes.js.map

@@ -0,0 +1 @@
+{"version":3,"file":"Table.themes.js","sources":["../../../components/Table/Table.themes.ts"],"sourcesContent":["import { Property } from '@stitches/react/types/css';\nimport tinycolor from 'tinycolor2';\n\nimport { ColorInfo } from '../../utils/getPrimaryColorInfo';\n\nexport namespace Theme {\n  type Colors = {\n    tableText: Property.Color;\n    tableSubtleText: Property.Color;\n    tableHoverBackground: Property.BackgroundColor;\n    tableActiveText: Property.Color;\n    tableActiveHoverText: Property.Color;\n    tableHeaderLayerBackground: Property.BackgroundColor;\n    tableFooterLayerBackground: Property.BackgroundColor;\n    tableHeaderText: Property.Color;\n    tableFooterText: Property.Color;\n    tableHoverText: Property.Color;\n    tableRowBorder: Property.BorderBottomColor;\n  };\n\n  type Factory = (primaryColor: ColorInfo) => Colors;\n\n  export const getLight: Factory = (primaryColor) => ({\n    tableText: tinycolor('black').setAlpha(0.74).toHslString(),\n    tableSubtleText: tinycolor('black').setAlpha(0.51).toHslString(),\n    tableHeaderLayerBackground: tinycolor('black').setAlpha(0.03).toHslString(),\n    tableFooterLayerBackground: tinycolor('black').setAlpha(0.03).toHslString(),\n    tableHeaderText: tinycolor('black').setAlpha(0.51).toHslString(),\n    tableFooterText: tinycolor('black').setAlpha(0.51).toHslString(),\n    tableHoverBackground: tinycolor('black').setAlpha(0.04).toHslString(),\n    tableHoverText: tinycolor('black').setAlpha(0.74).toHslString(),\n    tableActiveText: primaryColor.value,\n    tableActiveHoverText: tinycolor(primaryColor.value).lighten(10).toHslString(),\n    tableRowBorder: 'hsl(0, 0%, 87%)',\n  });\n\n  export const getDark: Factory = (primaryColor) => ({\n    tableText: tinycolor('white').setAlpha(0.74).toHslString(),\n    tableSubtleText: tinycolor('white').setAlpha(0.51).toHslString(),\n    tableHeaderLayerBackground: tinycolor('white').setAlpha(0.02).toHslString(),\n    tableFooterLayerBackground: tinycolor('white').setAlpha(0.02).toHslString(),\n    tableHeaderText: tinycolor('white').setAlpha(0.51).toHslString(),\n    tableFooterText: tinycolor('white').setAlpha(0.51).toHslString(),\n    tableHoverBackground: tinycolor(primaryColor.value).setAlpha(0.04).toHslString(),\n    tableHoverText: tinycolor('white').setAlpha(0.74).toHslString(),\n    tableActiveText: '$primary',\n    tableActiveHoverText: tinycolor(primaryColor.value).lighten(10).toHslString(),\n    tableRowBorder: 'hsl(209, 21%, 23%)',\n  });\n}\n"],"names":["Theme"],"mappings":";AAKO,IAAU;AAAA,CAAV,CAAUA,WAAV;AAiBQA,SAAA,WAAoB,CAAC,kBAAkB;AAAA,IAClD,WAAW,UAAU,OAAO,EAAE,SAAS,IAAI,EAAE,YAAA;AAAA,IAC7C,iBAAiB,UAAU,OAAO,EAAE,SAAS,IAAI,EAAE,YAAA;AAAA,IACnD,4BAA4B,UAAU,OAAO,EAAE,SAAS,IAAI,EAAE,YAAA;AAAA,IAC9D,4BAA4B,UAAU,OAAO,EAAE,SAAS,IAAI,EAAE,YAAA;AAAA,IAC9D,iBAAiB,UAAU,OAAO,EAAE,SAAS,IAAI,EAAE,YAAA;AAAA,IACnD,iBAAiB,UAAU,OAAO,EAAE,SAAS,IAAI,EAAE,YAAA;AAAA,IACnD,sBAAsB,UAAU,OAAO,EAAE,SAAS,IAAI,EAAE,YAAA;AAAA,IACxD,gBAAgB,UAAU,OAAO,EAAE,SAAS,IAAI,EAAE,YAAA;AAAA,IAClD,iBAAiB,aAAa;AAAA,IAC9B,sBAAsB,UAAU,aAAa,KAAK,EAAE,QAAQ,EAAE,EAAE,YAAA;AAAA,IAChE,gBAAgB;AAAA,EAAA;AAGLA,SAAA,UAAmB,CAAC,kBAAkB;AAAA,IACjD,WAAW,UAAU,OAAO,EAAE,SAAS,IAAI,EAAE,YAAA;AAAA,IAC7C,iBAAiB,UAAU,OAAO,EAAE,SAAS,IAAI,EAAE,YAAA;AAAA,IACnD,4BAA4B,UAAU,OAAO,EAAE,SAAS,IAAI,EAAE,YAAA;AAAA,IAC9D,4BAA4B,UAAU,OAAO,EAAE,SAAS,IAAI,EAAE,YAAA;AAAA,IAC9D,iBAAiB,UAAU,OAAO,EAAE,SAAS,IAAI,EAAE,YAAA;AAAA,IACnD,iBAAiB,UAAU,OAAO,EAAE,SAAS,IAAI,EAAE,YAAA;AAAA,IACnD,sBAAsB,UAAU,aAAa,KAAK,EAAE,SAAS,IAAI,EAAE,YAAA;AAAA,IACnE,gBAAgB,UAAU,OAAO,EAAE,SAAS,IAAI,EAAE,YAAA;AAAA,IAClD,iBAAiB;AAAA,IACjB,sBAAsB,UAAU,aAAa,KAAK,EAAE,QAAQ,EAAE,EAAE,YAAA;AAAA,IAChE,gBAAgB;AAAA,EAAA;AAClB,GA3Ce,UAAA,QAAA,CAAA,EAAA;"}

package/dist/components/Tabs/Tabs.cjs

@@ -0,0 +1,59 @@
+"use strict";
+Object.defineProperty(exports, Symbol.toStringTag, { value: "Module" });
+const TabsPrimitive = require("@radix-ui/react-tabs");
+const stitches_config = require("../../stitches.config.cjs");
+function _interopNamespaceDefault(e) {
+  const n = Object.create(null, { [Symbol.toStringTag]: { value: "Module" } });
+  if (e) {
+    for (const k in e) {
+      if (k !== "default") {
+        const d = Object.getOwnPropertyDescriptor(e, k);
+        Object.defineProperty(n, k, d.get ? d : {
+          enumerable: true,
+          get: () => e[k]
+        });
+      }
+    }
+  }
+  n.default = e;
+  return Object.freeze(n);
+}
+const TabsPrimitive__namespace = /* @__PURE__ */ _interopNamespaceDefault(TabsPrimitive);
+const TabsContainer = stitches_config.styled(TabsPrimitive__namespace.Root, {
+  display: "flex",
+  flexDirection: "column"
+});
+const TabsList = stitches_config.styled(TabsPrimitive__namespace.List, {
+  display: "flex",
+  borderBottom: `1px solid $textSubtle`
+});
+const TabsTrigger = stitches_config.styled(TabsPrimitive__namespace.Trigger, {
+  all: "unset",
+  color: "$textSubtle",
+  fontFamily: "inherit",
+  flex: 1,
+  display: "flex",
+  alignItems: "center",
+  justifyContent: "center",
+  py: "$2",
+  userSelect: "none",
+  "@hover": {
+    "&:hover": {
+      cursor: "pointer",
+      color: "$hiContrast"
+    }
+  },
+  '&[data-state="active"]': {
+    color: "$primary",
+    boxShadow: "inset 0 -1px 0 0 currentColor, 0 1px 0 0 currentColor",
+    fontWeight: "$semiBold"
+  }
+});
+const TabsContent = stitches_config.styled(TabsPrimitive__namespace.Content, {
+  width: "100%"
+});
+exports.TabsContainer = TabsContainer;
+exports.TabsContent = TabsContent;
+exports.TabsList = TabsList;
+exports.TabsTrigger = TabsTrigger;
+//# sourceMappingURL=Tabs.cjs.map

package/dist/components/Tabs/Tabs.cjs.map

@@ -0,0 +1 @@
+{"version":3,"file":"Tabs.cjs","sources":["../../../components/Tabs/Tabs.tsx"],"sourcesContent":["import * as TabsPrimitive from '@radix-ui/react-tabs';\n\nimport { styled } from '../../stitches.config';\n\nexport const TabsContainer = styled(TabsPrimitive.Root, {\n  display: 'flex',\n  flexDirection: 'column',\n});\n\nexport const TabsList = styled(TabsPrimitive.List, {\n  display: 'flex',\n  borderBottom: `1px solid $textSubtle`,\n});\n\nexport const TabsTrigger = styled(TabsPrimitive.Trigger, {\n  all: 'unset',\n  color: '$textSubtle',\n  fontFamily: 'inherit',\n  flex: 1,\n  display: 'flex',\n  alignItems: 'center',\n  justifyContent: 'center',\n  py: '$2',\n  userSelect: 'none',\n  '@hover': {\n    '&:hover': {\n      cursor: 'pointer',\n      color: '$hiContrast',\n    },\n  },\n  '&[data-state=\"active\"]': {\n    color: '$primary',\n    boxShadow: 'inset 0 -1px 0 0 currentColor, 0 1px 0 0 currentColor',\n    fontWeight: '$semiBold',\n  },\n});\n\nexport const TabsContent = styled(TabsPrimitive.Content, {\n  width: '100%',\n});\n"],"names":["styled","TabsPrimitive"],"mappings":";;;;;;;;;;;;;;;;;;;;;AAIO,MAAM,gBAAgBA,gBAAAA,OAAOC,yBAAc,MAAM;AAAA,EACtD,SAAS;AAAA,EACT,eAAe;AACjB,CAAC;AAEM,MAAM,WAAWD,gBAAAA,OAAOC,yBAAc,MAAM;AAAA,EACjD,SAAS;AAAA,EACT,cAAc;AAChB,CAAC;AAEM,MAAM,cAAcD,gBAAAA,OAAOC,yBAAc,SAAS;AAAA,EACvD,KAAK;AAAA,EACL,OAAO;AAAA,EACP,YAAY;AAAA,EACZ,MAAM;AAAA,EACN,SAAS;AAAA,EACT,YAAY;AAAA,EACZ,gBAAgB;AAAA,EAChB,IAAI;AAAA,EACJ,YAAY;AAAA,EACZ,UAAU;AAAA,IACR,WAAW;AAAA,MACT,QAAQ;AAAA,MACR,OAAO;AAAA,IAAA;AAAA,EACT;AAAA,EAEF,0BAA0B;AAAA,IACxB,OAAO;AAAA,IACP,WAAW;AAAA,IACX,YAAY;AAAA,EAAA;AAEhB,CAAC;AAEM,MAAM,cAAcD,gBAAAA,OAAOC,yBAAc,SAAS;AAAA,EACvD,OAAO;AACT,CAAC;;;;;"}

package/dist/components/Tabs/Tabs.js

@@ -0,0 +1,42 @@
+import * as TabsPrimitive from "@radix-ui/react-tabs";
+import { styled } from "../../stitches.config.js";
+const TabsContainer = styled(TabsPrimitive.Root, {
+  display: "flex",
+  flexDirection: "column"
+});
+const TabsList = styled(TabsPrimitive.List, {
+  display: "flex",
+  borderBottom: `1px solid $textSubtle`
+});
+const TabsTrigger = styled(TabsPrimitive.Trigger, {
+  all: "unset",
+  color: "$textSubtle",
+  fontFamily: "inherit",
+  flex: 1,
+  display: "flex",
+  alignItems: "center",
+  justifyContent: "center",
+  py: "$2",
+  userSelect: "none",
+  "@hover": {
+    "&:hover": {
+      cursor: "pointer",
+      color: "$hiContrast"
+    }
+  },
+  '&[data-state="active"]': {
+    color: "$primary",
+    boxShadow: "inset 0 -1px 0 0 currentColor, 0 1px 0 0 currentColor",
+    fontWeight: "$semiBold"
+  }
+});
+const TabsContent = styled(TabsPrimitive.Content, {
+  width: "100%"
+});
+export {
+  TabsContainer,
+  TabsContent,
+  TabsList,
+  TabsTrigger
+};
+//# sourceMappingURL=Tabs.js.map

package/dist/components/Tabs/Tabs.js.map

@@ -0,0 +1 @@
+{"version":3,"file":"Tabs.js","sources":["../../../components/Tabs/Tabs.tsx"],"sourcesContent":["import * as TabsPrimitive from '@radix-ui/react-tabs';\n\nimport { styled } from '../../stitches.config';\n\nexport const TabsContainer = styled(TabsPrimitive.Root, {\n  display: 'flex',\n  flexDirection: 'column',\n});\n\nexport const TabsList = styled(TabsPrimitive.List, {\n  display: 'flex',\n  borderBottom: `1px solid $textSubtle`,\n});\n\nexport const TabsTrigger = styled(TabsPrimitive.Trigger, {\n  all: 'unset',\n  color: '$textSubtle',\n  fontFamily: 'inherit',\n  flex: 1,\n  display: 'flex',\n  alignItems: 'center',\n  justifyContent: 'center',\n  py: '$2',\n  userSelect: 'none',\n  '@hover': {\n    '&:hover': {\n      cursor: 'pointer',\n      color: '$hiContrast',\n    },\n  },\n  '&[data-state=\"active\"]': {\n    color: '$primary',\n    boxShadow: 'inset 0 -1px 0 0 currentColor, 0 1px 0 0 currentColor',\n    fontWeight: '$semiBold',\n  },\n});\n\nexport const TabsContent = styled(TabsPrimitive.Content, {\n  width: '100%',\n});\n"],"names":[],"mappings":";;AAIO,MAAM,gBAAgB,OAAO,cAAc,MAAM;AAAA,EACtD,SAAS;AAAA,EACT,eAAe;AACjB,CAAC;AAEM,MAAM,WAAW,OAAO,cAAc,MAAM;AAAA,EACjD,SAAS;AAAA,EACT,cAAc;AAChB,CAAC;AAEM,MAAM,cAAc,OAAO,cAAc,SAAS;AAAA,EACvD,KAAK;AAAA,EACL,OAAO;AAAA,EACP,YAAY;AAAA,EACZ,MAAM;AAAA,EACN,SAAS;AAAA,EACT,YAAY;AAAA,EACZ,gBAAgB;AAAA,EAChB,IAAI;AAAA,EACJ,YAAY;AAAA,EACZ,UAAU;AAAA,IACR,WAAW;AAAA,MACT,QAAQ;AAAA,MACR,OAAO;AAAA,IAAA;AAAA,EACT;AAAA,EAEF,0BAA0B;AAAA,IACxB,OAAO;AAAA,IACP,WAAW;AAAA,IACX,YAAY;AAAA,EAAA;AAEhB,CAAC;AAEM,MAAM,cAAc,OAAO,cAAc,SAAS;AAAA,EACvD,OAAO;AACT,CAAC;"}

package/dist/components/Text/Text.cjs

@@ -0,0 +1,129 @@
+"use strict";
+Object.defineProperty(exports, Symbol.toStringTag, { value: "Module" });
+const stitches_config = require("../../stitches.config.cjs");
+const Text = stitches_config.styled("span", {
+  // Reset
+  lineHeight: "1",
+  margin: "0",
+  fontFamily: "$rubik",
+  fontVariantNumeric: "tabular-nums",
+  display: "inline-block",
+  variants: {
+    size: {
+      "0": {
+        fontSize: "$0"
+      },
+      "1": {
+        fontSize: "$1"
+      },
+      "2": {
+        fontSize: "$2"
+      },
+      "3": {
+        fontSize: "$3"
+      },
+      "4": {
+        fontSize: "$4"
+      },
+      "5": {
+        fontSize: "$5"
+      },
+      "6": {
+        fontSize: "$6"
+      },
+      "7": {
+        fontSize: "$7"
+      },
+      "8": {
+        fontSize: "$8"
+      },
+      "9": {
+        fontSize: "$9"
+      },
+      "10": {
+        fontSize: "$10"
+      },
+      "11": {
+        fontSize: "$11"
+      },
+      "12": {
+        fontSize: "$12"
+      },
+      inherit: {
+        fontSize: "inherit"
+      }
+    },
+    weight: {
+      light: {
+        fontWeight: "$light"
+      },
+      regular: {
+        fontWeight: "$regular"
+      },
+      medium: {
+        fontWeight: "$medium"
+      },
+      semiBold: {
+        fontWeight: "$semiBold"
+      },
+      bold: {
+        fontWeight: "$bold"
+      }
+    },
+    variant: {
+      red: {
+        color: "$textRed"
+      },
+      subtle: {
+        color: "$textSubtle"
+      },
+      default: {
+        color: "$textDefault"
+      },
+      contrast: {
+        color: "$textContrast"
+      },
+      inherit: {
+        color: "inherit"
+      },
+      invalid: {
+        color: "$textInvalid"
+      }
+    },
+    gradient: {
+      true: {
+        WebkitBackgroundClip: "text",
+        WebkitTextFillColor: "transparent"
+      }
+    },
+    transform: {
+      uppercase: {
+        textTransform: "uppercase"
+      },
+      capitalize: {
+        // WARNING: this will only work with block elements (display block/inline-block)
+        // @see https://developer.mozilla.org/en-US/docs/Web/CSS/::first-letter
+        display: "inline-block",
+        "&::first-letter": {
+          textTransform: "uppercase"
+        }
+      },
+      capitalizeWords: {
+        textTransform: "capitalize"
+      }
+    },
+    noWrap: {
+      true: {
+        overflow: "hidden",
+        textOverflow: "ellipsis",
+        whiteSpace: "nowrap"
+      }
+    }
+  },
+  defaultVariants: {
+    size: "3",
+    variant: "default"
+  }
+});
+exports.Text = Text;
+//# sourceMappingURL=Text.cjs.map

package/dist/components/Text/Text.cjs.map

@@ -0,0 +1 @@
+{"version":3,"file":"Text.cjs","sources":["../../../components/Text/Text.tsx"],"sourcesContent":["import { CSS, styled, VariantProps } from '../../stitches.config';\n\nexport const Text = styled('span', {\n  // Reset\n  lineHeight: '1',\n  margin: '0',\n  fontFamily: '$rubik',\n  fontVariantNumeric: 'tabular-nums',\n  display: 'inline-block',\n\n  variants: {\n    size: {\n      '0': {\n        fontSize: '$0',\n      },\n      '1': {\n        fontSize: '$1',\n      },\n      '2': {\n        fontSize: '$2',\n      },\n      '3': {\n        fontSize: '$3',\n      },\n      '4': {\n        fontSize: '$4',\n      },\n      '5': {\n        fontSize: '$5',\n      },\n      '6': {\n        fontSize: '$6',\n      },\n      '7': {\n        fontSize: '$7',\n      },\n      '8': {\n        fontSize: '$8',\n      },\n      '9': {\n        fontSize: '$9',\n      },\n      '10': {\n        fontSize: '$10',\n      },\n      '11': {\n        fontSize: '$11',\n      },\n      '12': {\n        fontSize: '$12',\n      },\n      inherit: {\n        fontSize: 'inherit',\n      },\n    },\n    weight: {\n      light: {\n        fontWeight: '$light',\n      },\n      regular: {\n        fontWeight: '$regular',\n      },\n      medium: {\n        fontWeight: '$medium',\n      },\n      semiBold: {\n        fontWeight: '$semiBold',\n      },\n      bold: {\n        fontWeight: '$bold',\n      },\n    },\n    variant: {\n      red: {\n        color: '$textRed',\n      },\n      subtle: {\n        color: '$textSubtle',\n      },\n      default: {\n        color: '$textDefault',\n      },\n      contrast: {\n        color: '$textContrast',\n      },\n      inherit: {\n        color: 'inherit',\n      },\n      invalid: {\n        color: '$textInvalid',\n      },\n    },\n    gradient: {\n      true: {\n        WebkitBackgroundClip: 'text',\n        WebkitTextFillColor: 'transparent',\n      },\n    },\n    transform: {\n      uppercase: {\n        textTransform: 'uppercase',\n      },\n      capitalize: {\n        // WARNING: this will only work with block elements (display block/inline-block)\n        // @see https://developer.mozilla.org/en-US/docs/Web/CSS/::first-letter\n        display: 'inline-block',\n        '&::first-letter': {\n          textTransform: 'uppercase',\n        },\n      },\n      capitalizeWords: {\n        textTransform: 'capitalize',\n      },\n    },\n    noWrap: {\n      true: {\n        overflow: 'hidden',\n        textOverflow: 'ellipsis',\n        whiteSpace: 'nowrap',\n      },\n    },\n  },\n  defaultVariants: {\n    size: '3',\n    variant: 'default',\n  },\n});\n\nexport type TextVariants = VariantProps<typeof Text>;\nexport type TextProps = TextVariants & { css?: CSS };\n"],"names":["styled"],"mappings":";;;AAEO,MAAM,OAAOA,gBAAAA,OAAO,QAAQ;AAAA;AAAA,EAEjC,YAAY;AAAA,EACZ,QAAQ;AAAA,EACR,YAAY;AAAA,EACZ,oBAAoB;AAAA,EACpB,SAAS;AAAA,EAET,UAAU;AAAA,IACR,MAAM;AAAA,MACJ,KAAK;AAAA,QACH,UAAU;AAAA,MAAA;AAAA,MAEZ,KAAK;AAAA,QACH,UAAU;AAAA,MAAA;AAAA,MAEZ,KAAK;AAAA,QACH,UAAU;AAAA,MAAA;AAAA,MAEZ,KAAK;AAAA,QACH,UAAU;AAAA,MAAA;AAAA,MAEZ,KAAK;AAAA,QACH,UAAU;AAAA,MAAA;AAAA,MAEZ,KAAK;AAAA,QACH,UAAU;AAAA,MAAA;AAAA,MAEZ,KAAK;AAAA,QACH,UAAU;AAAA,MAAA;AAAA,MAEZ,KAAK;AAAA,QACH,UAAU;AAAA,MAAA;AAAA,MAEZ,KAAK;AAAA,QACH,UAAU;AAAA,MAAA;AAAA,MAEZ,KAAK;AAAA,QACH,UAAU;AAAA,MAAA;AAAA,MAEZ,MAAM;AAAA,QACJ,UAAU;AAAA,MAAA;AAAA,MAEZ,MAAM;AAAA,QACJ,UAAU;AAAA,MAAA;AAAA,MAEZ,MAAM;AAAA,QACJ,UAAU;AAAA,MAAA;AAAA,MAEZ,SAAS;AAAA,QACP,UAAU;AAAA,MAAA;AAAA,IACZ;AAAA,IAEF,QAAQ;AAAA,MACN,OAAO;AAAA,QACL,YAAY;AAAA,MAAA;AAAA,MAEd,SAAS;AAAA,QACP,YAAY;AAAA,MAAA;AAAA,MAEd,QAAQ;AAAA,QACN,YAAY;AAAA,MAAA;AAAA,MAEd,UAAU;AAAA,QACR,YAAY;AAAA,MAAA;AAAA,MAEd,MAAM;AAAA,QACJ,YAAY;AAAA,MAAA;AAAA,IACd;AAAA,IAEF,SAAS;AAAA,MACP,KAAK;AAAA,QACH,OAAO;AAAA,MAAA;AAAA,MAET,QAAQ;AAAA,QACN,OAAO;AAAA,MAAA;AAAA,MAET,SAAS;AAAA,QACP,OAAO;AAAA,MAAA;AAAA,MAET,UAAU;AAAA,QACR,OAAO;AAAA,MAAA;AAAA,MAET,SAAS;AAAA,QACP,OAAO;AAAA,MAAA;AAAA,MAET,SAAS;AAAA,QACP,OAAO;AAAA,MAAA;AAAA,IACT;AAAA,IAEF,UAAU;AAAA,MACR,MAAM;AAAA,QACJ,sBAAsB;AAAA,QACtB,qBAAqB;AAAA,MAAA;AAAA,IACvB;AAAA,IAEF,WAAW;AAAA,MACT,WAAW;AAAA,QACT,eAAe;AAAA,MAAA;AAAA,MAEjB,YAAY;AAAA;AAAA;AAAA,QAGV,SAAS;AAAA,QACT,mBAAmB;AAAA,UACjB,eAAe;AAAA,QAAA;AAAA,MACjB;AAAA,MAEF,iBAAiB;AAAA,QACf,eAAe;AAAA,MAAA;AAAA,IACjB;AAAA,IAEF,QAAQ;AAAA,MACN,MAAM;AAAA,QACJ,UAAU;AAAA,QACV,cAAc;AAAA,QACd,YAAY;AAAA,MAAA;AAAA,IACd;AAAA,EACF;AAAA,EAEF,iBAAiB;AAAA,IACf,MAAM;AAAA,IACN,SAAS;AAAA,EAAA;AAEb,CAAC;;"}