@bolio-ui/core 2.0.0-alpha.1 → 2.0.0-alpha.2

package/esm/Image/ImageBrowser.js

@@ -1,80 +0,0 @@
-import _objectWithoutProperties from "@babel/runtime/helpers/esm/objectWithoutProperties";
-import _extends from "@babel/runtime/helpers/esm/extends";
-var _excluded = ["url", "title", "children", "showFullLink", "invert", "anchorProps", "className"];
-import _JSXStyle from "styled-jsx/style";
-import React, { useMemo } from 'react';
-import Link from '../Link';
-import useTheme from '../use-theme';
-import ImageBrowserHttpsIcon from './ImageBrowserHttpsIcon';
-import { getBrowserColors } from './styles';
-import { getHostFromUrl } from './helpers';
-import useScale, { withScale } from '../use-scale';
-import useClasses from '../use-classes';
-var getTitle = function getTitle(title, colors) {
-  return /*#__PURE__*/React.createElement("div", {
-    className: _JSXStyle.dynamic([["524099755", [colors.titleColor]]]) + " " + "title"
-  }, title, /*#__PURE__*/React.createElement(_JSXStyle, {
-    id: "524099755",
-    dynamic: [colors.titleColor]
-  }, ".title.__jsx-style-dynamic-selector{color:".concat(colors.titleColor, ";font-size:0.75em;}")));
-};
-var getAddressInput = function getAddressInput(url, showFullLink, colors, anchorProps) {
-  return /*#__PURE__*/React.createElement("div", {
-    className: _JSXStyle.dynamic([["3718009574", [colors.inputBgColor]]]) + " " + "address-input"
-  }, /*#__PURE__*/React.createElement("span", {
-    className: _JSXStyle.dynamic([["3718009574", [colors.inputBgColor]]]) + " " + "https"
-  }, /*#__PURE__*/React.createElement(ImageBrowserHttpsIcon, null)), /*#__PURE__*/React.createElement(Link, _extends({
-    href: url,
-    title: url,
-    target: "_blank"
-  }, anchorProps), showFullLink ? url : getHostFromUrl(url)), /*#__PURE__*/React.createElement(_JSXStyle, {
-    id: "3718009574",
-    dynamic: [colors.inputBgColor]
-  }, ".address-input.__jsx-style-dynamic-selector{height:1.75em;max-width:60%;min-width:40%;background-color:".concat(colors.inputBgColor, ";color:inherit;border-radius:3px;display:-webkit-box;display:-webkit-flex;display:-ms-flexbox;display:flex;-webkit-align-items:center;-webkit-box-align:center;-ms-flex-align:center;align-items:center;-webkit-box-pack:center;-webkit-justify-content:center;-ms-flex-pack:center;justify-content:center;padding:0 10px;overflow:hidden;position:relative;}.address-input.__jsx-style-dynamic-selector *{font-size:0.75em;color:inherit;}.address-input.__jsx-style-dynamic-selector a{max-width:90%;overflow:hidden;white-space:nowrap;text-overflow:ellipsis;display:inline-block;color:inherit;}.https.__jsx-style-dynamic-selector{width:0.75em;height:0.75em;font-size:1em;margin-right:0.31em;-webkit-user-select:none;-moz-user-select:none;-ms-user-select:none;user-select:none;margin-top:-1px;color:inherit;display:-webkit-inline-box;display:-webkit-inline-flex;display:-ms-inline-flexbox;display:inline-flex;-webkit-align-items:center;-webkit-box-align:center;-ms-flex-align:center;align-items:center;}")));
-};
-var ImageBrowserComponent = /*#__PURE__*/React.forwardRef(function (_ref, ref) {
-  var url = _ref.url,
-    title = _ref.title,
-    children = _ref.children,
-    _ref$showFullLink = _ref.showFullLink,
-    showFullLink = _ref$showFullLink === void 0 ? false : _ref$showFullLink,
-    _ref$invert = _ref.invert,
-    invert = _ref$invert === void 0 ? false : _ref$invert,
-    _ref$anchorProps = _ref.anchorProps,
-    anchorProps = _ref$anchorProps === void 0 ? {} : _ref$anchorProps,
-    _ref$className = _ref.className,
-    className = _ref$className === void 0 ? '' : _ref$className,
-    props = _objectWithoutProperties(_ref, _excluded);
-  var theme = useTheme();
-  var _useScale = useScale(),
-    SCALES = _useScale.SCALES;
-  var colors = useMemo(function () {
-    return getBrowserColors(invert, theme.palette);
-  }, [invert, theme.palette]);
-  var input = useMemo(function () {
-    if (url) return getAddressInput(url, showFullLink, colors, anchorProps);
-    if (title) return getTitle(title, colors);
-    return null;
-  }, [url, showFullLink, title, colors, anchorProps]);
-  return /*#__PURE__*/React.createElement("div", _extends({
-    ref: ref
-  }, props, {
-    className: _JSXStyle.dynamic([["2129234839", [theme.expressiveness.shadowLarge, theme.layout.radius, SCALES.font(1), SCALES.width(1, 'max-content'), SCALES.height(1, 'auto'), SCALES.mt(0), SCALES.mr(0, 'auto'), SCALES.mb(0), SCALES.ml(0, 'auto'), SCALES.pt(0), SCALES.pr(0), SCALES.pb(0), SCALES.pl(0), colors.color, colors.barBgColor, colors.borderColor, theme.layout.gapHalf]]]) + " " + (props && props.className != null && props.className || useClasses('browser', className) || "")
-  }), /*#__PURE__*/React.createElement("header", {
-    className: _JSXStyle.dynamic([["2129234839", [theme.expressiveness.shadowLarge, theme.layout.radius, SCALES.font(1), SCALES.width(1, 'max-content'), SCALES.height(1, 'auto'), SCALES.mt(0), SCALES.mr(0, 'auto'), SCALES.mb(0), SCALES.ml(0, 'auto'), SCALES.pt(0), SCALES.pr(0), SCALES.pb(0), SCALES.pl(0), colors.color, colors.barBgColor, colors.borderColor, theme.layout.gapHalf]]])
-  }, /*#__PURE__*/React.createElement("div", {
-    className: _JSXStyle.dynamic([["2129234839", [theme.expressiveness.shadowLarge, theme.layout.radius, SCALES.font(1), SCALES.width(1, 'max-content'), SCALES.height(1, 'auto'), SCALES.mt(0), SCALES.mr(0, 'auto'), SCALES.mb(0), SCALES.ml(0, 'auto'), SCALES.pt(0), SCALES.pr(0), SCALES.pb(0), SCALES.pl(0), colors.color, colors.barBgColor, colors.borderColor, theme.layout.gapHalf]]]) + " " + "traffic"
-  }, /*#__PURE__*/React.createElement("span", {
-    className: _JSXStyle.dynamic([["2129234839", [theme.expressiveness.shadowLarge, theme.layout.radius, SCALES.font(1), SCALES.width(1, 'max-content'), SCALES.height(1, 'auto'), SCALES.mt(0), SCALES.mr(0, 'auto'), SCALES.mb(0), SCALES.ml(0, 'auto'), SCALES.pt(0), SCALES.pr(0), SCALES.pb(0), SCALES.pl(0), colors.color, colors.barBgColor, colors.borderColor, theme.layout.gapHalf]]]) + " " + "close"
-  }), /*#__PURE__*/React.createElement("span", {
-    className: _JSXStyle.dynamic([["2129234839", [theme.expressiveness.shadowLarge, theme.layout.radius, SCALES.font(1), SCALES.width(1, 'max-content'), SCALES.height(1, 'auto'), SCALES.mt(0), SCALES.mr(0, 'auto'), SCALES.mb(0), SCALES.ml(0, 'auto'), SCALES.pt(0), SCALES.pr(0), SCALES.pb(0), SCALES.pl(0), colors.color, colors.barBgColor, colors.borderColor, theme.layout.gapHalf]]]) + " " + "mini"
-  }), /*#__PURE__*/React.createElement("span", {
-    className: _JSXStyle.dynamic([["2129234839", [theme.expressiveness.shadowLarge, theme.layout.radius, SCALES.font(1), SCALES.width(1, 'max-content'), SCALES.height(1, 'auto'), SCALES.mt(0), SCALES.mr(0, 'auto'), SCALES.mb(0), SCALES.ml(0, 'auto'), SCALES.pt(0), SCALES.pr(0), SCALES.pb(0), SCALES.pl(0), colors.color, colors.barBgColor, colors.borderColor, theme.layout.gapHalf]]]) + " " + "full"
-  })), input), children, /*#__PURE__*/React.createElement(_JSXStyle, {
-    id: "2129234839",
-    dynamic: [theme.expressiveness.shadowLarge, theme.layout.radius, SCALES.font(1), SCALES.width(1, 'max-content'), SCALES.height(1, 'auto'), SCALES.mt(0), SCALES.mr(0, 'auto'), SCALES.mb(0), SCALES.ml(0, 'auto'), SCALES.pt(0), SCALES.pr(0), SCALES.pb(0), SCALES.pl(0), colors.color, colors.barBgColor, colors.borderColor, theme.layout.gapHalf]
-  }, ".browser.__jsx-style-dynamic-selector{background-color:transparent;box-shadow:".concat(theme.expressiveness.shadowLarge, ";max-width:100%;border-radius:").concat(theme.layout.radius, ";overflow:hidden;font-size:").concat(SCALES.font(1), ";width:").concat(SCALES.width(1, 'max-content'), ";height:").concat(SCALES.height(1, 'auto'), ";margin:").concat(SCALES.mt(0), " ").concat(SCALES.mr(0, 'auto'), " ").concat(SCALES.mb(0), " ").concat(SCALES.ml(0, 'auto'), ";padding:").concat(SCALES.pt(0), " ").concat(SCALES.pr(0), " ").concat(SCALES.pb(0), " ").concat(SCALES.pl(0), ";}.browser.__jsx-style-dynamic-selector .image{border-top-left-radius:0;border-top-right-radius:0;}header.__jsx-style-dynamic-selector{height:2.5em;width:100%;display:-webkit-box;display:-webkit-flex;display:-ms-flexbox;display:flex;-webkit-align-items:center;-webkit-box-align:center;-ms-flex-align:center;align-items:center;-webkit-box-pack:center;-webkit-justify-content:center;-ms-flex-pack:center;justify-content:center;position:relative;color:").concat(colors.color, ";background-color:").concat(colors.barBgColor, ";border-bottom:1px solid ").concat(colors.borderColor, ";}.traffic.__jsx-style-dynamic-selector{width:auto;position:absolute;left:").concat(theme.layout.gapHalf, ";top:50%;-webkit-transform:translateY(-50%);-ms-transform:translateY(-50%);transform:translateY(-50%);bottom:0;height:100%;display:-webkit-box;display:-webkit-flex;display:-ms-flexbox;display:flex;-webkit-align-items:center;-webkit-box-align:center;-ms-flex-align:center;align-items:center;-webkit-user-select:none;-moz-user-select:none;-ms-user-select:none;user-select:none;font-size:inherit;}.traffic.__jsx-style-dynamic-selector span.__jsx-style-dynamic-selector{border-radius:50%;width:0.75em;height:0.75em;max-width:20px;max-height:20px;display:inline-block;margin-right:0.5em;}.close.__jsx-style-dynamic-selector{background-color:#ff5f56;}.mini.__jsx-style-dynamic-selector{background-color:#ffbd2e;}.full.__jsx-style-dynamic-selector{background-color:#27c93f;}")));
-});
-ImageBrowserComponent.displayName = 'BolioUIImageBrowser';
-var ImageBrowser = withScale(ImageBrowserComponent);
-export default ImageBrowser;

package/esm/Image/ImageBrowserHttpsIcon.js

@@ -1,21 +0,0 @@
-import _JSXStyle from "styled-jsx/style";
-import React from 'react';
-var ImageBrowserHttpsIcon = function ImageBrowserHttpsIcon() {
-  return /*#__PURE__*/React.createElement("svg", {
-    viewBox: "0 0 24 24",
-    fill: "currentColor",
-    className: "jsx-4165143638"
-  }, /*#__PURE__*/React.createElement("path", {
-    d: "M5 10.2H19V21H5V10.2Z",
-    className: "jsx-4165143638"
-  }), /*#__PURE__*/React.createElement("path", {
-    fillRule: "evenodd",
-    clipRule: "evenodd",
-    d: "M12 12C13.933 12 15.5 10.3882 15.5 8.4C15.5 6.41177 13.933 4.8 12 4.8C10.067 4.8 8.5 6.41177 8.5 8.4C8.5 10.3882 10.067 12 12 12ZM12 13.8C14.8995 13.8 17.25 11.3823 17.25 8.4C17.25 5.41766 14.8995 3 12 3C9.10051 3 6.75 5.41766 6.75 8.4C6.75 11.3823 9.10051 13.8 12 13.8Z",
-    className: "jsx-4165143638"
-  }), /*#__PURE__*/React.createElement(_JSXStyle, {
-    id: "4165143638"
-  }, "svg.jsx-4165143638{width:1em;height:1em;}"));
-};
-var MemoImageBrowserHttpsIcon = /*#__PURE__*/React.memo(ImageBrowserHttpsIcon);
-export default MemoImageBrowserHttpsIcon;

package/esm/Image/ImageSkeleton.js

@@ -1,20 +0,0 @@
-import _extends from "@babel/runtime/helpers/esm/extends";
-import _objectWithoutProperties from "@babel/runtime/helpers/esm/objectWithoutProperties";
-var _excluded = ["opacity"];
-import _JSXStyle from "styled-jsx/style";
-import React from 'react';
-import useTheme from '../use-theme';
-var ImageSkeleton = /*#__PURE__*/React.memo(function (_ref) {
-  var _ref$opacity = _ref.opacity,
-    opacity = _ref$opacity === void 0 ? 0.5 : _ref$opacity,
-    props = _objectWithoutProperties(_ref, _excluded);
-  var theme = useTheme();
-  return /*#__PURE__*/React.createElement("div", _extends({}, props, {
-    className: _JSXStyle.dynamic([["2946022605", [theme.palette.accents_1, theme.palette.accents_2, theme.palette.accents_2, theme.palette.accents_1, opacity]]]) + " " + (props && props.className != null && props.className || "skeleton")
-  }), /*#__PURE__*/React.createElement(_JSXStyle, {
-    id: "2946022605",
-    dynamic: [theme.palette.accents_1, theme.palette.accents_2, theme.palette.accents_2, theme.palette.accents_1, opacity]
-  }, ".skeleton.__jsx-style-dynamic-selector{position:absolute;top:0;left:0;right:0;bottom:0;width:100%;height:100%;background-image:linear-gradient( 270deg, ".concat(theme.palette.accents_1, ", ").concat(theme.palette.accents_2, ", ").concat(theme.palette.accents_2, ", ").concat(theme.palette.accents_1, " );background-size:400% 100%;-webkit-animation:loading-__jsx-style-dynamic-selector 3s ease-in-out infinite;animation:loading-__jsx-style-dynamic-selector 3s ease-in-out infinite;opacity:").concat(opacity, ";-webkit-transition:opacity 300ms ease-out;transition:opacity 300ms ease-out;}@-webkit-keyframes loading-__jsx-style-dynamic-selector{0%{background-position:200% 0;}to{background-position:-200% 0;}}@keyframes loading-__jsx-style-dynamic-selector{0%{background-position:200% 0;}to{background-position:-200% 0;}}")));
-});
-ImageSkeleton.displayName = 'BolioUIImageSkeleton';
-export default ImageSkeleton;

package/esm/Image/helpers.js

@@ -1,14 +0,0 @@
-export var transformDataSource = function transformDataSource(src) {
-  var left = "".concat(src).slice(0, 4);
-  if (encodeURIComponent(left) === '%3Csvg') {
-    return "data:image/svg+xml;utf8,".concat(src);
-  }
-  return src;
-};
-export var getHostFromUrl = function getHostFromUrl(url) {
-  try {
-    return new URL(url).host;
-  } catch (e) {
-    return url;
-  }
-};

package/esm/Image/styles.js

@@ -1,15 +0,0 @@
-export var getBrowserColors = function getBrowserColors(invert, palette) {
-  return invert ? {
-    color: palette.background,
-    barBgColor: palette.foreground,
-    inputBgColor: palette.accents_8,
-    borderColor: palette.accents_7,
-    titleColor: palette.accents_2
-  } : {
-    color: palette.foreground,
-    barBgColor: palette.background,
-    inputBgColor: palette.accents_1,
-    borderColor: palette.border,
-    titleColor: palette.accents_5
-  };
-};

package/esm/Input/Input.js

@@ -1,165 +0,0 @@
-import _slicedToArray from "@babel/runtime/helpers/esm/slicedToArray";
-import _objectWithoutProperties from "@babel/runtime/helpers/esm/objectWithoutProperties";
-import _extends from "@babel/runtime/helpers/esm/extends";
-var _excluded = ["label", "labelRight", "type", "htmlType", "icon", "iconRight", "iconClickable", "onIconClick", "initialValue", "onChange", "readOnly", "value", "onClearClick", "clearable", "className", "onBlur", "onFocus", "autoComplete", "placeholder", "children", "disabled", "rounded", "backgroundColor", "borderColor", "hoverBorder", "error", "errorMessage"];
-import _JSXStyle from "styled-jsx/style";
-import React, { useEffect, useImperativeHandle, useMemo, useRef, useState } from 'react';
-import useTheme from '../use-theme';
-import InputLabel from './InputLabel';
-import InputBlockLabel from './InputBlockLabel';
-import InputIcon from './InputIcon';
-import InputClearIcon from './InputIconClear';
-import { getColors } from './styles';
-import { defaultProps } from './InputProps';
-import useScale, { withScale } from '../use-scale';
-import useClasses from '../use-classes';
-var simulateChangeEvent = function simulateChangeEvent(el, event) {
-  return _extends({}, event, {
-    target: el,
-    currentTarget: el
-  });
-};
-var InputComponent = /*#__PURE__*/React.forwardRef(function (_ref, ref) {
-  var label = _ref.label,
-    labelRight = _ref.labelRight,
-    type = _ref.type,
-    htmlType = _ref.htmlType,
-    icon = _ref.icon,
-    iconRight = _ref.iconRight,
-    iconClickable = _ref.iconClickable,
-    onIconClick = _ref.onIconClick,
-    initialValue = _ref.initialValue,
-    onChange = _ref.onChange,
-    readOnly = _ref.readOnly,
-    value = _ref.value,
-    onClearClick = _ref.onClearClick,
-    clearable = _ref.clearable,
-    className = _ref.className,
-    onBlur = _ref.onBlur,
-    onFocus = _ref.onFocus,
-    autoComplete = _ref.autoComplete,
-    placeholder = _ref.placeholder,
-    children = _ref.children,
-    disabled = _ref.disabled,
-    rounded = _ref.rounded,
-    backgroundColor = _ref.backgroundColor,
-    borderColor = _ref.borderColor,
-    hoverBorder = _ref.hoverBorder,
-    error = _ref.error,
-    errorMessage = _ref.errorMessage,
-    props = _objectWithoutProperties(_ref, _excluded);
-  var theme = useTheme();
-  var _useScale = useScale(),
-    SCALES = _useScale.SCALES;
-  var inputRef = useRef(null);
-  useImperativeHandle(ref, function () {
-    return inputRef.current;
-  });
-  var _useState = useState(''),
-    _useState2 = _slicedToArray(_useState, 2),
-    selfValue = _useState2[0],
-    setSelfValue = _useState2[1];
-  var _useState3 = useState(false),
-    _useState4 = _slicedToArray(_useState3, 2),
-    hover = _useState4[0],
-    setHover = _useState4[1];
-  var isControlledComponent = useMemo(function () {
-    return value !== undefined;
-  }, [value]);
-  var labelClasses = useMemo(function () {
-    return labelRight ? 'right-label' : label ? 'left-label' : '';
-  }, [label, labelRight]);
-  var iconClasses = useMemo(function () {
-    return iconRight ? 'right-icon' : icon ? 'left-icon' : '';
-  }, [icon, iconRight]);
-  var colors = useMemo(function () {
-    return getColors(theme.palette, type, disabled);
-  }, [theme.palette, type, disabled]);
-  var changeHandler = function changeHandler(event) {
-    if (disabled || readOnly) return;
-    setSelfValue(event.target.value);
-    onChange && onChange(event);
-  };
-  var clearHandler = function clearHandler(event) {
-    setSelfValue('');
-    onClearClick && onClearClick(event);
-    /* istanbul ignore next */
-    if (!inputRef.current) return;
-    var changeEvent = simulateChangeEvent(inputRef.current, event);
-    changeEvent.target.value = '';
-    onChange && onChange(changeEvent);
-    inputRef.current.focus();
-  };
-  var focusHandler = function focusHandler(e) {
-    setHover(true);
-    onFocus && onFocus(e);
-  };
-  var blurHandler = function blurHandler(e) {
-    setHover(false);
-    onBlur && onBlur(e);
-  };
-  var iconClickHandler = function iconClickHandler(e) {
-    if (disabled) return;
-    onIconClick && onIconClick(e);
-  };
-  var iconProps = useMemo(function () {
-    return {
-      clickable: iconClickable,
-      onClick: iconClickHandler
-    };
-  }, [iconClickable, iconClickHandler]);
-  useEffect(function () {
-    if (isControlledComponent) {
-      setSelfValue(value);
-    }
-  }, [isControlledComponent, value]);
-  var controlledValue = isControlledComponent ? {
-    value: selfValue
-  } : {
-    defaultValue: initialValue
-  };
-  var inputProps = _extends({}, props, controlledValue);
-  return /*#__PURE__*/React.createElement("div", {
-    className: _JSXStyle.dynamic([["2075686027", [SCALES.height(2.25), SCALES.font(0.875), SCALES.width(1, 'initial'), SCALES.pt(0), SCALES.pr(0), SCALES.pb(0), SCALES.pl(0), SCALES.mt(0), SCALES.mr(0), SCALES.mb(0), SCALES.ml(0), SCALES.width(1, 'initial'), rounded ? '25px' : theme.layout.radius, borderColor ? borderColor : colors.borderColor, backgroundColor ? backgroundColor : colors.bgColor, hoverBorder ? hoverBorder : colors.hoverBorder, backgroundColor ? backgroundColor : colors.hoverBgColor, colors.hoverBorder, SCALES.font(0.875), colors.color, theme.palette.accents_3, theme.palette.background, colors.color]]]) + " " + "with-label"
-  }, children && /*#__PURE__*/React.createElement(InputBlockLabel, null, children), /*#__PURE__*/React.createElement("div", {
-    className: _JSXStyle.dynamic([["2075686027", [SCALES.height(2.25), SCALES.font(0.875), SCALES.width(1, 'initial'), SCALES.pt(0), SCALES.pr(0), SCALES.pb(0), SCALES.pl(0), SCALES.mt(0), SCALES.mr(0), SCALES.mb(0), SCALES.ml(0), SCALES.width(1, 'initial'), rounded ? '25px' : theme.layout.radius, borderColor ? borderColor : colors.borderColor, backgroundColor ? backgroundColor : colors.bgColor, hoverBorder ? hoverBorder : colors.hoverBorder, backgroundColor ? backgroundColor : colors.hoverBgColor, colors.hoverBorder, SCALES.font(0.875), colors.color, theme.palette.accents_3, theme.palette.background, colors.color]]]) + " " + (useClasses('input-container', className) || "")
-  }, label && /*#__PURE__*/React.createElement(InputLabel, null, label), /*#__PURE__*/React.createElement("div", {
-    className: _JSXStyle.dynamic([["2075686027", [SCALES.height(2.25), SCALES.font(0.875), SCALES.width(1, 'initial'), SCALES.pt(0), SCALES.pr(0), SCALES.pb(0), SCALES.pl(0), SCALES.mt(0), SCALES.mr(0), SCALES.mb(0), SCALES.ml(0), SCALES.width(1, 'initial'), rounded ? '25px' : theme.layout.radius, borderColor ? borderColor : colors.borderColor, backgroundColor ? backgroundColor : colors.bgColor, hoverBorder ? hoverBorder : colors.hoverBorder, backgroundColor ? backgroundColor : colors.hoverBgColor, colors.hoverBorder, SCALES.font(0.875), colors.color, theme.palette.accents_3, theme.palette.background, colors.color]]]) + " " + (useClasses('input-wrapper', {
-      hover: hover,
-      disabled: disabled
-    }, labelClasses) || "")
-  }, icon && /*#__PURE__*/React.createElement(InputIcon, _extends({
-    icon: icon
-  }, iconProps)), /*#__PURE__*/React.createElement("input", _extends({
-    type: htmlType,
-    ref: inputRef,
-    placeholder: placeholder,
-    disabled: disabled,
-    readOnly: readOnly,
-    onFocus: focusHandler,
-    onBlur: blurHandler,
-    onChange: changeHandler,
-    autoComplete: autoComplete
-  }, inputProps, {
-    className: _JSXStyle.dynamic([["2075686027", [SCALES.height(2.25), SCALES.font(0.875), SCALES.width(1, 'initial'), SCALES.pt(0), SCALES.pr(0), SCALES.pb(0), SCALES.pl(0), SCALES.mt(0), SCALES.mr(0), SCALES.mb(0), SCALES.ml(0), SCALES.width(1, 'initial'), rounded ? '25px' : theme.layout.radius, borderColor ? borderColor : colors.borderColor, backgroundColor ? backgroundColor : colors.bgColor, hoverBorder ? hoverBorder : colors.hoverBorder, backgroundColor ? backgroundColor : colors.hoverBgColor, colors.hoverBorder, SCALES.font(0.875), colors.color, theme.palette.accents_3, theme.palette.background, colors.color]]]) + " " + (inputProps && inputProps.className != null && inputProps.className || useClasses({
-      disabled: disabled
-    }, iconClasses) || "")
-  })), clearable && /*#__PURE__*/React.createElement(InputClearIcon, {
-    visible: Boolean(inputRef.current && inputRef.current.value !== ''),
-    disabled: disabled || readOnly,
-    onClick: clearHandler
-  }), iconRight && /*#__PURE__*/React.createElement(InputIcon, _extends({
-    icon: iconRight
-  }, iconProps))), labelRight && /*#__PURE__*/React.createElement(InputLabel, {
-    isRight: true
-  }, labelRight)), error && /*#__PURE__*/React.createElement(InputBlockLabel, {
-    error: error
-  }, errorMessage), /*#__PURE__*/React.createElement(_JSXStyle, {
-    id: "2075686027",
-    dynamic: [SCALES.height(2.25), SCALES.font(0.875), SCALES.width(1, 'initial'), SCALES.pt(0), SCALES.pr(0), SCALES.pb(0), SCALES.pl(0), SCALES.mt(0), SCALES.mr(0), SCALES.mb(0), SCALES.ml(0), SCALES.width(1, 'initial'), rounded ? '25px' : theme.layout.radius, borderColor ? borderColor : colors.borderColor, backgroundColor ? backgroundColor : colors.bgColor, hoverBorder ? hoverBorder : colors.hoverBorder, backgroundColor ? backgroundColor : colors.hoverBgColor, colors.hoverBorder, SCALES.font(0.875), colors.color, theme.palette.accents_3, theme.palette.background, colors.color]
-  }, ".with-label.__jsx-style-dynamic-selector{display:inline-block;box-sizing:border-box;-webkit-box-align:center;--input-height:".concat(SCALES.height(2.25), ";font-size:").concat(SCALES.font(0.875), ";width:").concat(SCALES.width(1, 'initial'), ";padding:").concat(SCALES.pt(0), " ").concat(SCALES.pr(0), " ").concat(SCALES.pb(0), " ").concat(SCALES.pl(0), ";margin:").concat(SCALES.mt(0), " ").concat(SCALES.mr(0), " ").concat(SCALES.mb(0), " ").concat(SCALES.ml(0), ";}.input-container.__jsx-style-dynamic-selector{display:-webkit-inline-box;display:-webkit-inline-flex;display:-ms-inline-flexbox;display:inline-flex;-webkit-align-items:center;-webkit-box-align:center;-ms-flex-align:center;align-items:center;width:").concat(SCALES.width(1, 'initial'), ";height:var(--input-height);}.input-wrapper.__jsx-style-dynamic-selector{display:-webkit-inline-box;display:-webkit-inline-flex;display:-ms-inline-flexbox;display:inline-flex;vertical-align:middle;-webkit-align-items:center;-webkit-box-align:center;-ms-flex-align:center;align-items:center;height:100%;-webkit-flex:1;-ms-flex:1;flex:1;-webkit-user-select:none;-moz-user-select:none;-ms-user-select:none;user-select:none;border-radius:").concat(rounded ? '25px' : theme.layout.radius, ";border:1px solid ").concat(borderColor ? borderColor : colors.borderColor, ";-webkit-transition:border 0.2s ease 0s,color 0.2s ease 0s;transition:border 0.2s ease 0s,color 0.2s ease 0s;background:").concat(backgroundColor ? backgroundColor : colors.bgColor, ";}.input-wrapper.active.__jsx-style-dynamic-selector,.input-wrapper.__jsx-style-dynamic-selector:hover{border:1px solid ").concat(hoverBorder ? hoverBorder : colors.hoverBorder, ";background:").concat(backgroundColor ? backgroundColor : colors.hoverBgColor, ";}.input-wrapper.left-label.__jsx-style-dynamic-selector{border-top-left-radius:0;border-bottom-left-radius:0;}.input-wrapper.right-label.__jsx-style-dynamic-selector{border-top-right-radius:0;border-bottom-right-radius:0;}.input-wrapper.disabled.__jsx-style-dynamic-selector{cursor:not-allowed;}input.disabled.__jsx-style-dynamic-selector{cursor:not-allowed;}.input-wrapper.hover.__jsx-style-dynamic-selector{border-color:").concat(colors.hoverBorder, ";}input.__jsx-style-dynamic-selector{margin:0.25em 0.625em;padding:0 4px;box-shadow:none;font-size:").concat(SCALES.font(0.875), ";background-color:transparent;border:none;color:").concat(colors.color, ";outline:none;border-radius:0;width:100%;min-width:0;-webkit-appearance:none;}input.left-icon.__jsx-style-dynamic-selector{margin-left:0;}input.right-icon.__jsx-style-dynamic-selector{margin-right:0;}.__jsx-style-dynamic-selector::-webkit-input-placeholder,.__jsx-style-dynamic-selector::-moz-placeholder,.__jsx-style-dynamic-selector:-ms-input-placeholder,.__jsx-style-dynamic-selector::-webkit-input-placeholder{color:").concat(theme.palette.accents_3, ";}.__jsx-style-dynamic-selector::-moz-placeholder,.__jsx-style-dynamic-selector::-moz-placeholder,.__jsx-style-dynamic-selector:-ms-input-placeholder,.__jsx-style-dynamic-selector::-webkit-input-placeholder{color:").concat(theme.palette.accents_3, ";}.__jsx-style-dynamic-selector:-ms-input-placeholder,.__jsx-style-dynamic-selector::-moz-placeholder,.__jsx-style-dynamic-selector:-ms-input-placeholder,.__jsx-style-dynamic-selector::-webkit-input-placeholder{color:").concat(theme.palette.accents_3, ";}.__jsx-style-dynamic-selector::placeholder,.__jsx-style-dynamic-selector::-moz-placeholder,.__jsx-style-dynamic-selector:-ms-input-placeholder,.__jsx-style-dynamic-selector::-webkit-input-placeholder{color:").concat(theme.palette.accents_3, ";}.__jsx-style-dynamic-selector::-ms-reveal{display:none !important;}input.__jsx-style-dynamic-selector:-webkit-autofill,input.__jsx-style-dynamic-selector:-webkit-autofill.__jsx-style-dynamic-selector:hover,input.__jsx-style-dynamic-selector:-webkit-autofill.__jsx-style-dynamic-selector:active,input.__jsx-style-dynamic-selector:-webkit-autofill.__jsx-style-dynamic-selector:focus{-webkit-box-shadow:0 0 0 30px ").concat(theme.palette.background, " inset !important;-webkit-text-fill-color:").concat(colors.color, " !important;}")));
-});
-InputComponent.defaultProps = defaultProps;
-InputComponent.displayName = 'BolioUIInput';
-var Input = withScale(InputComponent);
-export default Input;

package/esm/Input/InputBlockLabel.js

@@ -1,17 +0,0 @@
-import _JSXStyle from "styled-jsx/style";
-import React from 'react';
-import useTheme from '../use-theme';
-function InputBlockLabelComponent(_ref) {
-  var children = _ref.children,
-    error = _ref.error;
-  var theme = useTheme();
-  return /*#__PURE__*/React.createElement("label", {
-    className: _JSXStyle.dynamic([["3520806922", [error ? theme.palette.error : theme.palette.accents_6, error ? 0 : '0.5em', error ? '0.2em' : 0, error ? '0.775rem' : '1em']]])
-  }, children, /*#__PURE__*/React.createElement(_JSXStyle, {
-    id: "3520806922",
-    dynamic: [error ? theme.palette.error : theme.palette.accents_6, error ? 0 : '0.5em', error ? '0.2em' : 0, error ? '0.775rem' : '1em']
-  }, "label.__jsx-style-dynamic-selector{display:block;font-weight:normal;color:".concat(error ? theme.palette.error : theme.palette.accents_6, ";padding:0 0 0 1px;margin-bottom:").concat(error ? 0 : '0.5em', ";margin-top:").concat(error ? '0.2em' : 0, ";font-size:").concat(error ? '0.775rem' : '1em', ";line-height:1.5;}label.__jsx-style-dynamic-selector>*:first-child{margin-top:0;}label.__jsx-style-dynamic-selector>*:last-child{margin-bottom:0;}")));
-}
-InputBlockLabelComponent.displayName = 'BolioUIInputBlockLabel';
-var InputBlockLabel = /*#__PURE__*/React.memo(InputBlockLabelComponent);
-export default InputBlockLabel;

package/esm/Input/InputIcon.js

@@ -1,17 +0,0 @@
-import _JSXStyle from "styled-jsx/style";
-import React from 'react';
-function InputIconComponent(_ref) {
-  var icon = _ref.icon,
-    clickable = _ref.clickable,
-    onClick = _ref.onClick;
-  return /*#__PURE__*/React.createElement("span", {
-    onClick: onClick,
-    className: _JSXStyle.dynamic([["4247656379", [clickable ? 'pointer' : 'default', clickable ? 'auto' : 'none']]]) + " " + "input-icon"
-  }, icon, /*#__PURE__*/React.createElement(_JSXStyle, {
-    id: "4247656379",
-    dynamic: [clickable ? 'pointer' : 'default', clickable ? 'auto' : 'none']
-  }, ".input-icon.__jsx-style-dynamic-selector{box-sizing:border-box;display:-webkit-inline-box;display:-webkit-inline-flex;display:-ms-inline-flexbox;display:inline-flex;width:calc(var(--input-height) - 2px);-webkit-flex-shrink:0;-ms-flex-negative:0;flex-shrink:0;height:100%;-webkit-align-items:center;-webkit-box-align:center;-ms-flex-align:center;align-items:center;-webkit-box-pack:center;-webkit-justify-content:center;-ms-flex-pack:center;justify-content:center;margin:0;padding:0;line-height:1;position:relative;cursor:".concat(clickable ? 'pointer' : 'default', ";pointer-events:").concat(clickable ? 'auto' : 'none', ";}.input-icon.__jsx-style-dynamic-selector svg{width:calc(var(--input-height) - 2px);height:calc(var(--input-height) - 2px);-webkit-transform:scale(0.44);-ms-transform:scale(0.44);transform:scale(0.44);}")));
-}
-InputIconComponent.displayName = 'BolioUIInputIcon';
-var InputIcon = /*#__PURE__*/React.memo(InputIconComponent);
-export default InputIcon;

package/esm/Input/InputIconClear.js

@@ -1,43 +0,0 @@
-import _JSXStyle from "styled-jsx/style";
-import React from 'react';
-import useTheme from '../use-theme';
-import useClasses from '../use-classes';
-function InputIconClear(_ref) {
-  var onClick = _ref.onClick,
-    disabled = _ref.disabled,
-    visible = _ref.visible;
-  var theme = useTheme();
-  var classes = useClasses('clear-icon', {
-    visible: visible
-  });
-  var clickHandler = function clickHandler(event) {
-    event.preventDefault();
-    event.stopPropagation();
-    event.nativeEvent.stopImmediatePropagation();
-    onClick && onClick(event);
-  };
-  return /*#__PURE__*/React.createElement("div", {
-    onClick: clickHandler,
-    className: _JSXStyle.dynamic([["2817842826", [disabled ? 'not-allowed' : 'pointer', theme.palette.accents_3, disabled ? theme.palette.accents_3 : theme.palette.foreground]]]) + " " + (classes || "")
-  }, /*#__PURE__*/React.createElement("svg", {
-    viewBox: "0 0 24 24",
-    stroke: "currentColor",
-    strokeWidth: "1.5",
-    strokeLinecap: "round",
-    strokeLinejoin: "round",
-    fill: "none",
-    shapeRendering: "geometricPrecision",
-    className: _JSXStyle.dynamic([["2817842826", [disabled ? 'not-allowed' : 'pointer', theme.palette.accents_3, disabled ? theme.palette.accents_3 : theme.palette.foreground]]])
-  }, /*#__PURE__*/React.createElement("path", {
-    d: "M18 6L6 18",
-    className: _JSXStyle.dynamic([["2817842826", [disabled ? 'not-allowed' : 'pointer', theme.palette.accents_3, disabled ? theme.palette.accents_3 : theme.palette.foreground]]])
-  }), /*#__PURE__*/React.createElement("path", {
-    d: "M6 6l12 12",
-    className: _JSXStyle.dynamic([["2817842826", [disabled ? 'not-allowed' : 'pointer', theme.palette.accents_3, disabled ? theme.palette.accents_3 : theme.palette.foreground]]])
-  })), /*#__PURE__*/React.createElement(_JSXStyle, {
-    id: "2817842826",
-    dynamic: [disabled ? 'not-allowed' : 'pointer', theme.palette.accents_3, disabled ? theme.palette.accents_3 : theme.palette.foreground]
-  }, ".clear-icon.__jsx-style-dynamic-selector{box-sizing:border-box;display:-webkit-inline-box;display:-webkit-inline-flex;display:-ms-inline-flexbox;display:inline-flex;width:calc(var(--input-height) - 2px);-webkit-flex-shrink:0;-ms-flex-negative:0;flex-shrink:0;height:100%;-webkit-align-items:center;-webkit-box-align:center;-ms-flex-align:center;align-items:center;-webkit-box-pack:center;-webkit-justify-content:center;-ms-flex-pack:center;justify-content:center;cursor:".concat(disabled ? 'not-allowed' : 'pointer', ";-webkit-transition:color 150ms ease 0s;transition:color 150ms ease 0s;margin:0;padding:0;color:").concat(theme.palette.accents_3, ";visibility:hidden;opacity:0;}.visible.__jsx-style-dynamic-selector{visibility:visible;opacity:1;}.clear-icon.__jsx-style-dynamic-selector:hover{color:").concat(disabled ? theme.palette.accents_3 : theme.palette.foreground, ";}svg.__jsx-style-dynamic-selector{color:currentColor;width:calc(var(--input-height) - 2px);height:calc(var(--input-height) - 2px);-webkit-transform:scale(0.44);-ms-transform:scale(0.44);transform:scale(0.44);}")));
-}
-var MemoInputIconClear = /*#__PURE__*/React.memo(InputIconClear);
-export default MemoInputIconClear;

package/esm/Input/InputLabel.js

@@ -1,16 +0,0 @@
-import _JSXStyle from "styled-jsx/style";
-import React from 'react';
-import useTheme from '../use-theme';
-function InputLabel(_ref) {
-  var children = _ref.children,
-    isRight = _ref.isRight;
-  var theme = useTheme();
-  return /*#__PURE__*/React.createElement("span", {
-    className: _JSXStyle.dynamic([["839392656", [theme.layout.gapHalf, theme.palette.accents_4, theme.palette.accents_1, theme.layout.radius, theme.layout.radius, theme.palette.border, theme.palette.border, theme.palette.border, theme.palette.border, theme.layout.radius, theme.layout.radius, theme.palette.border, theme.palette.border]]]) + " " + ((isRight ? 'right' : '') || "")
-  }, children, /*#__PURE__*/React.createElement(_JSXStyle, {
-    id: "839392656",
-    dynamic: [theme.layout.gapHalf, theme.palette.accents_4, theme.palette.accents_1, theme.layout.radius, theme.layout.radius, theme.palette.border, theme.palette.border, theme.palette.border, theme.palette.border, theme.layout.radius, theme.layout.radius, theme.palette.border, theme.palette.border]
-  }, "span.__jsx-style-dynamic-selector{display:-webkit-inline-box;display:-webkit-inline-flex;display:-ms-inline-flexbox;display:inline-flex;width:initial;height:100%;-webkit-align-items:center;-webkit-box-align:center;-ms-flex-align:center;align-items:center;pointer-events:none;margin:0;padding:0 ".concat(theme.layout.gapHalf, ";color:").concat(theme.palette.accents_4, ";background-color:").concat(theme.palette.accents_1, ";border-top-left-radius:").concat(theme.layout.radius, ";border-bottom-left-radius:").concat(theme.layout.radius, ";border-top:1px solid ").concat(theme.palette.border, ";border-left:1px solid ").concat(theme.palette.border, ";border-bottom:1px solid ").concat(theme.palette.border, ";border-right:1px solid ").concat(theme.palette.border, ";font-size:inherit;line-height:1;}span.right.__jsx-style-dynamic-selector{border-top-left-radius:0;border-bottom-left-radius:0;border-top-right-radius:").concat(theme.layout.radius, ";border-bottom-right-radius:").concat(theme.layout.radius, ";border-left:1px solid ").concat(theme.palette.border, ";border-right:1px solid ").concat(theme.palette.border, ";}")));
-}
-var MemoInputLabel = /*#__PURE__*/React.memo(InputLabel);
-export default MemoInputLabel;

package/esm/Input/InputProps.js

@@ -1,13 +0,0 @@
-export var defaultProps = {
-  disabled: false,
-  readOnly: false,
-  clearable: false,
-  iconClickable: false,
-  type: 'default',
-  htmlType: 'text',
-  autoComplete: 'off',
-  className: '',
-  placeholder: '',
-  initialValue: '',
-  crossOrigin: ''
-};

package/esm/Input/Password.js

@@ -1,57 +0,0 @@
-import _slicedToArray from "@babel/runtime/helpers/esm/slicedToArray";
-import _objectWithoutProperties from "@babel/runtime/helpers/esm/objectWithoutProperties";
-import _extends from "@babel/runtime/helpers/esm/extends";
-var _excluded = ["hideToggle", "children"];
-import React, { useImperativeHandle, useMemo, useRef, useState } from 'react';
-import { defaultProps } from './InputProps';
-import PasswordIcon from './PasswordIcon';
-import Input from './Input';
-import { useScale, withScale } from '../use-scale';
-var passwordDefaultProps = _extends({}, defaultProps, {
-  hideToggle: false
-});
-var InputPasswordComponent = /*#__PURE__*/React.forwardRef(function (_ref, ref) {
-  var hideToggle = _ref.hideToggle,
-    children = _ref.children,
-    props = _objectWithoutProperties(_ref, _excluded);
-  var _useScale = useScale(),
-    getAllScaleProps = _useScale.getAllScaleProps;
-  var inputRef = useRef(null);
-  var _useState = useState(false),
-    _useState2 = _slicedToArray(_useState, 2),
-    visible = _useState2[0],
-    setVisible = _useState2[1];
-  useImperativeHandle(ref, function () {
-    return inputRef.current;
-  });
-  var iconClickHandler = function iconClickHandler() {
-    setVisible(function (v) {
-      return !v;
-    });
-    /* istanbul ignore next */
-    if (inputRef && inputRef.current) {
-      inputRef.current.focus();
-    }
-  };
-  var inputProps = useMemo(function () {
-    return _extends({}, props, {
-      ref: inputRef,
-      iconClickable: true,
-      onIconClick: iconClickHandler,
-      htmlType: visible ? 'text' : 'password'
-    });
-  }, [props, iconClickHandler, visible, inputRef]);
-  var icon = useMemo(function () {
-    if (hideToggle) return null;
-    return /*#__PURE__*/React.createElement(PasswordIcon, {
-      visible: visible
-    });
-  }, [hideToggle, visible]);
-  return /*#__PURE__*/React.createElement(Input, _extends({
-    iconRight: icon
-  }, getAllScaleProps(), inputProps), children);
-});
-InputPasswordComponent.defaultProps = passwordDefaultProps;
-InputPasswordComponent.displayName = 'BolioUIInputPassword';
-var InputPassword = withScale(InputPasswordComponent);
-export default InputPassword;

package/esm/Input/PasswordIcon.js

@@ -1,28 +0,0 @@
-import React from 'react';
-function PasswordIcon(_ref) {
-  var visible = _ref.visible;
-  return /*#__PURE__*/React.createElement("svg", {
-    viewBox: "0 0 24 24",
-    stroke: "currentColor",
-    strokeWidth: "1.5",
-    strokeLinecap: "round",
-    strokeLinejoin: "round",
-    fill: "none",
-    shapeRendering: "geometricPrecision",
-    style: {
-      color: 'currentColor'
-    }
-  }, !visible ? /*#__PURE__*/React.createElement(React.Fragment, null, /*#__PURE__*/React.createElement("path", {
-    d: "M1 12s4-8 11-8 11 8 11 8-4 8-11 8-11-8-11-8z"
-  }), /*#__PURE__*/React.createElement("circle", {
-    cx: "12",
-    cy: "12",
-    r: "3"
-  })) : /*#__PURE__*/React.createElement(React.Fragment, null, /*#__PURE__*/React.createElement("path", {
-    d: "M17.94 17.94A10.07 10.07 0 0112 20c-7 0-11-8-11-8a18.45 18.45 0 015.06-5.94M9.9 4.24A9.12 9.12 0 0112 4c7 0 11 8 11 8a18.5 18.5 0 01-2.16 3.19m-6.72-1.07a3 3 0 11-4.24-4.24"
-  }), /*#__PURE__*/React.createElement("path", {
-    d: "M1 1l22 22"
-  })));
-}
-var MemoPasswordIcon = /*#__PURE__*/React.memo(PasswordIcon);
-export default MemoPasswordIcon;

package/esm/Keyboard/Keyboard.js

@@ -1,45 +0,0 @@
-import _extends from "@babel/runtime/helpers/esm/extends";
-import _objectWithoutProperties from "@babel/runtime/helpers/esm/objectWithoutProperties";
-var _excluded = ["command", "shift", "option", "ctrl", "children", "className"];
-import _JSXStyle from "styled-jsx/style";
-import React from 'react';
-import useTheme from '../use-theme';
-import useScale, { withScale } from '../use-scale';
-var KeyboardComponent = /*#__PURE__*/React.forwardRef(function (_ref, ref) {
-  var _ref$command = _ref.command,
-    command = _ref$command === void 0 ? false : _ref$command,
-    _ref$shift = _ref.shift,
-    shift = _ref$shift === void 0 ? false : _ref$shift,
-    _ref$option = _ref.option,
-    option = _ref$option === void 0 ? false : _ref$option,
-    _ref$ctrl = _ref.ctrl,
-    ctrl = _ref$ctrl === void 0 ? false : _ref$ctrl,
-    children = _ref.children,
-    _ref$className = _ref.className,
-    className = _ref$className === void 0 ? '' : _ref$className,
-    props = _objectWithoutProperties(_ref, _excluded);
-  var theme = useTheme();
-  var _useScale = useScale(),
-    SCALES = _useScale.SCALES;
-  return /*#__PURE__*/React.createElement("kbd", _extends({
-    ref: ref
-  }, props, {
-    className: _JSXStyle.dynamic([["4198515491", [theme.palette.accents_5, theme.palette.accents_1, theme.font.sans, theme.layout.radius, theme.palette.accents_2, SCALES.font(0.875), SCALES.width(1, 'fit-content'), SCALES.height(1, 'auto'), SCALES.pt(0), SCALES.pr(0.34), SCALES.pb(0), SCALES.pl(0.34), SCALES.mt(0), SCALES.mr(0), SCALES.mb(0), SCALES.ml(0)]]]) + " " + (props && props.className != null && props.className || className || "")
-  }), command && /*#__PURE__*/React.createElement("span", {
-    className: _JSXStyle.dynamic([["4198515491", [theme.palette.accents_5, theme.palette.accents_1, theme.font.sans, theme.layout.radius, theme.palette.accents_2, SCALES.font(0.875), SCALES.width(1, 'fit-content'), SCALES.height(1, 'auto'), SCALES.pt(0), SCALES.pr(0.34), SCALES.pb(0), SCALES.pl(0.34), SCALES.mt(0), SCALES.mr(0), SCALES.mb(0), SCALES.ml(0)]]])
-  }, "\u2318"), shift && /*#__PURE__*/React.createElement("span", {
-    className: _JSXStyle.dynamic([["4198515491", [theme.palette.accents_5, theme.palette.accents_1, theme.font.sans, theme.layout.radius, theme.palette.accents_2, SCALES.font(0.875), SCALES.width(1, 'fit-content'), SCALES.height(1, 'auto'), SCALES.pt(0), SCALES.pr(0.34), SCALES.pb(0), SCALES.pl(0.34), SCALES.mt(0), SCALES.mr(0), SCALES.mb(0), SCALES.ml(0)]]])
-  }, "\u21E7"), option && /*#__PURE__*/React.createElement("span", {
-    className: _JSXStyle.dynamic([["4198515491", [theme.palette.accents_5, theme.palette.accents_1, theme.font.sans, theme.layout.radius, theme.palette.accents_2, SCALES.font(0.875), SCALES.width(1, 'fit-content'), SCALES.height(1, 'auto'), SCALES.pt(0), SCALES.pr(0.34), SCALES.pb(0), SCALES.pl(0.34), SCALES.mt(0), SCALES.mr(0), SCALES.mb(0), SCALES.ml(0)]]])
-  }, "\u2325"), ctrl && /*#__PURE__*/React.createElement("span", {
-    className: _JSXStyle.dynamic([["4198515491", [theme.palette.accents_5, theme.palette.accents_1, theme.font.sans, theme.layout.radius, theme.palette.accents_2, SCALES.font(0.875), SCALES.width(1, 'fit-content'), SCALES.height(1, 'auto'), SCALES.pt(0), SCALES.pr(0.34), SCALES.pb(0), SCALES.pl(0.34), SCALES.mt(0), SCALES.mr(0), SCALES.mb(0), SCALES.ml(0)]]])
-  }, "\u2303"), children && /*#__PURE__*/React.createElement("span", {
-    className: _JSXStyle.dynamic([["4198515491", [theme.palette.accents_5, theme.palette.accents_1, theme.font.sans, theme.layout.radius, theme.palette.accents_2, SCALES.font(0.875), SCALES.width(1, 'fit-content'), SCALES.height(1, 'auto'), SCALES.pt(0), SCALES.pr(0.34), SCALES.pb(0), SCALES.pl(0.34), SCALES.mt(0), SCALES.mr(0), SCALES.mb(0), SCALES.ml(0)]]])
-  }, children), /*#__PURE__*/React.createElement(_JSXStyle, {
-    id: "4198515491",
-    dynamic: [theme.palette.accents_5, theme.palette.accents_1, theme.font.sans, theme.layout.radius, theme.palette.accents_2, SCALES.font(0.875), SCALES.width(1, 'fit-content'), SCALES.height(1, 'auto'), SCALES.pt(0), SCALES.pr(0.34), SCALES.pb(0), SCALES.pl(0.34), SCALES.mt(0), SCALES.mr(0), SCALES.mb(0), SCALES.ml(0)]
-  }, "kbd.__jsx-style-dynamic-selector{line-height:2em;text-align:center;display:inline-block;color:".concat(theme.palette.accents_5, ";background-color:").concat(theme.palette.accents_1, ";font-family:").concat(theme.font.sans, ";border-radius:").concat(theme.layout.radius, ";border:1px solid ").concat(theme.palette.accents_2, ";font-size:").concat(SCALES.font(0.875), ";width:").concat(SCALES.width(1, 'fit-content'), ";height:").concat(SCALES.height(1, 'auto'), ";min-width:2em;min-height:2em;padding:").concat(SCALES.pt(0), " ").concat(SCALES.pr(0.34), " ").concat(SCALES.pb(0), " ").concat(SCALES.pl(0.34), ";margin:").concat(SCALES.mt(0), " ").concat(SCALES.mr(0), " ").concat(SCALES.mb(0), " ").concat(SCALES.ml(0), ";}span.__jsx-style-dynamic-selector{line-height:2em;font-size:1em;text-align:center;}span.__jsx-style-dynamic-selector+span.__jsx-style-dynamic-selector{margin-left:0.3em;}")));
-});
-KeyboardComponent.displayName = 'BolioUIKeyboard';
-var Keyboard = withScale(KeyboardComponent);
-export default Keyboard;

package/esm/Link/Icon.js

@@ -1,30 +0,0 @@
-import _JSXStyle from "styled-jsx/style";
-import React from 'react';
-export function LinkIconComponent() {
-  return /*#__PURE__*/React.createElement("svg", {
-    viewBox: "0 0 24 24",
-    width: "0.9375em",
-    height: "0.9375em",
-    stroke: "currentColor",
-    strokeWidth: "1.5",
-    strokeLinecap: "round",
-    strokeLinejoin: "round",
-    fill: "none",
-    shapeRendering: "geometricPrecision",
-    className: "jsx-3409194595" + " " + "icon"
-  }, /*#__PURE__*/React.createElement("path", {
-    d: "M18 13v6a2 2 0 01-2 2H5a2 2 0 01-2-2V8a2 2 0 012-2h6",
-    className: "jsx-3409194595"
-  }), /*#__PURE__*/React.createElement("path", {
-    d: "M15 3h6v6",
-    className: "jsx-3409194595"
-  }), /*#__PURE__*/React.createElement("path", {
-    d: "M10 14L21 3",
-    className: "jsx-3409194595"
-  }), /*#__PURE__*/React.createElement(_JSXStyle, {
-    id: "3409194595"
-  }, ".icon.jsx-3409194595{margin:0 0 -1px 0.1875em;display:-webkit-inline-box;display:-webkit-inline-flex;display:-ms-inline-flexbox;display:inline-flex;-webkit-align-self:center;-ms-flex-item-align:center;align-self:center;color:currentColor;}"));
-}
-LinkIconComponent.displayName = 'BolioUILinkIcon';
-var LinkIcon = /*#__PURE__*/React.memo(LinkIconComponent);
-export default LinkIcon;