@blateral/b.kit 2.3.0-beta.1.2 → 2.3.0-beta.1.3

package/esm/ButtonGhost-422fd723.js

@@ -1,220 +0,0 @@
-import { a as __makeTemplateObject, d as __rest, _ as __assign } from './ClockFilled-cff5900e.js';
-import * as React from 'react';
-import React__default from 'react';
-import styled, { css } from 'styled-components';
-import { h as hexToRgba } from './hexRgbConverter-edb91624.js';
-import { s as spacings, a as getFonts, w as withRange, c as getGlobals, g as getColors, m as mq } from './styles-eca3acc8.js';
-
-var View$1 = styled.a.withConfig({
-  displayName: "Button__View",
-  componentId: "sc-2gssup-0"
-})(templateObject_3$1 || (templateObject_3$1 = __makeTemplateObject(["\n    min-height: 3em;\n    height: ", ";\n    min-width: ", ";\n    padding: 0.1em 1.2em;\n\n    max-width: calc(100% - ", "px);\n\n    display: inline-flex;\n    flex-direction: row;\n    flex-wrap: nowrap;\n    justify-content: center;\n    align-items: center;\n\n    vertical-align: middle;\n\n    font-family: ", ";\n    ", "\n    font-weight: ", ";\n    line-height: 1;\n    letter-spacing: ", ";\n    text-decoration: none;\n\n    outline: none;\n    border: 1px solid transparent;\n    border-radius: ", ";\n    user-select: none;\n    cursor: pointer;\n\n    pointer-events: ", ";\n\n    background-color: ", ";\n    color: ", ";\n    text-align: left;\n\n    transition: all ease-in-out 0.2s;\n\n    & > * {\n        color: ", ";\n    }\n\n    & > * + * {\n        margin-left: ", "px;\n    }\n    & > *[data-btn-desktop] + *[data-btn-mobile] {\n        margin-left: 0;\n    }\n    & > *[data-btn-mobile] + *[data-btn-desktop] {\n        margin-left: 0;\n    }\n    & > *[data-btn-desktop] {\n        display: none;\n    }\n    & > *:not([data-btn-desktop]) + * {\n        margin-left: 0;\n    }\n\n    @media (hover: hover) and (pointer: fine) {\n        ", "\n    }\n\n    ", "\n\n    @media ", " {\n        & > *[data-btn-desktop='true'] {\n            display: inherit;\n        }\n        & > *[data-btn-mobile='true'] {\n            display: none;\n        }\n        & > *:not([data-btn-mobile='true']) + * {\n            margin-left: 0;\n        }\n    }\n"], ["\n    min-height: 3em;\n    height: ", ";\n    min-width: ", ";\n    padding: 0.1em 1.2em;\n\n    max-width: calc(100% - ", "px);\n\n    display: inline-flex;\n    flex-direction: row;\n    flex-wrap: nowrap;\n    justify-content: center;\n    align-items: center;\n\n    vertical-align: middle;\n\n    font-family: ", ";\n    ", "\n    font-weight: ", ";\n    line-height: 1;\n    letter-spacing: ", ";\n    text-decoration: none;\n\n    outline: none;\n    border: 1px solid transparent;\n    border-radius: ", ";\n    user-select: none;\n    cursor: pointer;\n\n    pointer-events: ", ";\n\n    background-color: ", ";\n    color: ", ";\n    text-align: left;\n\n    transition: all ease-in-out 0.2s;\n\n    & > * {\n        color: ", ";\n    }\n\n    & > * + * {\n        margin-left: ", "px;\n    }\n    & > *[data-btn-desktop] + *[data-btn-mobile] {\n        margin-left: 0;\n    }\n    & > *[data-btn-mobile] + *[data-btn-desktop] {\n        margin-left: 0;\n    }\n    & > *[data-btn-desktop] {\n        display: none;\n    }\n    & > *:not([data-btn-desktop]) + * {\n        margin-left: 0;\n    }\n\n    @media (hover: hover) and (pointer: fine) {\n        ", "\n    }\n\n    ", "\n\n    @media ", " {\n        & > *[data-btn-desktop='true'] {\n            display: inherit;\n        }\n        & > *[data-btn-mobile='true'] {\n            display: none;\n        }\n        & > *:not([data-btn-mobile='true']) + * {\n            margin-left: 0;\n        }\n    }\n"])), function (_a) {
-  var size = _a.size;
-  return size === 'default' ? '3.5em' : '3em';
-}, function (_a) {
-  var size = _a.size;
-  return size === 'default' ? '200px' : '120px';
-}, spacings.spacer, function (_a) {
-  var theme = _a.theme;
-  return getFonts(theme).copy.medium.family;
-}, function (_a) {
-  var theme = _a.theme;
-  return withRange(getFonts(theme).copy.medium.size, 'font-size');
-}, function (_a) {
-  var theme = _a.theme;
-  return getFonts(theme).copy.medium.weight;
-}, function (_a) {
-  var theme = _a.theme;
-  return getFonts(theme).copy.medium.letterSpacing;
-}, function (_a) {
-  var theme = _a.theme;
-  return getGlobals(theme).sections.edgeRadius;
-}, function (_a) {
-  var disable = _a.disable;
-  return disable ? 'none' : 'all';
-}, function (_a) {
-  var theme = _a.theme,
-      inverted = _a.inverted,
-      disable = _a.disable;
-  return disable ? getColors(theme).elementBg.medium : inverted ? getColors(theme).primary.inverted : getColors(theme).primary.default;
-}, function (_a) {
-  var theme = _a.theme,
-      inverted = _a.inverted,
-      disable = _a.disable;
-  return disable ? hexToRgba(getColors(theme).text.default, 0.4) : !inverted ? getColors(theme).text.inverted : getColors(theme).text.default;
-}, function (_a) {
-  var theme = _a.theme,
-      inverted = _a.inverted,
-      disable = _a.disable;
-  return disable ? hexToRgba(getColors(theme).text.default, 0.4) : !inverted ? getColors(theme).text.inverted : getColors(theme).text.default;
-}, spacings.nudge, function (_a) {
-  var disable = _a.disable,
-      inverted = _a.inverted;
-  return !disable && css(templateObject_1$1 || (templateObject_1$1 = __makeTemplateObject(["\n                &:hover {\n                    box-shadow: 0px 8px 16px\n                        ", ";\n                }\n            "], ["\n                &:hover {\n                    box-shadow: 0px 8px 16px\n                        ", ";\n                }\n            "])), inverted ? 'rgba(255, 255, 255, 0.25)' : 'rgba(0, 0, 0, 0.25)');
-}, function (_a) {
-  var disable = _a.disable,
-      inverted = _a.inverted;
-  return !disable && css(templateObject_2$1 || (templateObject_2$1 = __makeTemplateObject(["\n            &:focus {\n                text-decoration: underline;\n                box-shadow: 0px 8px 16px\n                    ", ";\n            }\n\n            &:focus:not(:focus-visible) {\n                text-decoration: none;\n                outline: none;\n                box-shadow: none;\n            }\n\n            &:active {\n                box-shadow: 0px 2px 6px\n                    ", ";\n            }\n        "], ["\n            &:focus {\n                text-decoration: underline;\n                box-shadow: 0px 8px 16px\n                    ", ";\n            }\n\n            &:focus:not(:focus-visible) {\n                text-decoration: none;\n                outline: none;\n                box-shadow: none;\n            }\n\n            &:active {\n                box-shadow: 0px 2px 6px\n                    ", ";\n            }\n        "])), inverted ? 'rgba(255, 255, 255, 0.25)' : 'rgba(0, 0, 0, 0.25)', inverted ? 'rgba(255, 255, 255, 0.25)' : 'rgba(0, 0, 0, 0.3)');
-}, mq.semilarge);
-var Button = React__default.forwardRef(function (_a, ref) {
-  var as = _a.as,
-      _b = _a.size,
-      size = _b === void 0 ? 'default' : _b,
-      isInverted = _a.isInverted,
-      isDisabled = _a.isDisabled,
-      onClick = _a.onClick,
-      className = _a.className,
-      children = _a.children,
-      rest = __rest(_a, ["as", "size", "isInverted", "isDisabled", "onClick", "className", "children"]);
-
-  if (as === 'button') {
-    return React__default.createElement(View$1, __assign({
-      ref: ref,
-      as: as,
-      size: size,
-      inverted: isInverted,
-      disable: isDisabled,
-      onClick: onClick,
-      className: className
-    }, rest), children);
-  } else {
-    return React__default.createElement(View$1, __assign({
-      ref: ref,
-      as: as,
-      "aria-disabled": isDisabled,
-      size: size,
-      href: rest.href,
-      target: rest.isExternal ? '_blank' : undefined,
-      rel: rest.isExternal ? 'noopener noreferrer' : undefined,
-      inverted: isInverted,
-      disable: isDisabled,
-      onClick: onClick,
-      className: className
-    }, rest), children);
-  }
-});
-Button.displayName = 'Button';
-var Icon$1 = styled.div.withConfig({
-  displayName: "Button__Icon",
-  componentId: "sc-2gssup-1"
-})(templateObject_4$1 || (templateObject_4$1 = __makeTemplateObject(["\n    display: flex;\n    flex-direction: row;\n    justify-content: center;\n    align-items: center;\n    width: 35px;\n    height: 35px;\n\n    color: ", ";\n\n    transition: transform 0.2s ease-in-out;\n\n    ", ":hover > & {\n        transform: translateX(3px);\n    }\n"], ["\n    display: flex;\n    flex-direction: row;\n    justify-content: center;\n    align-items: center;\n    width: 35px;\n    height: 35px;\n\n    color: ", ";\n\n    transition: transform 0.2s ease-in-out;\n\n    ", ":hover > & {\n        transform: translateX(3px);\n    }\n"])), function (_a) {
-  var iconColor = _a.iconColor;
-  return iconColor || 'inherit';
-}, View$1);
-var Label$1 = styled.span.withConfig({
-  displayName: "Button__Label",
-  componentId: "sc-2gssup-2"
-})(templateObject_5 || (templateObject_5 = __makeTemplateObject(["\n    display: inline-block;\n\n    max-width: 100%;\n\n    overflow: hidden;\n    white-space: nowrap;\n    text-overflow: ellipsis;\n"], ["\n    display: inline-block;\n\n    max-width: 100%;\n\n    overflow: hidden;\n    white-space: nowrap;\n    text-overflow: ellipsis;\n"])));
-var Button$1 = {
-  View: Button,
-  Label: Label$1,
-  Icon: Icon$1
-};
-var templateObject_1$1, templateObject_2$1, templateObject_3$1, templateObject_4$1, templateObject_5;
-
-var View = styled.a.withConfig({
-  displayName: "ButtonGhost__View",
-  componentId: "sc-y4lhy8-0"
-})(templateObject_2 || (templateObject_2 = __makeTemplateObject(["\n    min-height: 3em;\n    height: ", ";\n    min-width: ", ";\n    padding: 0.1em 1.2em;\n\n    max-width: calc(100% - ", "px);\n\n    display: inline-flex;\n    flex-direction: row;\n    flex-wrap: nowrap;\n    justify-content: center;\n    align-items: center;\n\n    vertical-align: middle;\n\n    font-family: ", ";\n    ", "\n    font-weight: ", ";\n    line-height: 1;\n    letter-spacing: ", ";\n\n    text-align: center;\n    text-decoration: none;\n\n    outline: none;\n    box-shadow: none;\n    border: solid 1px\n        ", ";\n    border-radius: ", ";\n    user-select: none;\n    cursor: pointer;\n\n    pointer-events: ", ";\n\n    background-color: transparent;\n    color: ", ";\n\n    transition: all ease-in-out 0.2s;\n\n    & > * {\n        color: ", ";\n    }\n\n    & > :not(:last-child) {\n        padding-right: ", "px;\n    }\n\n    @media (hover: hover) and (pointer: fine) {\n        ", "\n    }\n"], ["\n    min-height: 3em;\n    height: ", ";\n    min-width: ", ";\n    padding: 0.1em 1.2em;\n\n    max-width: calc(100% - ", "px);\n\n    display: inline-flex;\n    flex-direction: row;\n    flex-wrap: nowrap;\n    justify-content: center;\n    align-items: center;\n\n    vertical-align: middle;\n\n    font-family: ", ";\n    ", "\n    font-weight: ", ";\n    line-height: 1;\n    letter-spacing: ", ";\n\n    text-align: center;\n    text-decoration: none;\n\n    outline: none;\n    box-shadow: none;\n    border: solid 1px\n        ", ";\n    border-radius: ", ";\n    user-select: none;\n    cursor: pointer;\n\n    pointer-events: ", ";\n\n    background-color: transparent;\n    color: ", ";\n\n    transition: all ease-in-out 0.2s;\n\n    & > * {\n        color: ", ";\n    }\n\n    & > :not(:last-child) {\n        padding-right: ", "px;\n    }\n\n    @media (hover: hover) and (pointer: fine) {\n        ", "\n    }\n"])), function (_a) {
-  var size = _a.size;
-  return size === 'default' ? '3.5em' : '3em';
-}, function (_a) {
-  var size = _a.size;
-  return size === 'default' ? '200px' : '120px';
-}, spacings.spacer, function (_a) {
-  var theme = _a.theme;
-  return getFonts(theme).copy.medium.family;
-}, function (_a) {
-  var theme = _a.theme;
-  return withRange(getFonts(theme).copy.medium.size, 'font-size');
-}, function (_a) {
-  var theme = _a.theme;
-  return getFonts(theme).copy.medium.weight;
-}, function (_a) {
-  var theme = _a.theme;
-  return getFonts(theme).copy.medium.letterSpacing;
-}, function (_a) {
-  var inverted = _a.inverted,
-      disable = _a.disable,
-      theme = _a.theme;
-  return disable ? getColors(theme).elementBg.medium : inverted ? getColors(theme).elementBg.light : getColors(theme).elementBg.dark;
-}, function (_a) {
-  var theme = _a.theme;
-  return getGlobals(theme).sections.edgeRadius;
-}, function (_a) {
-  var disable = _a.disable;
-  return disable ? 'none' : 'all';
-}, function (_a) {
-  var theme = _a.theme,
-      inverted = _a.inverted,
-      disable = _a.disable;
-  return disable ? inverted ? hexToRgba(getColors(theme).text.inverted, 0.6) : hexToRgba(getColors(theme).text.default, 0.6) : inverted ? getColors(theme).text.inverted : getColors(theme).text.default;
-}, function (_a) {
-  var theme = _a.theme,
-      inverted = _a.inverted,
-      disable = _a.disable;
-  return disable ? inverted ? hexToRgba(getColors(theme).text.inverted, 0.6) : hexToRgba(getColors(theme).text.default, 0.6) : inverted ? getColors(theme).text.inverted : getColors(theme).text.default;
-}, spacings.nudge, function (_a) {
-  var disable = _a.disable,
-      inverted = _a.inverted,
-      theme = _a.theme;
-  return !disable && css(templateObject_1 || (templateObject_1 = __makeTemplateObject(["\n                &:hover {\n                    box-shadow: 0px 8px 16px\n                        ", ";\n                }\n\n                &:focus {\n                    outline: 1px solid\n                        ", ";\n                    outline-offset: 0;\n                    box-shadow: 0px 2px 6px\n                        ", ";\n                }\n\n                &:focus:not(:focus-visible) {\n                    outline: none;\n                    box-shadow: none;\n                }\n\n                &:active {\n                    box-shadow: 0px 2px 6px\n                        ", ";\n                }\n            "], ["\n                &:hover {\n                    box-shadow: 0px 8px 16px\n                        ", ";\n                }\n\n                &:focus {\n                    outline: 1px solid\n                        ", ";\n                    outline-offset: 0;\n                    box-shadow: 0px 2px 6px\n                        ", ";\n                }\n\n                &:focus:not(:focus-visible) {\n                    outline: none;\n                    box-shadow: none;\n                }\n\n                &:active {\n                    box-shadow: 0px 2px 6px\n                        ", ";\n                }\n            "])), inverted ? 'rgba(255, 255, 255, 0.25)' : 'rgba(0, 0, 0, 0.25)', inverted ? getColors(theme).primary.inverted : getColors(theme).primary.default, inverted ? 'rgba(255, 255, 255, 0.25)' : 'rgba(0, 0, 0, 0.3)', inverted ? 'rgba(255, 255, 255, 0.25)' : 'rgba(0, 0, 0, 0.3)');
-});
-var ButtonGhost = React.forwardRef(function (_a, ref) {
-  var as = _a.as,
-      _b = _a.size,
-      size = _b === void 0 ? 'default' : _b,
-      isInverted = _a.isInverted,
-      isDisabled = _a.isDisabled,
-      onClick = _a.onClick,
-      className = _a.className,
-      children = _a.children,
-      rest = __rest(_a, ["as", "size", "isInverted", "isDisabled", "onClick", "className", "children"]);
-
-  if (as === 'button') {
-    return React.createElement(View, __assign({
-      ref: ref,
-      as: as,
-      size: size,
-      inverted: isInverted,
-      disable: isDisabled,
-      onClick: onClick,
-      className: className
-    }, rest), children);
-  } else {
-    return React.createElement(View, __assign({
-      ref: ref,
-      as: as,
-      "aria-disabled": isDisabled,
-      size: size,
-      href: rest.href,
-      target: rest.isExternal ? '_blank' : undefined,
-      rel: rest.isExternal ? 'noopener noreferrer' : undefined,
-      inverted: isInverted,
-      disable: isDisabled,
-      onClick: onClick,
-      className: className
-    }, rest), children);
-  }
-});
-ButtonGhost.displayName = 'Button Ghost';
-var Icon = styled.div.withConfig({
-  displayName: "ButtonGhost__Icon",
-  componentId: "sc-y4lhy8-1"
-})(templateObject_3 || (templateObject_3 = __makeTemplateObject(["\n    display: flex;\n    flex-direction: row;\n    justify-content: flex-end;\n    align-items: center;\n    width: 35px;\n    height: 35px;\n\n    color: ", ";\n\n    transition: transform 0.2s ease-in-out;\n\n    ", ":hover > & {\n        transform: translateX(3px);\n    }\n"], ["\n    display: flex;\n    flex-direction: row;\n    justify-content: flex-end;\n    align-items: center;\n    width: 35px;\n    height: 35px;\n\n    color: ", ";\n\n    transition: transform 0.2s ease-in-out;\n\n    ", ":hover > & {\n        transform: translateX(3px);\n    }\n"])), function (_a) {
-  var iconColor = _a.iconColor;
-  return iconColor || 'inherit';
-}, View);
-var Label = styled.span.withConfig({
-  displayName: "ButtonGhost__Label",
-  componentId: "sc-y4lhy8-2"
-})(templateObject_4 || (templateObject_4 = __makeTemplateObject(["\n    display: inline-block;\n\n    max-width: 100%;\n\n    overflow: hidden;\n    white-space: nowrap;\n    text-overflow: ellipsis;\n"], ["\n    display: inline-block;\n\n    max-width: 100%;\n\n    overflow: hidden;\n    white-space: nowrap;\n    text-overflow: ellipsis;\n"])));
-var ButtonGhost$1 = {
-  View: ButtonGhost,
-  Label: Label,
-  Icon: Icon
-};
-var templateObject_1, templateObject_2, templateObject_3, templateObject_4;
-
-export { ButtonGhost$1 as B, Button$1 as a };
-//# sourceMappingURL=ButtonGhost-422fd723.js.map

package/esm/ButtonGhost-422fd723.js.map

@@ -1 +0,0 @@
-{"version":3,"file":"ButtonGhost-422fd723.js","sources":["../src/components/buttons/Button.tsx","../src/components/buttons/ButtonGhost.tsx"],"sourcesContent":["import React from 'react';\nimport styled, { css } from 'styled-components';\nimport { hexToRgba } from 'utils/hexRgbConverter';\n\nimport {\n    getColors as color,\n    getFonts as font,\n    getGlobals as global,\n    mq,\n    spacings,\n    withRange,\n} from 'utils/styles';\n\nconst View = styled.a<{\n    inverted?: boolean;\n    disable?: boolean;\n    size?: 'default' | 'small';\n}>`\n    min-height: 3em;\n    height: ${({ size }) => (size === 'default' ? '3.5em' : '3em')};\n    min-width: ${({ size }) => (size === 'default' ? '200px' : '120px')};\n    padding: 0.1em 1.2em;\n\n    max-width: calc(100% - ${spacings.spacer}px);\n\n    display: inline-flex;\n    flex-direction: row;\n    flex-wrap: nowrap;\n    justify-content: center;\n    align-items: center;\n\n    vertical-align: middle;\n\n    font-family: ${({ theme }) => font(theme).copy.medium.family};\n    ${({ theme }) => withRange(font(theme).copy.medium.size, 'font-size')}\n    font-weight: ${({ theme }) => font(theme).copy.medium.weight};\n    line-height: 1;\n    letter-spacing: ${({ theme }) => font(theme).copy.medium.letterSpacing};\n    text-decoration: none;\n\n    outline: none;\n    border: 1px solid transparent;\n    border-radius: ${({ theme }) => global(theme).sections.edgeRadius};\n    user-select: none;\n    cursor: pointer;\n\n    pointer-events: ${({ disable }) => (disable ? 'none' : 'all')};\n\n    background-color: ${({ theme, inverted, disable }) =>\n        disable\n            ? color(theme).elementBg.medium\n            : inverted\n            ? color(theme).primary.inverted\n            : color(theme).primary.default};\n    color: ${({ theme, inverted, disable }) =>\n        disable\n            ? hexToRgba(color(theme).text.default, 0.4)\n            : !inverted\n            ? color(theme).text.inverted\n            : color(theme).text.default};\n    text-align: left;\n\n    transition: all ease-in-out 0.2s;\n\n    & > * {\n        color: ${({ theme, inverted, disable }) =>\n            disable\n                ? hexToRgba(color(theme).text.default, 0.4)\n                : !inverted\n                ? color(theme).text.inverted\n                : color(theme).text.default};\n    }\n\n    & > * + * {\n        margin-left: ${spacings.nudge}px;\n    }\n    & > *[data-btn-desktop] + *[data-btn-mobile] {\n        margin-left: 0;\n    }\n    & > *[data-btn-mobile] + *[data-btn-desktop] {\n        margin-left: 0;\n    }\n    & > *[data-btn-desktop] {\n        display: none;\n    }\n    & > *:not([data-btn-desktop]) + * {\n        margin-left: 0;\n    }\n\n    @media (hover: hover) and (pointer: fine) {\n        ${({ disable, inverted }) =>\n            !disable &&\n            css`\n                &:hover {\n                    box-shadow: 0px 8px 16px\n                        ${inverted\n                            ? 'rgba(255, 255, 255, 0.25)'\n                            : 'rgba(0, 0, 0, 0.25)'};\n                }\n            `}\n    }\n\n    ${({ disable, inverted }) =>\n        !disable &&\n        css`\n            &:focus {\n                text-decoration: underline;\n                box-shadow: 0px 8px 16px\n                    ${inverted\n                        ? 'rgba(255, 255, 255, 0.25)'\n                        : 'rgba(0, 0, 0, 0.25)'};\n            }\n\n            &:focus:not(:focus-visible) {\n                text-decoration: none;\n                outline: none;\n                box-shadow: none;\n            }\n\n            &:active {\n                box-shadow: 0px 2px 6px\n                    ${inverted\n                        ? 'rgba(255, 255, 255, 0.25)'\n                        : 'rgba(0, 0, 0, 0.3)'};\n            }\n        `}\n\n    @media ${mq.semilarge} {\n        & > *[data-btn-desktop='true'] {\n            display: inherit;\n        }\n        & > *[data-btn-mobile='true'] {\n            display: none;\n        }\n        & > *:not([data-btn-mobile='true']) + * {\n            margin-left: 0;\n        }\n    }\n`;\n\ninterface Props {\n    size?: 'default' | 'small';\n    isInverted?: boolean;\n    isDisabled?: boolean;\n    className?: string;\n    children?: React.ReactNode;\n}\n\nexport type BtnProps = Props & {\n    as?: 'button';\n    onClick?: (ev: React.SyntheticEvent<HTMLButtonElement>) => void;\n};\n\nexport type LinkProps = Props & {\n    as?: 'a';\n    href?: string;\n    onClick?: (ev: React.SyntheticEvent<HTMLAnchorElement>) => void;\n    isExternal?: boolean;\n};\n\nconst Button: React.FC<BtnProps | LinkProps> = React.forwardRef(\n    (\n        {\n            as,\n            size = 'default',\n            isInverted,\n            isDisabled,\n            onClick,\n            className,\n            children,\n            ...rest\n        },\n        ref\n    ) => {\n        if (as === 'button') {\n            return (\n                <View\n                    ref={ref}\n                    as={as as any}\n                    size={size}\n                    inverted={isInverted}\n                    disable={isDisabled}\n                    onClick={onClick}\n                    className={className}\n                    {...rest}\n                >\n                    {children}\n                </View>\n            );\n        } else {\n            return (\n                <View\n                    ref={ref}\n                    as={as as any}\n                    aria-disabled={isDisabled}\n                    size={size}\n                    href={(rest as LinkProps).href}\n                    target={\n                        (rest as LinkProps).isExternal ? '_blank' : undefined\n                    }\n                    rel={\n                        (rest as LinkProps).isExternal\n                            ? 'noopener noreferrer'\n                            : undefined\n                    }\n                    inverted={isInverted}\n                    disable={isDisabled}\n                    onClick={onClick}\n                    className={className}\n                    {...rest}\n                >\n                    {children}\n                </View>\n            );\n        }\n    }\n);\n\nButton.displayName = 'Button';\n\nconst Icon = styled.div<{ iconColor?: string }>`\n    display: flex;\n    flex-direction: row;\n    justify-content: center;\n    align-items: center;\n    width: 35px;\n    height: 35px;\n\n    color: ${({ iconColor }) => iconColor || 'inherit'};\n\n    transition: transform 0.2s ease-in-out;\n\n    ${View}:hover > & {\n        transform: translateX(3px);\n    }\n`;\n\nconst Label = styled.span`\n    display: inline-block;\n\n    max-width: 100%;\n\n    overflow: hidden;\n    white-space: nowrap;\n    text-overflow: ellipsis;\n`;\n\nexport default { View: Button, Label: Label, Icon: Icon };\n","import * as React from 'react';\nimport styled, { css } from 'styled-components';\nimport { hexToRgba } from 'utils/hexRgbConverter';\n\nimport {\n    getColors as color,\n    getFonts as font,\n    getGlobals as global,\n    spacings,\n    withRange,\n} from 'utils/styles';\n\nconst View = styled.a<{\n    inverted?: boolean;\n    disable?: boolean;\n    size?: 'default' | 'small';\n}>`\n    min-height: 3em;\n    height: ${({ size }) => (size === 'default' ? '3.5em' : '3em')};\n    min-width: ${({ size }) => (size === 'default' ? '200px' : '120px')};\n    padding: 0.1em 1.2em;\n\n    max-width: calc(100% - ${spacings.spacer}px);\n\n    display: inline-flex;\n    flex-direction: row;\n    flex-wrap: nowrap;\n    justify-content: center;\n    align-items: center;\n\n    vertical-align: middle;\n\n    font-family: ${({ theme }) => font(theme).copy.medium.family};\n    ${({ theme }) => withRange(font(theme).copy.medium.size, 'font-size')}\n    font-weight: ${({ theme }) => font(theme).copy.medium.weight};\n    line-height: 1;\n    letter-spacing: ${({ theme }) => font(theme).copy.medium.letterSpacing};\n\n    text-align: center;\n    text-decoration: none;\n\n    outline: none;\n    box-shadow: none;\n    border: solid 1px\n        ${({ inverted, disable, theme }) =>\n            disable\n                ? color(theme).elementBg.medium\n                : inverted\n                ? color(theme).elementBg.light\n                : color(theme).elementBg.dark};\n    border-radius: ${({ theme }) => global(theme).sections.edgeRadius};\n    user-select: none;\n    cursor: pointer;\n\n    pointer-events: ${({ disable }) => (disable ? 'none' : 'all')};\n\n    background-color: transparent;\n    color: ${({ theme, inverted, disable }) =>\n        disable\n            ? inverted\n                ? hexToRgba(color(theme).text.inverted, 0.6)\n                : hexToRgba(color(theme).text.default, 0.6)\n            : inverted\n            ? color(theme).text.inverted\n            : color(theme).text.default};\n\n    transition: all ease-in-out 0.2s;\n\n    & > * {\n        color: ${({ theme, inverted, disable }) =>\n            disable\n                ? inverted\n                    ? hexToRgba(color(theme).text.inverted, 0.6)\n                    : hexToRgba(color(theme).text.default, 0.6)\n                : inverted\n                ? color(theme).text.inverted\n                : color(theme).text.default};\n    }\n\n    & > :not(:last-child) {\n        padding-right: ${spacings.nudge}px;\n    }\n\n    @media (hover: hover) and (pointer: fine) {\n        ${({ disable, inverted, theme }) =>\n            !disable &&\n            css`\n                &:hover {\n                    box-shadow: 0px 8px 16px\n                        ${inverted\n                            ? 'rgba(255, 255, 255, 0.25)'\n                            : 'rgba(0, 0, 0, 0.25)'};\n                }\n\n                &:focus {\n                    outline: 1px solid\n                        ${inverted\n                            ? color(theme).primary.inverted\n                            : color(theme).primary.default};\n                    outline-offset: 0;\n                    box-shadow: 0px 2px 6px\n                        ${inverted\n                            ? 'rgba(255, 255, 255, 0.25)'\n                            : 'rgba(0, 0, 0, 0.3)'};\n                }\n\n                &:focus:not(:focus-visible) {\n                    outline: none;\n                    box-shadow: none;\n                }\n\n                &:active {\n                    box-shadow: 0px 2px 6px\n                        ${inverted\n                            ? 'rgba(255, 255, 255, 0.25)'\n                            : 'rgba(0, 0, 0, 0.3)'};\n                }\n            `}\n    }\n`;\n\ninterface Props {\n    size?: 'default' | 'small';\n    isInverted?: boolean;\n    isDisabled?: boolean;\n    className?: string;\n    children?: React.ReactNode;\n}\n\nexport type BtnProps = Props & {\n    as?: 'button';\n    onClick?: (ev: React.SyntheticEvent<HTMLButtonElement>) => void;\n};\n\nexport type LinkProps = Props & {\n    as?: 'a';\n    href?: string;\n    onClick?: (ev: React.SyntheticEvent<HTMLAnchorElement>) => void;\n    isExternal?: boolean;\n};\n\nconst ButtonGhost: React.FC<BtnProps | LinkProps> = React.forwardRef(\n    (\n        {\n            as,\n            size = 'default',\n            isInverted,\n            isDisabled,\n            onClick,\n            className,\n            children,\n            ...rest\n        },\n        ref\n    ) => {\n        if (as === 'button') {\n            return (\n                <View\n                    ref={ref}\n                    as={as as any}\n                    size={size}\n                    inverted={isInverted}\n                    disable={isDisabled}\n                    onClick={onClick}\n                    className={className}\n                    {...rest}\n                >\n                    {children}\n                </View>\n            );\n        } else {\n            return (\n                <View\n                    ref={ref}\n                    as={as as any}\n                    aria-disabled={isDisabled}\n                    size={size}\n                    href={(rest as LinkProps).href}\n                    target={\n                        (rest as LinkProps).isExternal ? '_blank' : undefined\n                    }\n                    rel={\n                        (rest as LinkProps).isExternal\n                            ? 'noopener noreferrer'\n                            : undefined\n                    }\n                    inverted={isInverted}\n                    disable={isDisabled}\n                    onClick={onClick}\n                    className={className}\n                    {...rest}\n                >\n                    {children}\n                </View>\n            );\n        }\n    }\n);\n\nButtonGhost.displayName = 'Button Ghost';\n\nconst Icon = styled.div<{ iconColor?: string }>`\n    display: flex;\n    flex-direction: row;\n    justify-content: flex-end;\n    align-items: center;\n    width: 35px;\n    height: 35px;\n\n    color: ${({ iconColor }) => iconColor || 'inherit'};\n\n    transition: transform 0.2s ease-in-out;\n\n    ${View}:hover > & {\n        transform: translateX(3px);\n    }\n`;\n\nconst Label = styled.span`\n    display: inline-block;\n\n    max-width: 100%;\n\n    overflow: hidden;\n    white-space: nowrap;\n    text-overflow: ellipsis;\n`;\n\nexport default { View: ButtonGhost, Label: Label, Icon: Icon };\n"],"names":["View","styled","a","templateObject_3","__makeTemplateObject","_a","size","spacings","spacer","theme","font","copy","medium","family","withRange","weight","letterSpacing","global","sections","edgeRadius","disable","inverted","color","elementBg","primary","default","hexToRgba","text","nudge","css","templateObject_2","mq","semilarge","Button","React","forwardRef","ref","as","_b","isInverted","isDisabled","onClick","className","children","rest","__rest","createElement","__assign","href","target","isExternal","undefined","rel","displayName","Icon","div","templateObject_4","iconColor","Label","span","templateObject_5","light","dark","ButtonGhost"],"mappings":"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"}

package/esm/Control-52ff8784.js

@@ -1,157 +0,0 @@
-import { a as __makeTemplateObject, d as __rest, _ as __assign } from './ClockFilled-cff5900e.js';
-import * as React from 'react';
-import React__default from 'react';
-import styled from 'styled-components';
-import { a as getFonts, w as withRange, g as getColors, s as spacings } from './styles-eca3acc8.js';
-
-var View$1 = styled.a.withConfig({
-  displayName: "Pointer__View",
-  componentId: "sc-1jne5k6-0"
-})(templateObject_1$1 || (templateObject_1$1 = __makeTemplateObject(["\n    padding: 0.2em 0;\n\n    display: inline-block;\n    display: inline-flex;\n    flex-direction: row;\n    flex-wrap: nowrap;\n    justify-content: center;\n    align-items: center;\n    vertical-align: middle;\n\n    font-family: ", ";\n    ", "\n    font-weight: ", ";\n    text-align: center;\n    text-decoration: ", ";\n    line-height: 1;\n    letter-spacing: ", ";\n\n    perspective: 1000;\n    -webkit-font-smoothing: subpixel-antialiased;\n    -webkit-perspective: 1000;\n    -moz-osx-font-smoothing: grayscale;\n    will-change: auto;\n\n    outline-color: ", ";\n    border: none;\n    cursor: pointer;\n\n    pointer-events: ", ";\n\n    background: none;\n    color: ", ";\n\n    & > * {\n        color: ", ";\n    }\n\n    & > * + * {\n        margin-left: ", "px;\n    }\n\n    & > :not(:last-child) {\n        padding-right: ", "px;\n    }\n\n    @media (hover: hover) and (pointer: fine) {\n        &:hover {\n            opacity: 0.6;\n        }\n    }\n\n    &:focus {\n        outline: 2px solid ", ";\n    }\n\n    &:focus:not(:focus-visible) {\n        outline: none;\n    }\n\n    &:active {\n        opacity: 0.6;\n    }\n"], ["\n    padding: 0.2em 0;\n\n    display: inline-block;\n    display: inline-flex;\n    flex-direction: row;\n    flex-wrap: nowrap;\n    justify-content: center;\n    align-items: center;\n    vertical-align: middle;\n\n    font-family: ", ";\n    ", "\n    font-weight: ", ";\n    text-align: center;\n    text-decoration: ", ";\n    line-height: 1;\n    letter-spacing: ", ";\n\n    perspective: 1000;\n    -webkit-font-smoothing: subpixel-antialiased;\n    -webkit-perspective: 1000;\n    -moz-osx-font-smoothing: grayscale;\n    will-change: auto;\n\n    outline-color: ", ";\n    border: none;\n    cursor: pointer;\n\n    pointer-events: ", ";\n\n    background: none;\n    color: ", ";\n\n    & > * {\n        color: ", ";\n    }\n\n    & > * + * {\n        margin-left: ", "px;\n    }\n\n    & > :not(:last-child) {\n        padding-right: ", "px;\n    }\n\n    @media (hover: hover) and (pointer: fine) {\n        &:hover {\n            opacity: 0.6;\n        }\n    }\n\n    &:focus {\n        outline: 2px solid ", ";\n    }\n\n    &:focus:not(:focus-visible) {\n        outline: none;\n    }\n\n    &:active {\n        opacity: 0.6;\n    }\n"])), function (_a) {
-  var theme = _a.theme;
-  return getFonts(theme).copy.medium.family;
-}, function (_a) {
-  var theme = _a.theme;
-  return withRange(getFonts(theme).copy.medium.size, 'font-size');
-}, function (_a) {
-  var theme = _a.theme;
-  return getFonts(theme).copy.medium.weight;
-}, function (_a) {
-  var textDecoration = _a.textDecoration;
-  return textDecoration ? textDecoration : 'underline';
-}, function (_a) {
-  var theme = _a.theme;
-  return getFonts(theme).copy.medium.letterSpacing;
-}, function (_a) {
-  var theme = _a.theme,
-      inverted = _a.inverted;
-  return inverted ? getColors(theme).primary.inverted : getColors(theme).primary.default;
-}, function (_a) {
-  var disable = _a.disable;
-  return disable ? 'none' : 'all';
-}, function (_a) {
-  var theme = _a.theme,
-      inverted = _a.inverted,
-      disable = _a.disable;
-  return disable ? getColors(theme).elementBg.medium : inverted ? getColors(theme).text.copyInverted : getColors(theme).text.copy;
-}, function (_a) {
-  var theme = _a.theme,
-      inverted = _a.inverted,
-      disable = _a.disable;
-  return disable ? getColors(theme).elementBg.medium : inverted ? getColors(theme).text.copyInverted : getColors(theme).text.copy;
-}, spacings.nudge, spacings.nudge, function (_a) {
-  var theme = _a.theme;
-  return getColors(theme).primary.default;
-});
-var Pointer = React.forwardRef(function (_a, ref) {
-  var as = _a.as,
-      isInverted = _a.isInverted,
-      isDisabled = _a.isDisabled,
-      onClick = _a.onClick,
-      className = _a.className,
-      textDecoration = _a.textDecoration,
-      children = _a.children,
-      rest = __rest(_a, ["as", "isInverted", "isDisabled", "onClick", "className", "textDecoration", "children"]);
-
-  if (as === 'button') {
-    return React.createElement(View$1, __assign({
-      textDecoration: textDecoration,
-      ref: ref,
-      as: as,
-      inverted: isInverted,
-      disable: isDisabled,
-      onClick: onClick,
-      className: className
-    }, rest), children);
-  } else {
-    return React.createElement(View$1, __assign({
-      textDecoration: textDecoration,
-      ref: ref,
-      as: as,
-      href: rest.href,
-      "data-disabled": isDisabled,
-      "data-inverted": isInverted,
-      target: rest.isExternal ? '_blank' : undefined,
-      rel: rest.isExternal ? 'noopener noreferrer' : undefined,
-      inverted: isInverted,
-      disable: isDisabled,
-      onClick: onClick,
-      className: className
-    }, rest), children);
-  }
-});
-Pointer.displayName = 'Button';
-var Icon = styled.div.withConfig({
-  displayName: "Pointer__Icon",
-  componentId: "sc-1jne5k6-1"
-})(templateObject_2 || (templateObject_2 = __makeTemplateObject(["\n    display: flex;\n    flex-direction: row;\n    justify-content: flex-end;\n    align-items: center;\n\n    color: ", ";\n\n    transition: transform 0.2s ease-in-out;\n\n    ", "[data-inverted='true'] > & {\n        color: ", ";\n    }\n\n    ", "[data-disabled='true'] > & {\n        color: ", ";\n    }\n\n    ", ":hover > & {\n        transform: translateX(3px);\n    }\n"], ["\n    display: flex;\n    flex-direction: row;\n    justify-content: flex-end;\n    align-items: center;\n\n    color: ", ";\n\n    transition: transform 0.2s ease-in-out;\n\n    ", "[data-inverted='true'] > & {\n        color: ", ";\n    }\n\n    ", "[data-disabled='true'] > & {\n        color: ", ";\n    }\n\n    ", ":hover > & {\n        transform: translateX(3px);\n    }\n"])), function (_a) {
-  var theme = _a.theme,
-      iconColor = _a.iconColor;
-  return iconColor || getColors(theme).text.copy;
-}, View$1, function (_a) {
-  var theme = _a.theme,
-      iconColor = _a.iconColor;
-  return iconColor || getColors(theme).text.copyInverted;
-}, View$1, function (_a) {
-  var theme = _a.theme,
-      iconColor = _a.iconColor;
-  return iconColor || getColors(theme).elementBg.medium;
-}, View$1);
-var Label = styled.span.withConfig({
-  displayName: "Pointer__Label",
-  componentId: "sc-1jne5k6-2"
-})(templateObject_3 || (templateObject_3 = __makeTemplateObject(["\n    display: inline-block;\n"], ["\n    display: inline-block;\n"])));
-var Pointer$1 = {
-  View: Pointer,
-  Label: Label,
-  Icon: Icon
-};
-var templateObject_1$1, templateObject_2, templateObject_3;
-
-var View = styled.button.withConfig({
-  displayName: "Control__View",
-  componentId: "sc-mj9u2f-0"
-})(templateObject_1 || (templateObject_1 = __makeTemplateObject(["\n    display: inline-flex;\n    align-items: center;\n    justify-content: center;\n\n    background: none;\n    outline: none;\n    padding: 0;\n    margin: 0;\n    border: none;\n\n    color: ", ";\n    opacity: ", ";\n    cursor: ", ";\n\n    transition: color 0.2s ease-in-out, opacity 0.2s ease-in-out;\n\n    @media (hover: hover) and (pointer: fine) {\n        &:hover {\n            color: ", ";\n        }\n    }\n\n    &:focus {\n        outline: dotted 2px\n            ", ";\n        outline-offset: 4px;\n\n        color: ", ";\n    }\n\n    &:focus:not(:focus-visible) {\n        outline: none;\n    }\n"], ["\n    display: inline-flex;\n    align-items: center;\n    justify-content: center;\n\n    background: none;\n    outline: none;\n    padding: 0;\n    margin: 0;\n    border: none;\n\n    color: ", ";\n    opacity: ", ";\n    cursor: ", ";\n\n    transition: color 0.2s ease-in-out, opacity 0.2s ease-in-out;\n\n    @media (hover: hover) and (pointer: fine) {\n        &:hover {\n            color: ", ";\n        }\n    }\n\n    &:focus {\n        outline: dotted 2px\n            ", ";\n        outline-offset: 4px;\n\n        color: ", ";\n    }\n\n    &:focus:not(:focus-visible) {\n        outline: none;\n    }\n"])), function (_a) {
-  var theme = _a.theme,
-      isInverted = _a.isInverted;
-  return isInverted ? getColors(theme).text.inverted : getColors(theme).text.default;
-}, function (_a) {
-  var disabled = _a.disabled;
-  return disabled ? 0.4 : 1;
-}, function (_a) {
-  var disabled = _a.disabled;
-  return disabled ? 'default' : 'pointer';
-}, function (_a) {
-  var theme = _a.theme,
-      isInverted = _a.isInverted;
-  return isInverted ? getColors(theme).primary.invertedHover : getColors(theme).primary.hover;
-}, function (_a) {
-  var theme = _a.theme,
-      isInverted = _a.isInverted;
-  return isInverted ? getColors(theme).primary.inverted : getColors(theme).primary.default;
-}, function (_a) {
-  var theme = _a.theme,
-      isInverted = _a.isInverted;
-  return isInverted ? getColors(theme).primary.invertedHover : getColors(theme).primary.hover;
-});
-
-var Control = function (_a) {
-  var isInverted = _a.isInverted,
-      isDisabled = _a.isDisabled,
-      _b = _a.ariaLabel,
-      ariaLabel = _b === void 0 ? 'control' : _b,
-      onClick = _a.onClick,
-      className = _a.className,
-      children = _a.children;
-  return React__default.createElement(View, {
-    isInverted: isInverted,
-    disabled: isDisabled,
-    "aria-label": ariaLabel,
-    onClick: onClick,
-    className: className
-  }, children);
-};
-var templateObject_1;
-
-export { Control as C, Pointer$1 as P };
-//# sourceMappingURL=Control-52ff8784.js.map

package/esm/Control-52ff8784.js.map

@@ -1 +0,0 @@
-{"version":3,"file":"Control-52ff8784.js","sources":["../src/components/buttons/Pointer.tsx","../src/components/buttons/Control.tsx"],"sourcesContent":["import * as React from 'react';\nimport styled from 'styled-components';\n\nimport {\n    getColors as color,\n    getFonts as font,\n    spacings,\n    withRange,\n} from 'utils/styles';\n\nconst View = styled.a<{\n    inverted?: boolean;\n    disable?: boolean;\n    textDecoration?: 'none' | 'underline';\n}>`\n    padding: 0.2em 0;\n\n    display: inline-block;\n    display: inline-flex;\n    flex-direction: row;\n    flex-wrap: nowrap;\n    justify-content: center;\n    align-items: center;\n    vertical-align: middle;\n\n    font-family: ${({ theme }) => font(theme).copy.medium.family};\n    ${({ theme }) => withRange(font(theme).copy.medium.size, 'font-size')}\n    font-weight: ${({ theme }) => font(theme).copy.medium.weight};\n    text-align: center;\n    text-decoration: ${({ textDecoration }) =>\n        textDecoration ? textDecoration : 'underline'};\n    line-height: 1;\n    letter-spacing: ${({ theme }) => font(theme).copy.medium.letterSpacing};\n\n    perspective: 1000;\n    -webkit-font-smoothing: subpixel-antialiased;\n    -webkit-perspective: 1000;\n    -moz-osx-font-smoothing: grayscale;\n    will-change: auto;\n\n    outline-color: ${({ theme, inverted }) =>\n        inverted\n            ? color(theme).primary.inverted\n            : color(theme).primary.default};\n    border: none;\n    cursor: pointer;\n\n    pointer-events: ${({ disable }) => (disable ? 'none' : 'all')};\n\n    background: none;\n    color: ${({ theme, inverted, disable }) =>\n        disable\n            ? color(theme).elementBg.medium\n            : inverted\n            ? color(theme).text.copyInverted\n            : color(theme).text.copy};\n\n    & > * {\n        color: ${({ theme, inverted, disable }) =>\n            disable\n                ? color(theme).elementBg.medium\n                : inverted\n                ? color(theme).text.copyInverted\n                : color(theme).text.copy};\n    }\n\n    & > * + * {\n        margin-left: ${spacings.nudge}px;\n    }\n\n    & > :not(:last-child) {\n        padding-right: ${spacings.nudge}px;\n    }\n\n    @media (hover: hover) and (pointer: fine) {\n        &:hover {\n            opacity: 0.6;\n        }\n    }\n\n    &:focus {\n        outline: 2px solid ${({ theme }) => color(theme).primary.default};\n    }\n\n    &:focus:not(:focus-visible) {\n        outline: none;\n    }\n\n    &:active {\n        opacity: 0.6;\n    }\n`;\n\ninterface Props {\n    isInverted?: boolean;\n    isDisabled?: boolean;\n    onClick?: () => void;\n    textDecoration?: 'none' | 'underline';\n    className?: string;\n    children?: React.ReactNode;\n}\n\nexport type BtnProps = Props & {\n    as?: 'button';\n};\n\nexport type LinkProps = Props & {\n    as?: 'a';\n    href?: string;\n    isExternal?: boolean;\n};\n\nconst Pointer: React.FC<BtnProps | LinkProps> = React.forwardRef(\n    (\n        {\n            as,\n            isInverted,\n            isDisabled,\n            onClick,\n            className,\n            textDecoration,\n            children,\n            ...rest\n        },\n        ref\n    ) => {\n        if (as === 'button') {\n            return (\n                <View\n                    textDecoration={textDecoration}\n                    ref={ref}\n                    as={as as any}\n                    inverted={isInverted}\n                    disable={isDisabled}\n                    onClick={onClick}\n                    className={className}\n                    {...rest}\n                >\n                    {children}\n                </View>\n            );\n        } else {\n            return (\n                <View\n                    textDecoration={textDecoration}\n                    ref={ref}\n                    as={as as any}\n                    href={(rest as LinkProps).href}\n                    data-disabled={isDisabled}\n                    data-inverted={isInverted}\n                    target={\n                        (rest as LinkProps).isExternal ? '_blank' : undefined\n                    }\n                    rel={\n                        (rest as LinkProps).isExternal\n                            ? 'noopener noreferrer'\n                            : undefined\n                    }\n                    inverted={isInverted}\n                    disable={isDisabled}\n                    onClick={onClick}\n                    className={className}\n                    {...rest}\n                >\n                    {children}\n                </View>\n            );\n        }\n    }\n);\n\nPointer.displayName = 'Button';\n\nconst Icon = styled.div<{ iconColor?: string }>`\n    display: flex;\n    flex-direction: row;\n    justify-content: flex-end;\n    align-items: center;\n\n    color: ${({ theme, iconColor }) => iconColor || color(theme).text.copy};\n\n    transition: transform 0.2s ease-in-out;\n\n    ${View}[data-inverted='true'] > & {\n        color: ${({ theme, iconColor }) =>\n            iconColor || color(theme).text.copyInverted};\n    }\n\n    ${View}[data-disabled='true'] > & {\n        color: ${({ theme, iconColor }) =>\n            iconColor || color(theme).elementBg.medium};\n    }\n\n    ${View}:hover > & {\n        transform: translateX(3px);\n    }\n`;\n\nconst Label = styled.span`\n    display: inline-block;\n`;\n\nexport default { View: Pointer, Label: Label, Icon: Icon };\n","import React, { FC } from 'react';\nimport styled from 'styled-components';\n\nimport { getColors as color } from 'utils/styles';\n\nconst View = styled.button<{ isInverted?: boolean; disabled?: boolean }>`\n    display: inline-flex;\n    align-items: center;\n    justify-content: center;\n\n    background: none;\n    outline: none;\n    padding: 0;\n    margin: 0;\n    border: none;\n\n    color: ${({ theme, isInverted }) =>\n        isInverted ? color(theme).text.inverted : color(theme).text.default};\n    opacity: ${({ disabled }) => (disabled ? 0.4 : 1)};\n    cursor: ${({ disabled }) => (disabled ? 'default' : 'pointer')};\n\n    transition: color 0.2s ease-in-out, opacity 0.2s ease-in-out;\n\n    @media (hover: hover) and (pointer: fine) {\n        &:hover {\n            color: ${({ theme, isInverted }) =>\n                isInverted\n                    ? color(theme).primary.invertedHover\n                    : color(theme).primary.hover};\n        }\n    }\n\n    &:focus {\n        outline: dotted 2px\n            ${({ theme, isInverted }) =>\n                isInverted\n                    ? color(theme).primary.inverted\n                    : color(theme).primary.default};\n        outline-offset: 4px;\n\n        color: ${({ theme, isInverted }) =>\n            isInverted\n                ? color(theme).primary.invertedHover\n                : color(theme).primary.hover};\n    }\n\n    &:focus:not(:focus-visible) {\n        outline: none;\n    }\n`;\n\nconst Control: FC<{\n    isInverted?: boolean;\n    isDisabled?: boolean;\n    ariaLabel?: string;\n    className?: string;\n    children?: React.ReactNode;\n    onClick?: (ev: React.SyntheticEvent<HTMLButtonElement>) => void;\n}> = ({\n    isInverted,\n    isDisabled,\n    ariaLabel = 'control',\n    onClick,\n    className,\n    children,\n}) => {\n    return (\n        <View\n            isInverted={isInverted}\n            disabled={isDisabled}\n            aria-label={ariaLabel}\n            onClick={onClick}\n            className={className}\n        >\n            {children}\n        </View>\n    );\n};\n\nexport default Control;\n"],"names":["View","styled","a","templateObject_1","__makeTemplateObject","_a","theme","font","copy","medium","family","withRange","size","weight","textDecoration","letterSpacing","inverted","color","primary","default","disable","elementBg","text","copyInverted","spacings","nudge","Pointer","React","forwardRef","ref","as","isInverted","isDisabled","onClick","className","children","rest","__rest","createElement","__assign","href","target","isExternal","undefined","rel","displayName","Icon","div","templateObject_2","iconColor","Label","span","templateObject_3","button","disabled","invertedHover","hover","Control","_b","ariaLabel"],"mappings":"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"}