@koine/react 1.0.9 → 1.0.10

package/node/Grid/Grid.js

@@ -1,83 +0,0 @@
-"use strict";
-Object.defineProperty(exports, "__esModule", { value: true });
-exports.Col = exports.Row = exports.ContainerFluid = exports.Container = exports.GRID_GUTTER_DEFAULT = exports.GRID_COLUMNS = void 0;
-const tslib_1 = require("tslib");
-const styled_components_1 = tslib_1.__importDefault(require("styled-components"));
-exports.GRID_COLUMNS = 12;
-exports.GRID_GUTTER_DEFAULT = "half";
-exports.Container = styled_components_1.default.div `
-  max-width: ${(p) => p.theme.breakpoints[p.size]}px;
-  margin: 0 auto;
-  padding: 0 ${(p) => p.theme.gutter[p.$gutter || exports.GRID_GUTTER_DEFAULT]}px;
-  ${(p) => (p.clamp ? "overflow: hidden;" : "")}
-`;
-exports.ContainerFluid = styled_components_1.default.div `
-  padding: 0 ${(p) => p.theme.gutter[p.$gutter || exports.GRID_GUTTER_DEFAULT]}px;
-`;
-exports.Row = styled_components_1.default.div `
-  margin: 0 -${(p) => p.theme.gutter[p.$gutter || exports.GRID_GUTTER_DEFAULT]}px;
-  display: flex;
-  ${(p) => (p.$noWrap ? "overflow: auto;" : "flex-wrap: wrap;")}
-  ${(p) => (p.$valign ? `align-items: ${p.$valign}` : "")};
-  ${(p) => p.$reverse &&
-    `@media (${p.$reverse.split(":")[0]}-width: ${p.$reverse.split(":")[1]}px) {
-      flex-direction: row-reverse;
-    }`}
-`;
-exports.Col = styled_components_1.default.div `
-  padding: 0 ${(p) => p.theme.gutter[p.$gutter || exports.GRID_GUTTER_DEFAULT]}px;
-  display: ${(p) => (p.$flex ? "flex" : "block")};
-  ${(p) => (p.$valign ? "align-items: " + p.$valign : "")};
-  ${(p) => getColCss(p)};
-`;
-function getColWidth(breakpoints, breakpoint, value) {
-    const breakpointValue = breakpoints[breakpoint] + "px";
-    const width = (value * 100) / exports.GRID_COLUMNS;
-    const cssValue = `
-    min-width: ${width}%;
-    flex: 0 0 ${width}%;
-`;
-    if (breakpoint === Object.keys(breakpoints)[0]) {
-        return cssValue;
-    }
-    return `
-  @media (min-width: ${breakpointValue}){
-    ${cssValue}
-  }`;
-}
-function getColCss(props) {
-    const { $auto, $offset, $width } = props;
-    const { breakpoints } = props.theme;
-    let css = "";
-    if ($offset) {
-        const offsets = $offset.split(",");
-        for (let i = 0; i <= offsets.length; i++) {
-            if (offsets[i]) {
-                const [offsetBreakpoint, offsetSize] = offsets[i].split(":");
-                css += ` 
-          @media(min-width: ${breakpoints[offsetBreakpoint]}px){
-            margin-left: ${(100 * offsetSize) / exports.GRID_COLUMNS}%;
-          }
-        `;
-            }
-        }
-    }
-    if ($width) {
-        // do nothing, width is set explicitly
-    }
-    else if ($auto) {
-        css += `flex: 0 0 auto; width: auto; max-width: none;`;
-    }
-    else {
-        for (const breakpoint in breakpoints) {
-            const value = props[breakpoint];
-            if (typeof value !== "undefined") {
-                css += getColWidth(breakpoints, breakpoint, value);
-            }
-            else if (breakpoint === "xs") {
-                css += getColWidth(breakpoints, breakpoint, 12);
-            }
-        }
-    }
-    return css;
-}

package/node/Grid/index.js

@@ -1,4 +0,0 @@
-"use strict";
-Object.defineProperty(exports, "__esModule", { value: true });
-const tslib_1 = require("tslib");
-tslib_1.__exportStar(require("./Grid"), exports);

package/node/Hamburger/Hamburger.js

@@ -1,69 +0,0 @@
-"use strict";
-Object.defineProperty(exports, "__esModule", { value: true });
-exports.Hamburger = void 0;
-const tslib_1 = require("tslib");
-const jsx_runtime_1 = require("react/jsx-runtime");
-/**
- * @file
- *
- * Simplified from https://github.com/luukdv/hamburger-react
- */
-const styled_components_1 = tslib_1.__importDefault(require("styled-components"));
-const HamburgerLabel = styled_components_1.default.div `
-  position: absolute;
-  top: 30px;
-  font-size: ${({ $toggled }) => ($toggled ? "0" : "9px")};
-  text-transform: uppercase;
-  left: 7px;
-  letter-spacing: 3px;
-`;
-const area = 48;
-const lines = 3;
-const width = 32;
-const room = Math.round((area - width) / 2);
-const barHeightRaw = width / 12;
-const barHeight = Math.round(barHeightRaw);
-const space = 0.5;
-const marginRaw = width / (lines * (space + (lines === 3 ? 1 : 1.25)));
-const margin = Math.round(marginRaw);
-const height = barHeight * lines + margin * (lines - 1);
-const topOffset = Math.round((area - height) / 2);
-const translate = 4.6325;
-const deviation = (barHeightRaw - barHeight + (marginRaw - margin)) / (lines === 3 ? 1 : 2);
-const move = parseFloat((width / translate - deviation / (4 / 3)).toFixed(2));
-const time = 0.4;
-const easing = "cubic-bezier(0, 0, 0, 1)";
-const transition = `${time}s ${easing}`;
-const burgerStyles = {
-    marginRight: "-8px",
-    position: "relative",
-    width: `${area}px`,
-    height: `${area}px`,
-    userSelect: "none",
-    outline: "0px",
-    cursor: "pointer",
-    transition,
-};
-const barStyles = {
-    position: "absolute",
-    width: `${width}px`,
-    height: `${barHeight}px`,
-    left: `${room}px`,
-    background: "currentColor",
-    transition,
-};
-const Hamburger = ({ toggled, ...props }) => {
-    return ((0, jsx_runtime_1.jsxs)("div", { style: {
-            ...burgerStyles,
-            transform: `${toggled ? `rotate(90deg)` : "none"}`,
-        }, tabIndex: 0, ...props, children: [(0, jsx_runtime_1.jsx)("div", { style: {
-                    ...barStyles,
-                    top: `${topOffset}px`,
-                    transform: `${toggled ? `rotate(-45deg) translate(0px, ${move}px)` : "none"}`,
-                } }), (0, jsx_runtime_1.jsx)("div", { style: {
-                    ...barStyles,
-                    top: `${topOffset + barHeight + margin}px`,
-                    transform: `${toggled ? `rotate(45deg) translate(0, -${move}px)` : "none"}`,
-                } }), (0, jsx_runtime_1.jsx)(HamburgerLabel, { "$toggled": toggled, children: "Menu" })] }));
-};
-exports.Hamburger = Hamburger;

package/node/Hamburger/index.js

@@ -1,4 +0,0 @@
-"use strict";
-Object.defineProperty(exports, "__esModule", { value: true });
-const tslib_1 = require("tslib");
-tslib_1.__exportStar(require("./Hamburger"), exports);

package/node/Header/index.js

@@ -1,4 +0,0 @@
-"use strict";
-Object.defineProperty(exports, "__esModule", { value: true });
-const tslib_1 = require("tslib");
-tslib_1.__exportStar(require("./useHeader"), exports);

package/node/Header/useHeader.js

@@ -1,34 +0,0 @@
-"use strict";
-Object.defineProperty(exports, "__esModule", { value: true });
-exports.useHeader = void 0;
-const react_1 = require("react");
-const useScrollPosition_1 = require("../hooks/useScrollPosition");
-const theme_1 = require("../styles/theme");
-const media_1 = require("../styles/media");
-const useHeader = () => {
-    const [isSticky, setIsSticky] = (0, react_1.useState)(false);
-    const { header: themed } = (0, theme_1.useTheme)();
-    const isDesktopLayout = (0, media_1.useMedia)(`min:${themed.breakpoint}`);
-    const valueIdx = isDesktopLayout ? 1 : 0;
-    const [headerHeight, setHeaderHeight] = (0, react_1.useState)(themed.height[valueIdx]);
-    const [placeholderHeight, setPlaceholderHeight] = (0, react_1.useState)(themed.height[valueIdx]);
-    const [logoWidth, setLogoWidth] = (0, react_1.useState)(themed.logoWidth[valueIdx]);
-    (0, useScrollPosition_1.useScrollPosition)((currentPosition) => {
-        const isPastThreshold = currentPosition.y * -1 > 40;
-        if (isSticky !== isPastThreshold)
-            setIsSticky(isPastThreshold);
-    }, [isSticky]);
-    (0, react_1.useEffect)(() => {
-        const valueIdx = isDesktopLayout ? 1 : 0;
-        setPlaceholderHeight(themed.height[valueIdx]);
-        setHeaderHeight(isSticky ? themed.heightSticky[valueIdx] : themed.height[valueIdx]);
-        setLogoWidth(isSticky ? themed.logoWidthSticky[valueIdx] : themed.logoWidth[valueIdx]);
-    }, [themed, isSticky, isDesktopLayout]);
-    return [
-        isSticky,
-        placeholderHeight,
-        headerHeight,
-        logoWidth,
-    ];
-};
-exports.useHeader = useHeader;

package/node/Hidden/Hidden.js

@@ -1,18 +0,0 @@
-"use strict";
-Object.defineProperty(exports, "__esModule", { value: true });
-exports.Hidden = void 0;
-const tslib_1 = require("tslib");
-const styled_components_1 = tslib_1.__importDefault(require("styled-components"));
-exports.Hidden = styled_components_1.default.div `
-  ${(p) => `${p.$min
-    ? `
-  @media (min-width: ${p.theme.breakpoints[p.$min]}px) {
-    display: none;
-  }`
-    : ""} ${p.$max
-    ? `
-  @media (max-width: ${p.theme.breakpoints[p.$max]}px) {
-    display: none;
-  }`
-    : ""}`}
-`;

package/node/Hidden/index.js

@@ -1,4 +0,0 @@
-"use strict";
-Object.defineProperty(exports, "__esModule", { value: true });
-const tslib_1 = require("tslib");
-tslib_1.__exportStar(require("./Hidden"), exports);

package/node/Img/index.js

@@ -1,4 +0,0 @@
-"use strict";
-Object.defineProperty(exports, "__esModule", { value: true });
-const tslib_1 = require("tslib");
-tslib_1.__exportStar(require("./types"), exports);

package/node/Img/sc/bare.js

@@ -1,41 +0,0 @@
-"use strict";
-Object.defineProperty(exports, "__esModule", { value: true });
-exports.KoineImg = void 0;
-const tslib_1 = require("tslib");
-const styled_components_1 = tslib_1.__importDefault(require("styled-components"));
-// export type KoineImgProps = {
-//   /** @default "cover" */
-//   $fit?: "cover" | "contain";
-// };
-exports.KoineImg = styled_components_1.default.img ``;
-// export const KoineImg = styled.img<KoineImgProps>`
-//   object-fit: ${(p) => p.$fit || "cover"};
-// `;
-// /**
-//  * Replacement core component for native `<img />`
-//  *
-//  * Features:
-//  *  - lazy load
-//  *  - proportion cage
-//  */
-// export const Img = ({
-//   className,
-//   style = {},
-//   lazyProps,
-//   ...props
-// }: ImgProps) => {
-//   let { width, height, src } = props;
-//   width = width ? `${width}px` : "100%";
-//   height = height ? `${height}px` : "100%";
-//   const imgProps = { width, height, src };
-//   return (
-//     <ImgRoot style={{ width, height, ...style }} className={className}>
-//       <LazyLoad {...lazyProps}>
-//         <ImgNative {...imgProps} />
-//       </LazyLoad>
-//       <noscript>
-//         <img {...imgProps} />
-//       </noscript>
-//     </ImgRoot>
-//   );
-// };

package/node/Img/types.js

@@ -1,2 +0,0 @@
-"use strict";
-Object.defineProperty(exports, "__esModule", { value: true });

package/node/Link/Link.js

@@ -1,6 +0,0 @@
-"use strict";
-Object.defineProperty(exports, "__esModule", { value: true });
-exports.KoineLink = void 0;
-const tslib_1 = require("tslib");
-const styled_components_1 = tslib_1.__importDefault(require("styled-components"));
-exports.KoineLink = styled_components_1.default.a ``;

package/node/Link/LinkBlank.js

@@ -1,31 +0,0 @@
-"use strict";
-Object.defineProperty(exports, "__esModule", { value: true });
-exports.LinkBlank = exports.LinkBlankIcon = exports.LinkBlankA = void 0;
-const tslib_1 = require("tslib");
-const jsx_runtime_1 = require("react/jsx-runtime");
-const styled_components_1 = tslib_1.__importDefault(require("styled-components"));
-const md_1 = require("react-icons/md");
-const media_1 = require("../styles/media");
-exports.LinkBlankA = styled_components_1.default.a.attrs({
-    target: "_blank",
-    rel: "noopener",
-}) ``;
-// TODO: use `touch` class on <html> instead of relying on screenwidth,
-// probably implement a lean Modernizr like thing with react-helmet
-exports.LinkBlankIcon = (0, styled_components_1.default)(md_1.MdLaunch) `
-  color: var(---grey100);
-  font-size: inherit;
-  margin-left: 3px;
-  line-height: inherit;
-  vertical-align: middle;
-  width: 0px;
-  transition: width 0.1s ease-in-out;
-  ${media_1.max.sm} {
-    width: 20px;
-    opacity: 0.8;
-  }
-`;
-const LinkBlank = ({ children, target, rel, ...props }) => {
-    return ((0, jsx_runtime_1.jsxs)(exports.LinkBlankA, { ...props, children: [children, (0, jsx_runtime_1.jsx)(exports.LinkBlankIcon, {})] }));
-};
-exports.LinkBlank = LinkBlank;

package/node/Link/index.js

@@ -1,5 +0,0 @@
-"use strict";
-Object.defineProperty(exports, "__esModule", { value: true });
-const tslib_1 = require("tslib");
-tslib_1.__exportStar(require("./Link"), exports);
-tslib_1.__exportStar(require("./LinkBlank"), exports);

package/node/Menu/Menu.js

@@ -1,15 +0,0 @@
-"use strict";
-Object.defineProperty(exports, "__esModule", { value: true });
-exports.Menu = void 0;
-const tslib_1 = require("tslib");
-const styled_components_1 = tslib_1.__importDefault(require("styled-components"));
-exports.Menu = styled_components_1.default.ul `
-  z-index: 3;
-  position: absolute;
-  list-style-type: none;
-  margin: 0;
-  padding: 0;
-  background: #fff;
-  width: 100%;
-  box-shadow: var(--shadow);
-`;

package/node/Menu/index.js

@@ -1,4 +0,0 @@
-"use strict";
-Object.defineProperty(exports, "__esModule", { value: true });
-const tslib_1 = require("tslib");
-tslib_1.__exportStar(require("./Menu"), exports);

package/node/MenuItem/MenuItem.js

@@ -1,24 +0,0 @@
-"use strict";
-Object.defineProperty(exports, "__esModule", { value: true });
-exports.MenuItem = void 0;
-const tslib_1 = require("tslib");
-const styled_components_1 = tslib_1.__importDefault(require("styled-components"));
-exports.MenuItem = styled_components_1.default.li `
-  padding: 8px 16px;
-
-  &[aria-selected="true"] {
-    background: var(--accent400);
-  }
-
-  /** DEP: this is just for MultiselectMui? */
-  &.Mui-focused,
-  &[data-focus="true"] {
-    background: var(--accent300);
-    color: white;
-  }
-
-  &:not([disabled]):hover {
-    cursor: pointer;
-    background: var(--accent300);
-  }
-`;

package/node/MenuItem/index.js

@@ -1,4 +0,0 @@
-"use strict";
-Object.defineProperty(exports, "__esModule", { value: true });
-const tslib_1 = require("tslib");
-tslib_1.__exportStar(require("./MenuItem"), exports);

package/node/Meta/Meta.js

@@ -1,8 +0,0 @@
-"use strict";
-Object.defineProperty(exports, "__esModule", { value: true });
-exports.Meta = void 0;
-const jsx_runtime_1 = require("react/jsx-runtime");
-const Meta = ({ zoom }) => {
-    return ((0, jsx_runtime_1.jsx)("meta", { name: "viewport", content: `width=device-width, initial-scale=1, maximum-scale=1${zoom ? "" : ", user-scalable=0"}` }));
-};
-exports.Meta = Meta;

package/node/Meta/index.js

@@ -1,4 +0,0 @@
-"use strict";
-Object.defineProperty(exports, "__esModule", { value: true });
-const tslib_1 = require("tslib");
-tslib_1.__exportStar(require("./Meta"), exports);

package/node/NoJs/NoJs.js

@@ -1,10 +0,0 @@
-"use strict";
-Object.defineProperty(exports, "__esModule", { value: true });
-exports.NoJs = void 0;
-const jsx_runtime_1 = require("react/jsx-runtime");
-const NoJs = (_props) => {
-    return ((0, jsx_runtime_1.jsx)("script", { id: "no-js", dangerouslySetInnerHTML: {
-            __html: `document.querySelector("html").className=document.querySelector("html").className.replace(/no-js/,"") + "js";`,
-        } }));
-};
-exports.NoJs = NoJs;

package/node/NoJs/index.js

@@ -1,4 +0,0 @@
-"use strict";
-Object.defineProperty(exports, "__esModule", { value: true });
-const tslib_1 = require("tslib");
-tslib_1.__exportStar(require("./NoJs"), exports);

package/node/Pagination/PaginationNav.js

@@ -1,88 +0,0 @@
-"use strict";
-Object.defineProperty(exports, "__esModule", { value: true });
-exports.KoinePaginationNav = void 0;
-const tslib_1 = require("tslib");
-const jsx_runtime_1 = require("react/jsx-runtime");
-const styled_components_1 = tslib_1.__importDefault(require("styled-components"));
-const cg_1 = require("react-icons/cg");
-const utils_1 = require("@koine/utils");
-const Root = styled_components_1.default.nav `
-  display: flex;
-  align-items: center;
-  justify-content: center;
-  padding: 20px 0 40px;
-  font-weight: 600;
-
-  & a {
-    text-decoration: none;
-  }
-`;
-const item = `
-  display: block;
-  padding: 5px 10px;
-`;
-const ItemCurrent = styled_components_1.default.span `
-  ${item}
-  background: var(--accent400);
-  border-radius: 2px;
-`;
-const ItemLink = styled_components_1.default.a `
-  ${item}
-
-  ${(props) => (props.prev ? "color: var(--grey100);" : "")}
-`;
-const DotsSeparator = styled_components_1.default.span `
-  color: var(--grey100);
-`;
-const arrow = `display: flex; font-size: 20px;`;
-const ItemPrev = styled_components_1.default.a `
-  ${arrow}
-`;
-const ItemNext = styled_components_1.default.a `
-  ${arrow}
-`;
-/*
- * Possible outcomes:
- * [1] 2 3 ... 78 >
- * < 1 2 [3] 4 5 ... 78 >
- * < 1 ... 6 7 [8] 9 10 ... 78 >
- * < 1 ... 75 76 [77] 78 >
- * < 1 ... 76 77 [78]
- */
-const KoinePaginationNav = ({ total, perPage, currentPage, baseUrl, showOffset = 2, currentUrl = "/", Link = "a", }) => {
-    total = (0, utils_1.ensureInt)(total);
-    currentPage = (0, utils_1.ensureInt)(currentPage);
-    perPage = (0, utils_1.ensureInt)(perPage);
-    // page 0 means 1
-    currentPage = currentPage || 1;
-    baseUrl = baseUrl || currentUrl;
-    // don't output anything if pagination is not needed
-    if (total < perPage) {
-        return null;
-    }
-    const firstPage = 1;
-    const lastPage = Math.ceil(total / perPage);
-    const prevPage = currentPage - 1 > firstPage ? currentPage - 1 : "";
-    const nextPage = currentPage + 1 < lastPage ? currentPage + 1 : lastPage;
-    const prevArrow = currentPage > firstPage;
-    const nextArrow = currentPage < lastPage;
-    const pages = [];
-    // fill the pages before the current
-    for (let i = currentPage - showOffset; i < currentPage; i++) {
-        if (i > 1) {
-            pages.push(i);
-        }
-    }
-    // add the current
-    pages.push(currentPage);
-    // fill the pages after the current
-    for (let i = currentPage + 1; i < currentPage + 1 + showOffset; i++) {
-        if (i < lastPage) {
-            pages.push(i);
-        }
-    }
-    const prevDots = pages[0] > firstPage + 1;
-    const nextDots = pages[pages.length - 1] < lastPage - 1;
-    return ((0, jsx_runtime_1.jsxs)(Root, { children: [prevArrow && ((0, jsx_runtime_1.jsx)(ItemPrev, { as: Link, href: `${baseUrl}/${prevPage}`, children: (0, jsx_runtime_1.jsx)(cg_1.CgArrowLeftR, {}) })), firstPage !== currentPage && ((0, jsx_runtime_1.jsx)(ItemLink, { as: Link, href: `${baseUrl}`, prev: true, children: firstPage })), prevDots && (0, jsx_runtime_1.jsx)(DotsSeparator, { children: "..." }), pages.map((page) => page === currentPage ? ((0, jsx_runtime_1.jsx)(ItemCurrent, { children: page }, page)) : ((0, jsx_runtime_1.jsx)(ItemLink, { as: Link, href: `${baseUrl}/${page}`, prev: page < currentPage, next: page > currentPage, children: page }, `pagination-${page}`))), nextDots && (0, jsx_runtime_1.jsx)(DotsSeparator, { children: "..." }), lastPage !== currentPage && ((0, jsx_runtime_1.jsx)(ItemLink, { as: Link, href: `${baseUrl}/${lastPage}`, next: true, children: lastPage })), nextArrow && ((0, jsx_runtime_1.jsx)(ItemNext, { as: Link, href: `${baseUrl}/${nextPage}`, children: (0, jsx_runtime_1.jsx)(cg_1.CgArrowRightR, {}) }))] }));
-};
-exports.KoinePaginationNav = KoinePaginationNav;

package/node/Pagination/PaginationResults.js

@@ -1,15 +0,0 @@
-"use strict";
-Object.defineProperty(exports, "__esModule", { value: true });
-exports.PaginationResults = void 0;
-const tslib_1 = require("tslib");
-const jsx_runtime_1 = require("react/jsx-runtime");
-const styled_components_1 = tslib_1.__importDefault(require("styled-components"));
-const framer_motion_1 = require("framer-motion");
-const Root = styled_components_1.default.div `
-  // overflow: hidden;
-`;
-const Inner = (0, styled_components_1.default)(framer_motion_1.m.div) ``;
-const PaginationResults = ({ children }) => {
-    return ((0, jsx_runtime_1.jsx)(framer_motion_1.AnimatePresence, { exitBeforeEnter: true, initial: true, children: (0, jsx_runtime_1.jsx)(Root, { children: (0, jsx_runtime_1.jsx)(Inner, { initial: { opacity: 0, x: -100 }, animate: { opacity: 1, x: 0 }, exit: { opacity: 0, x: 100 }, transition: { type: "linear", staggerChildren: 0.3 }, children: children }) }) }));
-};
-exports.PaginationResults = PaginationResults;

package/node/Pagination/index.js

@@ -1,5 +0,0 @@
-"use strict";
-Object.defineProperty(exports, "__esModule", { value: true });
-const tslib_1 = require("tslib");
-tslib_1.__exportStar(require("./PaginationNav"), exports);
-tslib_1.__exportStar(require("./PaginationResults"), exports);

package/node/Pill/Pill.js

@@ -1,41 +0,0 @@
-"use strict";
-Object.defineProperty(exports, "__esModule", { value: true });
-exports.PillAccentLightOutlined = exports.PillAccentLight = exports.PillGreyLight = exports.Pill = void 0;
-const tslib_1 = require("tslib");
-const styled_components_1 = tslib_1.__importDefault(require("styled-components"));
-exports.Pill = styled_components_1.default.div `
-  display: inline-block;
-  padding: 5px 10px;
-  margin: 0 0.5em 0.5em 0;
-  border-radius: 2px;
-  text-decoration: none;
-  font-size: 13px;
-  font-weight: 600;
-`;
-exports.PillGreyLight = (0, styled_components_1.default)(exports.Pill) `
-  background: var(--grey800);
-  color: var(--grey100);
-
-  &:hover {
-    color: white;
-    background: var(--grey300);
-  }
-`;
-exports.PillAccentLight = (0, styled_components_1.default)(exports.Pill) `
-  background: var(--accent400);
-  color: var(--grey100);
-
-  &:hover {
-    color: #fff;
-    background: var(--accent300);
-  }
-`;
-exports.PillAccentLightOutlined = (0, styled_components_1.default)(exports.Pill) `
-  border: 1px solid var(--accent300);
-  color: var(--accent200);
-
-  &:hover {
-    color: #fff;
-    background: var(--accent300);
-  }
-`;

package/node/Pill/index.js

@@ -1,4 +0,0 @@
-"use strict";
-Object.defineProperty(exports, "__esModule", { value: true });
-const tslib_1 = require("tslib");
-tslib_1.__exportStar(require("./Pill"), exports);

package/node/Progress/ProgressCircular.js

@@ -1,41 +0,0 @@
-"use strict";
-Object.defineProperty(exports, "__esModule", { value: true });
-exports.ProgressCircular = void 0;
-const tslib_1 = require("tslib");
-const jsx_runtime_1 = require("react/jsx-runtime");
-const styled_components_1 = tslib_1.__importStar(require("styled-components"));
-const animationRotation = (0, styled_components_1.keyframes) `
-  0% {
-    transform: rotate(0deg);
-  }
-  100% {
-    transform: rotate(360deg);
-  }
-`;
-const animationCircle = (0, styled_components_1.keyframes) `
-  0% {
-    stroke-dasharray: 1px, 200px;
-    stroke-dashoffset: 0;
-  }
-  50% {
-    stroke-dasharray: 100px, 200px;
-    stroke-dashoffset: -15px;
-  }
-  100% {
-    stroke-dasharray: 100px, 200px;
-    stroke-dashoffset: -125px;
-  }
-`;
-const ProgressCircularSvg = styled_components_1.default.svg `
-  animation: ${animationRotation} 1.5s linear infinite;
-`;
-const ProgressCircularCircle = styled_components_1.default.circle `
-  animation: ${animationCircle} 1.5s linear infinite;
-`;
-/**
- * @see https://mui.com/components/progress/
- */
-const ProgressCircular = ({ size = "1em", thickness = 1, color = "currentColor", ...props }) => {
-    return ((0, jsx_runtime_1.jsx)(ProgressCircularSvg, { xmlns: "http://www.w3.org/2000/svg", viewBox: "0 0 44 44", style: { width: size, height: size }, ...props, children: (0, jsx_runtime_1.jsx)(ProgressCircularCircle, { cx: "22", cy: "22", r: "20", fill: "none", strokeWidth: thickness, style: { stroke: color } }) }));
-};
-exports.ProgressCircular = ProgressCircular;

package/node/Progress/ProgressLinear.js

@@ -1,37 +0,0 @@
-"use strict";
-Object.defineProperty(exports, "__esModule", { value: true });
-exports.ProgressLinear = void 0;
-const tslib_1 = require("tslib");
-const jsx_runtime_1 = require("react/jsx-runtime");
-const styled_components_1 = tslib_1.__importDefault(require("styled-components"));
-const framer_motion_1 = require("framer-motion");
-const ProgressLinearBg = styled_components_1.default.span `
-  position: relative;
-  overflow: hidden;
-  display: block;
-  height: 4px;
-`;
-const ProgressLinearFg = (0, styled_components_1.default)(framer_motion_1.m.span) `
-  position: absolute;
-  top: 0;
-  bottom: 0;
-  left: 0;
-  width: 100%;
-`;
-/**
- * @see https://mui.com/components/progress/#linear
- */
-const ProgressLinear = ({ done = false, height = "2px", bg = "transparent", fg = "currentColor", ...props }) => {
-    return ((0, jsx_runtime_1.jsx)(ProgressLinearBg, { style: { height, background: bg }, ...props, children: (0, jsx_runtime_1.jsx)(ProgressLinearFg, { style: { height, background: fg }, initial: {
-                x: "-100%",
-            }, animate: {
-                x: done ? "-100%" : "0%",
-            }, transition: done
-                ? {}
-                : {
-                    repeat: Infinity,
-                    repeatType: "reverse",
-                    duration: 2,
-                } }) }));
-};
-exports.ProgressLinear = ProgressLinear;