@koine/react 2.0.0-beta.10 → 2.0.0-beta.11

package/Autocomplete/components.js

@@ -1,132 +0,0 @@
-"use strict";
-Object.defineProperty(exports, "__esModule", {
-    value: true
-});
-function _export(target, all) {
-    for(var name in all)Object.defineProperty(target, name, {
-        enumerable: true,
-        get: all[name]
-    });
-}
-_export(exports, {
-    AutocompleteRoot: function() {
-        return AutocompleteRoot;
-    },
-    AutocompleteLabel: function() {
-        return AutocompleteLabel;
-    },
-    AutocompleteWrap: function() {
-        return AutocompleteWrap;
-    },
-    AutocompleteInner: function() {
-        return AutocompleteInner;
-    },
-    AutocompleteItem: function() {
-        return AutocompleteItem;
-    },
-    AutocompleteItemLabel: function() {
-        return AutocompleteItemLabel;
-    },
-    AutocompleteItemRemove: function() {
-        return AutocompleteItemRemove;
-    },
-    AutocompleteInputWrap: function() {
-        return AutocompleteInputWrap;
-    },
-    AutocompleteInput: function() {
-        return AutocompleteInput;
-    },
-    AutocompleteInputArrow: function() {
-        return AutocompleteInputArrow;
-    },
-    AutocompleteMenu: function() {
-        return AutocompleteMenu;
-    },
-    AutocompleteMenuItem: function() {
-        return AutocompleteMenuItem;
-    }
-});
-const _interop_require_default = require("@swc/helpers/_/_interop_require_default");
-const _styledcomponents = /*#__PURE__*/ _interop_require_default._(require("styled-components"));
-const _Buttons = require("../Buttons");
-const _Input = require("../Forms/Input/Input");
-const _Label = require("../Forms/Label/Label");
-const _styles = require("../Forms/styles");
-const _Menu = require("../Menu/Menu");
-const _MenuItem = require("../MenuItem/MenuItem");
-const _components = require("../Select/components");
-const _styled = require("../styles/styled");
-const AUTOCOMPLETE_ITEM_GUTTER = 3;
-/**
- * Space between one selected item and the other
- */ const AUTOCOMPLETE_ITEM_SPACER = 6;
-const AUTOCOMPLETE_ITEM_REMOVE_WIDTH = 20;
-const AutocompleteRoot = _styledcomponents.default.div`
-  position: relative;
-`;
-const AutocompleteLabel = (0, _styledcomponents.default)(_Label.Label)``;
-const AutocompleteWrap = (0, _styledcomponents.default)(_Input.InputWrap)`
-  ${_styles.inputReset}
-`;
-const AutocompleteInner = (0, _styledcomponents.default)(_Input.InputMain)`
-  display: inline-flex;
-  flex-wrap: wrap;
-  margin: -${AUTOCOMPLETE_ITEM_SPACER}px;
-  margin-right: 0;
-`;
-const AutocompleteItem = _styledcomponents.default.span`
-  position: relative;
-  display: inline-flex;
-  margin: ${AUTOCOMPLETE_ITEM_GUTTER}px;
-  max-width: calc(100% - 6px);
-  user-select: none;
-  align-items: center;
-  padding: 0 ${AUTOCOMPLETE_ITEM_REMOVE_WIDTH}px 0 ${AUTOCOMPLETE_ITEM_GUTTER}px;
-  font-size: 80%;
-  background: var(--accent400);
-
-  &:hover {
-    background: var(--accent300);
-    color: white;
-  }
-
-  &:focus {
-    outline: 0px;
-    background: var(--grey700);
-  }
-`;
-const AutocompleteItemLabel = _styledcomponents.default.span`
-  padding: 0 ${AUTOCOMPLETE_ITEM_GUTTER}px;
-  ${_styled.ellipsis}
-`;
-const AutocompleteItemRemove = _styledcomponents.default.span`
-  ${_Buttons.btnStyleReset}
-  position: absolute;
-  top: 0;
-  right: 0;
-  width: ${AUTOCOMPLETE_ITEM_REMOVE_WIDTH}px;
-  border: 0;
-  height: 100%;
-  color: inherit;
-  line-height: 1;
-`;
-const AutocompleteInputWrap = _styledcomponents.default.div`
-  display: flex;
-  flex: 1;
-`;
-const AutocompleteInput = _styledcomponents.default.input`
-  flex-grow: 1;
-  width: 0;
-  min-width: 30px;
-  border: 0;
-  padding: 0 ${AUTOCOMPLETE_ITEM_SPACER}px;
-  text-overflow: ellipsis;
-  background: transparent;
-
-  &:focus {
-    outline: none;
-  }
-`;
-const AutocompleteInputArrow = (0, _styledcomponents.default)(_components.SelectArrow)``;
-const AutocompleteMenu = (0, _styledcomponents.default)(_Menu.Menu)``;
-const AutocompleteMenuItem = (0, _styledcomponents.default)(_MenuItem.MenuItem)``;

package/Autocomplete/helpers.js

@@ -1,34 +0,0 @@
-"use strict";
-Object.defineProperty(exports, "__esModule", {
-    value: true
-});
-Object.defineProperty(exports, "normaliseAutocompleteValue", {
-    enumerable: true,
-    get: function() {
-        return normaliseAutocompleteValue;
-    }
-});
-const _interop_require_default = require("@swc/helpers/_/_interop_require_default");
-const _isArray = /*#__PURE__*/ _interop_require_default._(require("@koine/utils/isArray"));
-const _isString = /*#__PURE__*/ _interop_require_default._(require("@koine/utils/isString"));
-function normaliseAutocompleteValue(value, asArray) {
-    if (!value) {
-        return asArray ? [
-            ""
-        ] : "";
-    }
-    if ((0, _isString.default)(value)) {
-        return asArray ? [
-            value
-        ] : value;
-    }
-    if ((0, _isArray.default)(value)) {
-        const values = value.map((valueItem)=>{
-            return (0, _isString.default)(valueItem) ? valueItem : valueItem.value;
-        });
-        return asArray ? values : values.join(",");
-    }
-    return asArray ? [
-        value.value
-    ] : value.value;
-}

package/Autocomplete/index.js

@@ -1,15 +0,0 @@
-// export type { AutocompleteProps } from "./AutocompleteDownshift";
-// export { Autocomplete } from "./AutocompleteDownshift";
-"use strict";
-Object.defineProperty(exports, "__esModule", {
-    value: true
-});
-Object.defineProperty(exports, "Autocomplete", {
-    enumerable: true,
-    get: function() {
-        return _AutocompleteMui.Autocomplete;
-    }
-});
-const _AutocompleteMui = require("./AutocompleteMui");
- // export type { AutocompleteProps } from "./AutocompleteReach";
- // export { Autocomplete } from "./AutocompleteReach";

package/Bg/BgColor.js

@@ -1,64 +0,0 @@
-"use strict";
-Object.defineProperty(exports, "__esModule", {
-    value: true
-});
-function _export(target, all) {
-    for(var name in all)Object.defineProperty(target, name, {
-        enumerable: true,
-        get: all[name]
-    });
-}
-_export(exports, {
-    BgColor: function() {
-        return BgColor;
-    },
-    BgColorSkewed: function() {
-        return BgColorSkewed;
-    },
-    BgContainer: function() {
-        return BgContainer;
-    }
-});
-const _interop_require_default = require("@swc/helpers/_/_interop_require_default");
-const _jsxruntime = require("react/jsx-runtime");
-const _styledcomponents = /*#__PURE__*/ _interop_require_default._(require("styled-components"));
-const _Grid = require("../Grid");
-const _styles = require("../styles");
-const BgColor = _styledcomponents.default.div`
-  background: ${(p)=>p.$bg};
-`;
-const BgColorSkewed = _styledcomponents.default.div`
-  position: relative;
-  /* overflow: hidden; */
-
-  &:before {
-    z-index: -1;
-    content: "";
-    ${(p)=>`
-      ${_styles.overlay}
-      transform: ${p.$transform};
-      background: ${p.$bg};
-    `}
-  }
-`;
-const BgContainer = ({ color, skewY = 0, rotate = 0, scaleY = 1, scaleX = 1, perspective = 0, ...containerProps })=>{
-    let $transform = "";
-    if (skewY || rotate) {
-        $transform = `perspective(${perspective}vw) rotateY(${rotate}deg) skewY(${skewY}deg) scaleY(${scaleY}) scaleX(${scaleX})`;
-    }
-    return $transform ? /*#__PURE__*/ (0, _jsxruntime.jsx)(BgColorSkewed, {
-        $bg: color,
-        $transform: $transform,
-        children: /*#__PURE__*/ (0, _jsxruntime.jsx)(_Grid.Container, {
-            style: {
-                position: "relative"
-            },
-            ...containerProps
-        })
-    }) : /*#__PURE__*/ (0, _jsxruntime.jsx)(BgColor, {
-        $bg: color,
-        children: /*#__PURE__*/ (0, _jsxruntime.jsx)(_Grid.Container, {
-            ...containerProps
-        })
-    });
-};

package/Bg/BgPhoto.js

@@ -1,82 +0,0 @@
-"use strict";
-Object.defineProperty(exports, "__esModule", {
-    value: true
-});
-Object.defineProperty(exports, "BgPhoto", {
-    enumerable: true,
-    get: function() {
-        return BgPhoto;
-    }
-});
-const _interop_require_default = require("@swc/helpers/_/_interop_require_default");
-const _jsxruntime = require("react/jsx-runtime");
-const _styledcomponents = /*#__PURE__*/ _interop_require_default._(require("styled-components"));
-const _Grid = require("../Grid");
-const _Hidden = require("../Hidden");
-const BgPhotoWrap = (0, _styledcomponents.default)(_Hidden.Hidden)`
-  z-index: -10;
-  position: fixed;
-  top: 0;
-  right: 0;
-  bottom: 0;
-  left: 0;
-  overflow: hidden;
-  pointer-events: none;
-  background-repeat: no-repeat;
-  background-position: top left;
-  background-size: contain;
-  filter: hue-rotate(-36deg);
-  opacity: 0.8;
-`;
-const BgPhotoMask = (0, _styledcomponents.default)(_Grid.Container)`
-  position: relative;
-  min-height: 100%;
-
-  &:before {
-    content: "";
-    position: absolute;
-    top: 0;
-    height: 100%;
-    right: calc(100% - ${(p)=>p.$overlap + 2}px);
-    width: ${(p)=>{
-    const containerSizePx = p.theme.breakpoints[p.containerSize];
-    return `calc(((100vw - ${containerSizePx}px) / 2) + ${p.$overlap + 2}px)`;
-}};
-    background: linear-gradient(
-        90deg,
-        rgba(var(--bodyBg-rgb, 0)) 0%,
-        rgba(var(--bodyBg-rgb, 1)) 100%
-      ),
-      linear-gradient(
-        60deg,
-        rgba(var(--bodyBg-rgb, 0)) 0%,
-        rgba(var(--bodyBg-rgb, 1)) 70%
-      );
-  }
-
-  &:after {
-    content: "";
-    position: absolute;
-    top: 0;
-    height: 100%;
-    left: ${(p)=>p.$overlap + 1}px;
-    width: 100vw;
-    background: var(--bodyBg);
-  }
-`;
-const BgPhoto = ({ src, containerSize = "xl", $overlap = 0 })=>{
-    const styledProps = {
-        containerSize,
-        $overlap
-    };
-    return /*#__PURE__*/ (0, _jsxruntime.jsx)(BgPhotoWrap, {
-        style: {
-            backgroundImage: `url(${src})`
-        },
-        $max: "xxl",
-        children: /*#__PURE__*/ (0, _jsxruntime.jsx)(BgPhotoMask, {
-            size: containerSize,
-            ...styledProps
-        })
-    });
-};

package/Bg/BgSvg.js

@@ -1,31 +0,0 @@
-"use strict";
-Object.defineProperty(exports, "__esModule", {
-    value: true
-});
-Object.defineProperty(exports, "BgSvg", {
-    enumerable: true,
-    get: function() {
-        return BgSvg;
-    }
-});
-const _interop_require_default = require("@swc/helpers/_/_interop_require_default");
-const _jsxruntime = require("react/jsx-runtime");
-const _styledcomponents = /*#__PURE__*/ _interop_require_default._(require("styled-components"));
-const Root = _styledcomponents.default.svg`
-  position: fixed;
-  z-index: -2;
-  bottom: 0;
-  transform: rotate(180deg);
-  opacity: 0.9;
-`;
-const BgSvg = ({ color })=>{
-    return /*#__PURE__*/ (0, _jsxruntime.jsx)(Root, {
-        xmlns: "http://www.w3.org/2000/svg",
-        viewBox: "0 0 1200 120",
-        preserveAspectRatio: "none",
-        children: /*#__PURE__*/ (0, _jsxruntime.jsx)("path", {
-            d: "M1200 0L0 0 598.97 114.72 1200 0z",
-            fill: color
-        })
-    });
-};

package/Bg/index.js

@@ -1,8 +0,0 @@
-"use strict";
-Object.defineProperty(exports, "__esModule", {
-    value: true
-});
-const _export_star = require("@swc/helpers/_/_export_star");
-_export_star._(require("./BgColor"), exports);
-_export_star._(require("./BgPhoto"), exports);
-_export_star._(require("./BgSvg"), exports);

package/Breadcrumbs/Breadcrumbs.js

@@ -1,103 +0,0 @@
-"use strict";
-Object.defineProperty(exports, "__esModule", {
-    value: true
-});
-Object.defineProperty(exports, "KoineBreadcrumbs", {
-    enumerable: true,
-    get: function() {
-        return KoineBreadcrumbs;
-    }
-});
-const _interop_require_default = require("@swc/helpers/_/_interop_require_default");
-const _interop_require_wildcard = require("@swc/helpers/_/_interop_require_wildcard");
-const _jsxruntime = require("react/jsx-runtime");
-const _framermotion = require("framer-motion");
-const _md = require("react-icons/md");
-const _styledcomponents = /*#__PURE__*/ _interop_require_wildcard._(require("styled-components"));
-const _titleCase = /*#__PURE__*/ _interop_require_default._(require("@koine/utils/titleCase"));
-const _media = require("../styles/media");
-const LINK_GUTTER_X = 10;
-const Root = _styledcomponents.default.nav`
-  display: flex;
-  position: relative;
-`;
-const Inner = _styledcomponents.default.div`
-  display: flex;
-  font-size: 11px;
-  color: var(--grey100);
-  ${_media.min.sm} {
-    font-size: 12px;
-  }
-  ${_media.max.lg} {
-    max-width: 100%;
-    overflow: hidden;
-    white-space: nowrap;
-  }
-`;
-const Item = (0, _styledcomponents.default)(_framermotion.m.div)`
-  display: flex;
-  align-items: center;
-  /* margin: 0 10px 0 0; */
-
-  &:first-child {
-    margin-left: -${LINK_GUTTER_X / 2}px;
-  }
-  ${_media.min.sm} {
-    &:first-child {
-      margin-left: -${LINK_GUTTER_X}px;
-    }
-  }
-`;
-const itemChild = (0, _styledcomponents.css)`
-  display: block;
-  padding: 10px ${LINK_GUTTER_X / 2}px;
-
-  ${_media.min.sm} {
-    padding: 10px ${LINK_GUTTER_X}px;
-  }
-`;
-const ItemLink = _styledcomponents.default.a`
-  ${itemChild}
-  text-decoration: none;
-  &:hover {
-    text-decoration: underline;
-  }
-`;
-const ItemCurrent = _styledcomponents.default.span`
-  ${itemChild}
-`;
-const ItemSeparator = (0, _styledcomponents.default)(_md.MdKeyboardArrowRight)``;
-const KoineBreadcrumbs = ({ items = [], Link, ...props })=>{
-    if (!items.length) {
-        return null;
-    }
-    return /*#__PURE__*/ (0, _jsxruntime.jsx)(Root, {
-        ...props,
-        children: /*#__PURE__*/ (0, _jsxruntime.jsx)(Inner, {
-            children: items.map((item, idx)=>/*#__PURE__*/ (0, _jsxruntime.jsxs)(Item, {
-                    initial: {
-                        opacity: 0,
-                        x: 20
-                    },
-                    animate: {
-                        opacity: 1,
-                        x: 0,
-                        transition: {
-                            delay: idx * 0.2
-                        }
-                    },
-                    children: [
-                        item.url && /*#__PURE__*/ (0, _jsxruntime.jsx)(ItemLink, {
-                            as: Link,
-                            href: item.url,
-                            children: (0, _titleCase.default)(item.title)
-                        }),
-                        !item.url && /*#__PURE__*/ (0, _jsxruntime.jsx)(ItemCurrent, {
-                            children: (0, _titleCase.default)(item.title)
-                        }),
-                        idx < items.length - 1 && /*#__PURE__*/ (0, _jsxruntime.jsx)(ItemSeparator, {})
-                    ]
-                }, idx))
-        })
-    });
-};

package/Breadcrumbs/index.js

@@ -1,6 +0,0 @@
-"use strict";
-Object.defineProperty(exports, "__esModule", {
-    value: true
-});
-const _export_star = require("@swc/helpers/_/_export_star");
-_export_star._(require("./Breadcrumbs"), exports);

package/Buttons/Button.js

@@ -1,106 +0,0 @@
-"use strict";
-Object.defineProperty(exports, "__esModule", {
-    value: true
-});
-function _export(target, all) {
-    for(var name in all)Object.defineProperty(target, name, {
-        enumerable: true,
-        get: all[name]
-    });
-}
-_export(exports, {
-    btnStyleUndo: function() {
-        return btnStyleUndo;
-    },
-    btnStyleReset: function() {
-        return btnStyleReset;
-    },
-    btnStyleBase: function() {
-        return btnStyleBase;
-    },
-    btnStyleContained: function() {
-        return btnStyleContained;
-    },
-    btnStyleOutlined: function() {
-        return btnStyleOutlined;
-    },
-    KoineButton: function() {
-        return KoineButton;
-    }
-});
-const _interop_require_wildcard = require("@swc/helpers/_/_interop_require_wildcard");
-const _styledcomponents = /*#__PURE__*/ _interop_require_wildcard._(require("styled-components"));
-const _styled = require("../styles/styled");
-const btnStyleUndo = (0, _styledcomponents.css)`
-  appearance: none;
-  -webkit-appearance: none;
-  -webkit-touch-callout: none;
-  user-select: none;
-  touch-action: manipulation;
-  outline: 0px;
-  color: var(--bodyColor);
-`;
-const btnStyleReset = (0, _styledcomponents.css)`
-  display: inline-flex;
-  align-items: center;
-  justify-content: center;
-  background: transparent;
-  border-width: 1px;
-  border-style: solid;
-  border-color: transparent;
-  cursor: pointer;
-  ${btnStyleUndo}
-
-  &[disabled] {
-    cursor: default;
-    opacity: 0.7;
-  }
-`;
-const btnStyleBase = (0, _styledcomponents.css)`
-  ${btnStyleReset}
-
-  min-width: ${(p)=>p.$noGutter ? "0" : "150px"};
-  padding: ${(p)=>p.$noGutter ? "0" : "10px 30px"};
-  border-radius: 0;
-  text-align: center;
-  text-transform: uppercase;
-  font-weight: 600;
-  ${(p)=>p.$block && `width: 100%; display: flex;`}
-
-  &:focus,
-  &:active,
-  &:visited {
-    ${_styled.stateFocus}
-  }
-
-  /* This targets icons within a button */
-  & svg {
-    margin: 0 1em 0 0;
-    font-size: 1.25em;
-  }
-`;
-const btnStyleContained = (0, _styledcomponents.css)`
-  color: white;
-  background: var(--accent200);
-  border-color: var(--accent200);
-
-  &:hover:not([disabled]) {
-    background: var(--accent300);
-    border-color: var(--accent300);
-  }
-`;
-const btnStyleOutlined = (0, _styledcomponents.css)`
-  color: var(--accent200);
-  border-color: var(--accent200);
-
-  &:hover:not([disabled]) {
-    background: var(--accent300);
-    border-color: var(--accent300);
-    color: white;
-  }
-`;
-const KoineButton = _styledcomponents.default.button`
-  ${btnStyleBase}
-  ${(p)=>p.$variant === "outlined" && btnStyleOutlined}
-  ${(p)=>p.$variant === "contained" && btnStyleContained}
-`;