@blateral/b.kit 2.4.1 → 2.5.0-beta.1.0

package/esm/Button-f9279013.js

@@ -0,0 +1,115 @@
+import { a as __makeTemplateObject, d as __rest, _ as __assign } from './ClockFilled-62515a8f.js';
+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-da982973.js';
+
+var View = styled.a.withConfig({
+  displayName: "Button__View",
+  componentId: "sc-2gssup-0"
+})(templateObject_3 || (templateObject_3 = __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 || (templateObject_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 || (templateObject_2 = __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, __assign({
+      ref: ref,
+      as: as,
+      size: size,
+      inverted: isInverted,
+      disable: isDisabled,
+      onClick: onClick,
+      className: className
+    }, rest), children);
+  } else {
+    return React__default.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);
+  }
+});
+Button.displayName = 'Button';
+var Icon = styled.div.withConfig({
+  displayName: "Button__Icon",
+  componentId: "sc-2gssup-1"
+})(templateObject_4 || (templateObject_4 = __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);
+var Label = 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,
+  Icon: Icon
+};
+var templateObject_1, templateObject_2, templateObject_3, templateObject_4, templateObject_5;
+
+export { Button$1 as B };
+//# sourceMappingURL=Button-f9279013.js.map

package/esm/Button-f9279013.js.map

@@ -0,0 +1 @@
+{"version":3,"file":"Button-f9279013.js","sources":["../src/components/buttons/Button.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"],"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"],"mappings":"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"}

package/esm/ButtonGhost-ae2e97a2.js

@@ -0,0 +1,112 @@
+import { a as __makeTemplateObject, d as __rest, _ as __assign } from './ClockFilled-62515a8f.js';
+import * as React 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, g as getColors, c as getGlobals } from './styles-da982973.js';
+
+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 };
+//# sourceMappingURL=ButtonGhost-ae2e97a2.js.map

package/esm/ButtonGhost-ae2e97a2.js.map

@@ -0,0 +1 @@
+{"version":3,"file":"ButtonGhost-ae2e97a2.js","sources":["../src/components/buttons/ButtonGhost.tsx"],"sourcesContent":["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","_a","size","spacings","spacer","theme","font","copy","medium","family","withRange","weight","letterSpacing","inverted","disable","color","elementBg","light","dark","global","sections","edgeRadius","hexToRgba","text","default","nudge","css","primary","ButtonGhost","React","forwardRef","ref","as","_b","isInverted","isDisabled","onClick","className","children","rest","__rest","createElement","__assign","href","target","isExternal","undefined","rel","displayName","Icon","div","templateObject_3","__makeTemplateObject","iconColor","Label","span","templateObject_4"],"mappings":"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"}

package/esm/Callout-a926194d.js

@@ -0,0 +1,99 @@
+import { a as __makeTemplateObject, d as __rest, _ as __assign } from './ClockFilled-62515a8f.js';
+import * as React from 'react';
+import styled, { css } from 'styled-components';
+import { u as useLibTheme } from './LibThemeProvider-52555ac9.js';
+import { e as styleTextColor, m as mq, a as getFonts, w as withRange } from './styles-da982973.js';
+
+var BaseStyles = styled.h1.withConfig({
+  displayName: "Callout__BaseStyles",
+  componentId: "sc-1rvhtfe-0"
+})(templateObject_2 || (templateObject_2 = __makeTemplateObject(["\n    margin: 0;\n    padding: 0;\n    ", "\n\n    hyphens: auto;\n\n    ", "\n\n    text-shadow: ", ";\n\n    h1,\n    h2,\n    h3,\n    h4,\n    h5,\n    h6 {\n        margin: 0;\n        padding: 0;\n        border: 0;\n        outline: 0;\n        font-weight: inherit;\n        font-style: inherit;\n        font-size: 100%;\n        font-family: inherit;\n        vertical-align: baseline;\n    }\n"], ["\n    margin: 0;\n    padding: 0;\n    ", "\n\n    hyphens: auto;\n\n    ", "\n\n    text-shadow: ", ";\n\n    h1,\n    h2,\n    h3,\n    h4,\n    h5,\n    h6 {\n        margin: 0;\n        padding: 0;\n        border: 0;\n        outline: 0;\n        font-weight: inherit;\n        font-style: inherit;\n        font-size: 100%;\n        font-family: inherit;\n        vertical-align: baseline;\n    }\n"])), function (_a) {
+  var textColor = _a.textColor,
+      textGradient = _a.textGradient;
+  return styleTextColor(textColor, textGradient);
+}, function (props) {
+  return !props.hyphens && css(templateObject_1 || (templateObject_1 = __makeTemplateObject(["\n            @media ", " {\n                hyphens: none;\n            }\n        "], ["\n            @media ", " {\n                hyphens: none;\n            }\n        "])), mq.large);
+}, function (_a) {
+  var hasShadow = _a.hasShadow;
+  return hasShadow && '1px 2px 8px rgba(0, 0, 0, 0.25)';
+});
+var View = styled(BaseStyles).withConfig({
+  displayName: "Callout__View",
+  componentId: "sc-1rvhtfe-1"
+})(templateObject_3 || (templateObject_3 = __makeTemplateObject(["\n    font-family: ", ";\n    font-weight: ", ";\n    font-style: ", ";\n    ", "\n    line-height: ", ";\n    letter-spacing: ", ";\n    text-transform: ", ";\n    text-decoration: ", ";\n"], ["\n    font-family: ", ";\n    font-weight: ", ";\n    font-style: ", ";\n    ", "\n    line-height: ", ";\n    letter-spacing: ", ";\n    text-transform: ", ";\n    text-decoration: ", ";\n"])), function (_a) {
+  var theme = _a.theme,
+      size = _a.size;
+  return getFonts(theme).callout[size].family;
+}, function (_a) {
+  var theme = _a.theme,
+      size = _a.size;
+  return getFonts(theme).callout[size].weight;
+}, function (_a) {
+  var theme = _a.theme,
+      size = _a.size;
+  return getFonts(theme).callout[size].style;
+}, function (_a) {
+  var theme = _a.theme,
+      size = _a.size;
+  return withRange(getFonts(theme).callout[size].size, 'font-size');
+}, function (_a) {
+  var theme = _a.theme,
+      size = _a.size;
+  return getFonts(theme).callout[size].lineHeight;
+}, function (_a) {
+  var theme = _a.theme,
+      size = _a.size;
+  return getFonts(theme).callout[size].letterSpacing;
+}, function (_a) {
+  var theme = _a.theme,
+      size = _a.size;
+  return getFonts(theme).callout[size].textTransform;
+}, function (_a) {
+  var theme = _a.theme,
+      size = _a.size;
+  return getFonts(theme).callout[size].textDecoration;
+});
+
+var Callout = function (_a) {
+  var _b;
+
+  var isInverted = _a.isInverted,
+      _c = _a.renderAs,
+      renderAs = _c === void 0 ? 'h2' : _c,
+      className = _a.className,
+      _d = _a.size,
+      size = _d === void 0 ? 'medium' : _d,
+      textColor = _a.textColor,
+      textGradient = _a.textGradient,
+      _e = _a.hyphens,
+      hyphens = _e === void 0 ? false : _e,
+      _f = _a.hasShadow,
+      hasShadow = _f === void 0 ? false : _f,
+      innerHTML = _a.innerHTML,
+      children = _a.children,
+      rest = __rest(_a, ["isInverted", "renderAs", "className", "size", "textColor", "textGradient", "hyphens", "hasShadow", "innerHTML", "children"]);
+
+  var fonts = useLibTheme().fonts;
+  var fontSettings = (_b = fonts === null || fonts === void 0 ? void 0 : fonts.callout) === null || _b === void 0 ? void 0 : _b[size];
+  return React.createElement(View, __assign({
+    as: renderAs,
+    size: size,
+    textColor: textColor || (isInverted ? fontSettings.colorInverted : fontSettings.color),
+    textGradient: textGradient || (!textColor ? isInverted ? fontSettings.colorGradientInverted : fontSettings.colorGradient : undefined),
+    hyphens: hyphens,
+    hasShadow: hasShadow,
+    dangerouslySetInnerHTML: innerHTML && !children ? {
+      __html: innerHTML
+    } : undefined,
+    className: className
+  }, rest), children);
+};
+
+Callout.defaultProps = {
+  renderAs: 'h1',
+  size: 'medium'
+};
+var templateObject_1, templateObject_2, templateObject_3;
+
+export { Callout as C };
+//# sourceMappingURL=Callout-a926194d.js.map

package/esm/Callout-a926194d.js.map

@@ -0,0 +1 @@
+{"version":3,"file":"Callout-a926194d.js","sources":["../src/components/typography/Callout.tsx"],"sourcesContent":["import * as React from 'react';\nimport styled, { css } from 'styled-components';\nimport { useLibTheme } from 'utils/LibThemeProvider';\nimport {\n    CalloutFontOptionType,\n    getFonts as font,\n    mq,\n    styleTextColor,\n    withRange,\n} from 'utils/styles';\n\n// Styles\nconst BaseStyles = styled.h1<{\n    size: CalloutFontOptionType;\n    hyphens?: boolean;\n    hasShadow?: boolean;\n    textColor?: string;\n    textGradient?: string;\n}>`\n    margin: 0;\n    padding: 0;\n    ${({ textColor, textGradient }) => styleTextColor(textColor, textGradient)}\n\n    hyphens: auto;\n\n    ${(props: { hyphens?: boolean }) =>\n        !props.hyphens &&\n        css`\n            @media ${mq.large} {\n                hyphens: none;\n            }\n        `}\n\n    text-shadow: ${({ hasShadow }) =>\n        hasShadow && '1px 2px 8px rgba(0, 0, 0, 0.25)'};\n\n    h1,\n    h2,\n    h3,\n    h4,\n    h5,\n    h6 {\n        margin: 0;\n        padding: 0;\n        border: 0;\n        outline: 0;\n        font-weight: inherit;\n        font-style: inherit;\n        font-size: 100%;\n        font-family: inherit;\n        vertical-align: baseline;\n    }\n`;\n\nconst View = styled(BaseStyles)`\n    font-family: ${({ theme, size }) => font(theme).callout[size].family};\n    font-weight: ${({ theme, size }) => font(theme).callout[size].weight};\n    font-style: ${({ theme, size }) => font(theme).callout[size].style};\n    ${({ theme, size }) =>\n        withRange(font(theme).callout[size].size, 'font-size')}\n    line-height: ${({ theme, size }) => font(theme).callout[size].lineHeight};\n    letter-spacing: ${({ theme, size }) =>\n        font(theme).callout[size].letterSpacing};\n    text-transform: ${({ theme, size }) =>\n        font(theme).callout[size].textTransform};\n    text-decoration: ${({ theme, size }) =>\n        font(theme).callout[size].textDecoration};\n`;\n\nexport type CalloutTag =\n    | 'h1'\n    | 'h2'\n    | 'h3'\n    | 'h4'\n    | 'h5'\n    | 'h6'\n    | 'span'\n    | 'div'\n    | 'blockquote';\n\nconst Callout: React.FC<{\n    isInverted?: boolean;\n    renderAs?: CalloutTag;\n    size?: CalloutFontOptionType;\n    textColor?: string;\n    textGradient?: string;\n    hyphens?: boolean;\n    hasShadow?: boolean;\n    innerHTML?: string;\n\n    className?: string;\n    children?: React.ReactNode;\n}> = ({\n    isInverted,\n    renderAs = 'h2',\n    className,\n    size = 'medium',\n    textColor,\n    textGradient,\n    hyphens = false,\n    hasShadow = false,\n    innerHTML,\n    children,\n    ...rest\n}) => {\n    const { fonts } = useLibTheme();\n    const fontSettings = fonts?.callout?.[size];\n\n    return (\n        <View\n            as={renderAs}\n            size={size}\n            textColor={\n                textColor ||\n                (isInverted ? fontSettings.colorInverted : fontSettings.color)\n            }\n            textGradient={\n                textGradient ||\n                (!textColor\n                    ? isInverted\n                        ? fontSettings.colorGradientInverted\n                        : fontSettings.colorGradient\n                    : undefined)\n            }\n            hyphens={hyphens}\n            hasShadow={hasShadow}\n            dangerouslySetInnerHTML={\n                innerHTML && !children ? { __html: innerHTML } : undefined\n            }\n            className={className}\n            {...rest}\n        >\n            {children}\n        </View>\n    );\n};\n\nCallout.defaultProps = {\n    renderAs: 'h1',\n    size: 'medium',\n};\n\nexport default Callout;\n"],"names":["BaseStyles","styled","h1","templateObject_2","__makeTemplateObject","_a","textColor","textGradient","styleTextColor","props","hyphens","css","templateObject_1","mq","large","hasShadow","View","templateObject_3","theme","size","font","callout","family","weight","style","withRange","lineHeight","letterSpacing","textTransform","textDecoration","Callout","isInverted","_c","renderAs","className","_d","_e","_f","innerHTML","children","rest","__rest","fonts","useLibTheme","fontSettings","_b","React","createElement","__assign","as","colorInverted","color","colorGradientInverted","colorGradient","undefined","dangerouslySetInnerHTML","__html","defaultProps"],"mappings":"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"}

package/esm/Checkbox-dd12facd.js

@@ -0,0 +1,135 @@
+import { a as __makeTemplateObject, C as Check } from './ClockFilled-62515a8f.js';
+import { C as Copy } from './Copy-a28aeb61.js';
+import React__default from 'react';
+import styled from 'styled-components';
+import { u as useLibTheme } from './LibThemeProvider-52555ac9.js';
+import { s as spacings, g as getColors } from './styles-da982973.js';
+
+var View = styled.label.withConfig({
+  displayName: "Checkbox__View",
+  componentId: "sc-ve3szk-0"
+})(templateObject_1 || (templateObject_1 = __makeTemplateObject(["\n    display: flex;\n    flex-direction: row;\n    align-items: center;\n\n    & > * + * {\n        margin-left: ", "px;\n    }\n"], ["\n    display: flex;\n    flex-direction: row;\n    align-items: center;\n\n    & > * + * {\n        margin-left: ", "px;\n    }\n"])), spacings.nudge * 2);
+var Label = styled(Copy).withConfig({
+  displayName: "Checkbox__Label",
+  componentId: "sc-ve3szk-1"
+})(templateObject_2 || (templateObject_2 = __makeTemplateObject(["\n    padding-top: 2px;\n    text-align: left;\n    user-select: none;\n\n    & > * {\n        margin: 0;\n    }\n"], ["\n    padding-top: 2px;\n    text-align: left;\n    user-select: none;\n\n    & > * {\n        margin: 0;\n    }\n"])));
+var CheckboxContainer = styled.div.withConfig({
+  displayName: "Checkbox__CheckboxContainer",
+  componentId: "sc-ve3szk-2"
+})(templateObject_3 || (templateObject_3 = __makeTemplateObject(["\n    color: ", ";\n    cursor: ", ";\n    pointer-events: ", ";\n\n    border: 2px solid transparent;\n\n    &:focus-within {\n        outline: 1px solid\n            ", ";\n        outline-offset: 0;\n    }\n"], ["\n    color: ", ";\n    cursor: ", ";\n    pointer-events: ", ";\n\n    border: 2px solid transparent;\n\n    &:focus-within {\n        outline: 1px solid\n            ", ";\n        outline-offset: 0;\n    }\n"])), function (_a) {
+  var theme = _a.theme;
+  return getColors(theme).text.inverted;
+}, function (_a) {
+  var isDisabled = _a.isDisabled;
+  return isDisabled ? 'default' : 'pointer';
+}, function (_a) {
+  var isDisabled = _a.isDisabled;
+  return isDisabled ? 'none' : 'all';
+}, function (_a) {
+  var theme = _a.theme,
+      isInverted = _a.isInverted,
+      isDisabled = _a.isDisabled;
+  return isDisabled ? 'transparent' : isInverted ? getColors(theme).primary.inverted : getColors(theme).primary.default;
+});
+var Original = styled.input.withConfig({
+  displayName: "Checkbox__Original",
+  componentId: "sc-ve3szk-3"
+})(templateObject_4 || (templateObject_4 = __makeTemplateObject(["\n    position: absolute;\n    left: -9999px;\n    opacity: 0;\n"], ["\n    position: absolute;\n    left: -9999px;\n    opacity: 0;\n"])));
+var Box = styled.span.withConfig({
+  displayName: "Checkbox__Box",
+  componentId: "sc-ve3szk-4"
+})(templateObject_5 || (templateObject_5 = __makeTemplateObject(["\n    width: 20px;\n    min-width: 20px;\n    height: 20px;\n    display: block;\n    position: relative;\n\n    border: 2px solid\n        ", ";\n\n    background-color: ", ";\n"], ["\n    width: 20px;\n    min-width: 20px;\n    height: 20px;\n    display: block;\n    position: relative;\n\n    border: 2px solid\n        ", ";\n\n    background-color: ", ";\n"])), function (_a) {
+  var isSelected = _a.isSelected,
+      isDisabled = _a.isDisabled,
+      isInverted = _a.isInverted,
+      theme = _a.theme;
+
+  if (isDisabled) {
+    return isInverted ? getColors(theme).text.subtileInverted : getColors(theme).text.subtile;
+  }
+
+  if (isSelected) {
+    return isInverted ? getColors(theme).primary.inverted : getColors(theme).primary.default;
+  }
+
+  return isInverted ? getColors(theme).elementBg.light : getColors(theme).elementBg.medium;
+}, function (_a) {
+  var isSelected = _a.isSelected,
+      isDisabled = _a.isDisabled,
+      isInverted = _a.isInverted,
+      theme = _a.theme;
+
+  if (isDisabled) {
+    return isInverted ? getColors(theme).text.subtileInverted : getColors(theme).text.subtile;
+  }
+
+  if (isSelected) {
+    return isInverted ? getColors(theme).primary.inverted : getColors(theme).primary.default;
+  }
+
+  return 'transparent';
+});
+var StyledCheck = styled(Check).withConfig({
+  displayName: "Checkbox__StyledCheck",
+  componentId: "sc-ve3szk-5"
+})(templateObject_6 || (templateObject_6 = __makeTemplateObject(["\n    width: 80%;\n    height: 80%;\n    display: block;\n    position: absolute;\n    top: 50%;\n    left: 50%;\n    transform: translate(-50%, -50%);\n"], ["\n    width: 80%;\n    height: 80%;\n    display: block;\n    position: absolute;\n    top: 50%;\n    left: 50%;\n    transform: translate(-50%, -50%);\n"])));
+
+var Checkbox = function (_a) {
+  var label = _a.label,
+      isDisabled = _a.isDisabled,
+      isSelected = _a.isSelected,
+      isInverted = _a.isInverted,
+      onChange = _a.onChange,
+      onBlur = _a.onBlur,
+      onClick = _a.onClick,
+      name = _a.name,
+      value = _a.value,
+      isRequired = _a.isRequired;
+  var colors = useLibTheme().colors;
+  return React__default.createElement(View, null, React__default.createElement(CheckboxContainer, {
+    isDisabled: isDisabled,
+    isInverted: isInverted,
+    onClick: onClick
+  }, React__default.createElement(Box, {
+    isSelected: isSelected,
+    isInverted: isInverted,
+    isDisabled: isDisabled
+  }, isSelected && React__default.createElement(StyledCheck, null)), React__default.createElement(Original, {
+    type: "checkbox",
+    name: "".concat(name, "[]"),
+    value: value,
+    checked: isSelected,
+    required: isRequired,
+    onChange: onChange,
+    onBlur: onBlur
+  })), label && React__default.createElement(Label, {
+    renderAs: "span",
+    size: "small",
+    type: "copy-b",
+    isInverted: isInverted,
+    textColor: isDisabled ? isInverted ? colors.text.subtileInverted : colors.text.subtile : undefined,
+    innerHTML: "".concat(label).concat(isRequired ? '<span> *</span>' : '')
+  }));
+};
+/**
+ * Function to compare both field prop states
+ * @param prev Previous props
+ * @param next Next props
+ * @returns
+ */
+
+
+var areEqual = function (prev, next) {
+  // only apply logic if memo functionality is enabled
+  if (!prev.enableMemo) return false;
+  if (prev.label !== next.label) return false;
+  if (prev.isSelected !== next.isSelected) return false;
+  if (prev.value !== next.value) return false;
+  return true;
+};
+
+var Checkbox$1 = React__default.memo(Checkbox, areEqual);
+var templateObject_1, templateObject_2, templateObject_3, templateObject_4, templateObject_5, templateObject_6;
+
+export { Checkbox$1 as C };
+//# sourceMappingURL=Checkbox-dd12facd.js.map

package/esm/Checkbox-dd12facd.js.map

@@ -0,0 +1 @@
+{"version":3,"file":"Checkbox-dd12facd.js","sources":["../src/components/fields/Checkbox.tsx"],"sourcesContent":["import Check from 'components/base/icons/Check';\nimport Copy from 'components/typography/Copy';\nimport React from 'react';\nimport styled from 'styled-components';\nimport { useLibTheme } from 'utils/LibThemeProvider';\nimport { getColors as color, spacings } from 'utils/styles';\n\nconst View = styled.label`\n    display: flex;\n    flex-direction: row;\n    align-items: center;\n\n    & > * + * {\n        margin-left: ${spacings.nudge * 2}px;\n    }\n`;\n\nconst Label = styled(Copy)`\n    padding-top: 2px;\n    text-align: left;\n    user-select: none;\n\n    & > * {\n        margin: 0;\n    }\n`;\n\nconst CheckboxContainer = styled.div<{\n    isDisabled?: boolean;\n    isInverted?: boolean;\n}>`\n    color: ${({ theme }) => color(theme).text.inverted};\n    cursor: ${({ isDisabled }) => (isDisabled ? 'default' : 'pointer')};\n    pointer-events: ${({ isDisabled }) => (isDisabled ? 'none' : 'all')};\n\n    border: 2px solid transparent;\n\n    &:focus-within {\n        outline: 1px solid\n            ${({ theme, isInverted, isDisabled }) =>\n                isDisabled\n                    ? 'transparent'\n                    : isInverted\n                    ? color(theme).primary.inverted\n                    : color(theme).primary.default};\n        outline-offset: 0;\n    }\n`;\n\nconst Original = styled.input`\n    position: absolute;\n    left: -9999px;\n    opacity: 0;\n`;\n\nconst Box = styled.span<{\n    isSelected?: boolean;\n    isInverted?: boolean;\n    isDisabled?: boolean;\n}>`\n    width: 20px;\n    min-width: 20px;\n    height: 20px;\n    display: block;\n    position: relative;\n\n    border: 2px solid\n        ${({ isSelected, isDisabled, isInverted, theme }) => {\n            if (isDisabled) {\n                return isInverted\n                    ? color(theme).text.subtileInverted\n                    : color(theme).text.subtile;\n            }\n            if (isSelected) {\n                return isInverted\n                    ? color(theme).primary.inverted\n                    : color(theme).primary.default;\n            }\n            return isInverted\n                ? color(theme).elementBg.light\n                : color(theme).elementBg.medium;\n        }};\n\n    background-color: ${({ isSelected, isDisabled, isInverted, theme }) => {\n        if (isDisabled) {\n            return isInverted\n                ? color(theme).text.subtileInverted\n                : color(theme).text.subtile;\n        }\n        if (isSelected) {\n            return isInverted\n                ? color(theme).primary.inverted\n                : color(theme).primary.default;\n        }\n        return 'transparent';\n    }};\n`;\n\nconst StyledCheck = styled(Check)`\n    width: 80%;\n    height: 80%;\n    display: block;\n    position: absolute;\n    top: 50%;\n    left: 50%;\n    transform: translate(-50%, -50%);\n`;\n\nexport interface CheckboxProps {\n    enableMemo?: boolean;\n    label?: string;\n\n    onChange?: (e: React.SyntheticEvent<HTMLInputElement>) => void;\n    onBlur?: (e: React.SyntheticEvent<HTMLInputElement>) => void;\n    onClick?: () => void;\n\n    name?: string;\n    value?: string;\n\n    isDisabled?: boolean;\n    isSelected?: boolean;\n    isInverted?: boolean;\n    isRequired?: boolean;\n}\n\nconst Checkbox: React.FC<CheckboxProps> = ({\n    label,\n    isDisabled,\n    isSelected,\n    isInverted,\n    onChange,\n    onBlur,\n    onClick,\n    name,\n    value,\n    isRequired,\n}) => {\n    const { colors } = useLibTheme();\n\n    return (\n        <View>\n            <CheckboxContainer\n                isDisabled={isDisabled}\n                isInverted={isInverted}\n                onClick={onClick}\n            >\n                <Box\n                    isSelected={isSelected}\n                    isInverted={isInverted}\n                    isDisabled={isDisabled}\n                >\n                    {isSelected && <StyledCheck />}\n                </Box>\n                <Original\n                    type=\"checkbox\"\n                    name={`${name}[]`}\n                    value={value}\n                    checked={isSelected}\n                    required={isRequired}\n                    onChange={onChange}\n                    onBlur={onBlur}\n                />\n            </CheckboxContainer>\n            {label && (\n                <Label\n                    renderAs=\"span\"\n                    size=\"small\"\n                    type=\"copy-b\"\n                    isInverted={isInverted}\n                    textColor={\n                        isDisabled\n                            ? isInverted\n                                ? colors.text.subtileInverted\n                                : colors.text.subtile\n                            : undefined\n                    }\n                    innerHTML={`${label}${isRequired ? '<span> *</span>' : ''}`}\n                />\n            )}\n        </View>\n    );\n};\n\n/**\n * Function to compare both field prop states\n * @param prev Previous props\n * @param next Next props\n * @returns\n */\nconst areEqual = (prev: CheckboxProps, next: CheckboxProps) => {\n    // only apply logic if memo functionality is enabled\n    if (!prev.enableMemo) return false;\n\n    if (prev.label !== next.label) return false;\n    if (prev.isSelected !== next.isSelected) return false;\n    if (prev.value !== next.value) return false;\n\n    return true;\n};\n\nexport default React.memo(Checkbox, areEqual);\n"],"names":["View","styled","label","spacings","nudge","Label","Copy","templateObject_2","__makeTemplateObject","CheckboxContainer","div","_a","theme","color","text","inverted","isDisabled","isInverted","primary","default","Original","input","templateObject_4","Box","span","templateObject_5","isSelected","subtileInverted","subtile","elementBg","light","medium","StyledCheck","Check","templateObject_6","Checkbox","onChange","onBlur","onClick","name","value","isRequired","colors","useLibTheme","React","createElement","type","concat","checked","required","renderAs","size","textColor","undefined","innerHTML","areEqual","prev","next","enableMemo","memo"],"mappings":"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"}