@blateral/b.kit 2.8.4 → 3.0.1

package/esm/PickerAction-704f2992.js

@@ -0,0 +1,65 @@
+import { a as __makeTemplateObject } from './ButtonLeft-a9a132f5.js';
+import React__default from 'react';
+import styled from 'styled-components';
+import { a as getFonts, w as withRange, g as getColors } from './styles-f3ba5bae.js';
+
+var View = styled.button.withConfig({
+  displayName: "PickerAction__View",
+  componentId: "sc-1m5b3q3-0"
+})(templateObject_1 || (templateObject_1 = __makeTemplateObject(["\n    background: none;\n    border: none;\n    padding: 0;\n    margin: 0;\n\n    display: inline-block;\n    padding: 0.5em 0.8em;\n    white-space: nowrap;\n\n    font-family: ", ";\n    ", "\n    font-weight: ", ";\n    line-height: 1;\n    letter-spacing: ", ";\n    text-decoration: none;\n\n    background-color: ", ";\n    color: ", ";\n\n    transition: background-color 0.2s ease-in-out;\n\n    &:not(:disabled) {\n        cursor: pointer;\n    }\n\n    @media (hover: hover) and (pointer: fine) {\n        &:not(:disabled):hover {\n            background-color: ", ";\n        }\n    }\n\n    &:disabled {\n        filter: grayscale(1);\n        color: ", ";\n    }\n\n    &:active:not(:focus-visible) {\n        @media (hover: none) {\n            background-color: ", ";\n\n            transition: 0.2s background-color ease-in-out;\n            transition-timing-function: cubic-bezier(0.4, 0, 0.2, 1);\n            -webkit-tap-highlight-color: transparent;\n        }\n    }\n\n    &:focus-visible {\n        outline: 2px solid\n            ", ";\n        outline-offset: 2px;\n    }\n"], ["\n    background: none;\n    border: none;\n    padding: 0;\n    margin: 0;\n\n    display: inline-block;\n    padding: 0.5em 0.8em;\n    white-space: nowrap;\n\n    font-family: ", ";\n    ", "\n    font-weight: ", ";\n    line-height: 1;\n    letter-spacing: ", ";\n    text-decoration: none;\n\n    background-color: ", ";\n    color: ", ";\n\n    transition: background-color 0.2s ease-in-out;\n\n    &:not(:disabled) {\n        cursor: pointer;\n    }\n\n    @media (hover: hover) and (pointer: fine) {\n        &:not(:disabled):hover {\n            background-color: ", ";\n        }\n    }\n\n    &:disabled {\n        filter: grayscale(1);\n        color: ", ";\n    }\n\n    &:active:not(:focus-visible) {\n        @media (hover: none) {\n            background-color: ", ";\n\n            transition: 0.2s background-color ease-in-out;\n            transition-timing-function: cubic-bezier(0.4, 0, 0.2, 1);\n            -webkit-tap-highlight-color: transparent;\n        }\n    }\n\n    &:focus-visible {\n        outline: 2px solid\n            ", ";\n        outline-offset: 2px;\n    }\n"])), function (_a) {
+  var theme = _a.theme;
+  return getFonts(theme).copy.small.family;
+}, function (_a) {
+  var theme = _a.theme;
+  return withRange(getFonts(theme).copy.small.size, 'font-size');
+}, function (_a) {
+  var theme = _a.theme;
+  return getFonts(theme).copy.small.weight;
+}, function (_a) {
+  var theme = _a.theme;
+  return getFonts(theme).copy.small.letterSpacing;
+}, function (_a) {
+  var theme = _a.theme,
+      variant = _a.variant;
+  return variant === 'ghost' ? 'transparent' : getColors(theme).primary.default;
+}, function (_a) {
+  var theme = _a.theme,
+      variant = _a.variant;
+  return variant === 'ghost' ? getColors(theme).text.default : getColors(theme).text.inverted;
+}, function (_a) {
+  var theme = _a.theme,
+      variant = _a.variant;
+  return variant === 'ghost' ? getColors(theme).elementBg.medium : getColors(theme).primary.hover;
+}, function (_a) {
+  var theme = _a.theme,
+      variant = _a.variant;
+  return variant === 'ghost' ? getColors(theme).text.disabled : getColors(theme).text.inverted;
+}, function (_a) {
+  var theme = _a.theme,
+      variant = _a.variant;
+  return variant === 'ghost' ? getColors(theme).elementBg.medium : getColors(theme).primary.hover;
+}, function (_a) {
+  var theme = _a.theme,
+      variant = _a.variant;
+  return variant === 'ghost' ? getColors(theme).text.default : getColors(theme).primary.default;
+});
+
+var PickerAction = function (_a) {
+  var variant = _a.variant,
+      disabled = _a.disabled,
+      ariaLabel = _a.ariaLabel,
+      onClick = _a.onClick,
+      children = _a.children,
+      className = _a.className;
+  return React__default.createElement(View, {
+    variant: variant,
+    disabled: disabled,
+    onClick: onClick,
+    "aria-label": ariaLabel,
+    className: className
+  }, children);
+};
+var templateObject_1;
+
+export { PickerAction as P };
+//# sourceMappingURL=PickerAction-704f2992.js.map

package/esm/PickerAction-704f2992.js.map

@@ -0,0 +1 @@
+{"version":3,"file":"PickerAction-704f2992.js","sources":["../src/components/buttons/PickerAction.tsx"],"sourcesContent":["import React, { FC, ReactNode } from 'react';\nimport styled from 'styled-components';\nimport { getFonts as font, getColors as color, withRange } from 'utils/styles';\n\nexport type PickerActionVariant = 'default' | 'ghost';\n\nconst View = styled.button<{ variant?: PickerActionVariant }>`\n    background: none;\n    border: none;\n    padding: 0;\n    margin: 0;\n\n    display: inline-block;\n    padding: 0.5em 0.8em;\n    white-space: nowrap;\n\n    font-family: ${({ theme }) => font(theme).copy.small.family};\n    ${({ theme }) => withRange(font(theme).copy.small.size, 'font-size')}\n    font-weight: ${({ theme }) => font(theme).copy.small.weight};\n    line-height: 1;\n    letter-spacing: ${({ theme }) => font(theme).copy.small.letterSpacing};\n    text-decoration: none;\n\n    background-color: ${({ theme, variant }) =>\n        variant === 'ghost' ? 'transparent' : color(theme).primary.default};\n    color: ${({ theme, variant }) =>\n        variant === 'ghost'\n            ? color(theme).text.default\n            : color(theme).text.inverted};\n\n    transition: background-color 0.2s ease-in-out;\n\n    &:not(:disabled) {\n        cursor: pointer;\n    }\n\n    @media (hover: hover) and (pointer: fine) {\n        &:not(:disabled):hover {\n            background-color: ${({ theme, variant }) =>\n                variant === 'ghost'\n                    ? color(theme).elementBg.medium\n                    : color(theme).primary.hover};\n        }\n    }\n\n    &:disabled {\n        filter: grayscale(1);\n        color: ${({ theme, variant }) =>\n            variant === 'ghost'\n                ? color(theme).text.disabled\n                : color(theme).text.inverted};\n    }\n\n    &:active:not(:focus-visible) {\n        @media (hover: none) {\n            background-color: ${({ theme, variant }) =>\n                variant === 'ghost'\n                    ? color(theme).elementBg.medium\n                    : color(theme).primary.hover};\n\n            transition: 0.2s background-color ease-in-out;\n            transition-timing-function: cubic-bezier(0.4, 0, 0.2, 1);\n            -webkit-tap-highlight-color: transparent;\n        }\n    }\n\n    &:focus-visible {\n        outline: 2px solid\n            ${({ theme, variant }) =>\n                variant === 'ghost'\n                    ? color(theme).text.default\n                    : color(theme).primary.default};\n        outline-offset: 2px;\n    }\n`;\n\nexport interface PickerActionProps {\n    variant?: PickerActionVariant;\n    disabled?: boolean;\n    ariaLabel?: string;\n    onClick?: (ev: React.SyntheticEvent<HTMLButtonElement>) => void;\n}\n\nconst PickerAction: FC<\n    PickerActionProps & { className?: string; children?: ReactNode }\n> = ({ variant, disabled, ariaLabel, onClick, children, className }) => {\n    return (\n        <View\n            variant={variant}\n            disabled={disabled}\n            onClick={onClick}\n            aria-label={ariaLabel}\n            className={className}\n        >\n            {children}\n        </View>\n    );\n};\n\nexport default PickerAction;\n"],"names":["View","styled","button","templateObject_1","__makeTemplateObject","_a","theme","font","copy","small","family","withRange","size","weight","letterSpacing","variant","color","primary","default","text","inverted","elementBg","medium","hover","disabled","PickerAction","ariaLabel","onClick","children","className","React","createElement"],"mappings":"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"}

package/esm/Pointer-41c10bba.js

@@ -0,0 +1,144 @@
+import { a as __makeTemplateObject, d as __rest, _ as __assign } from './ButtonLeft-a9a132f5.js';
+import * as React from 'react';
+import styled, { css } from 'styled-components';
+import { a as getFonts, w as withRange, g as getColors, s as spacings } from './styles-f3ba5bae.js';
+
+var View = styled.a.withConfig({
+  displayName: "Pointer__View",
+  componentId: "sc-1jne5k6-0"
+})(templateObject_2 || (templateObject_2 = __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    transition: color 0.2s ease-in-out, opacity 0.2s ease-in-out;\n\n    & > * {\n        color: ", ";\n    }\n\n    & > * + * {\n        margin-left: ", "px;\n    }\n\n    @media (hover: hover) and (pointer: fine) {\n        &:hover {\n            opacity: 0.6;\n        }\n    }\n\n    &:focus-visible {\n        outline: none;\n    }\n\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    transition: color 0.2s ease-in-out, opacity 0.2s ease-in-out;\n\n    & > * {\n        color: ", ";\n    }\n\n    & > * + * {\n        margin-left: ", "px;\n    }\n\n    @media (hover: hover) and (pointer: fine) {\n        &:hover {\n            opacity: 0.6;\n        }\n    }\n\n    &:focus-visible {\n        outline: none;\n    }\n\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 decoration = _a.decoration;
+  return decoration ? decoration : '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 isDisabled = _a.isDisabled;
+  return isDisabled ? 'none' : 'all';
+}, function (_a) {
+  var theme = _a.theme,
+      inverted = _a.inverted,
+      isDisabled = _a.isDisabled;
+  return isDisabled ? getColors(theme).elementBg.medium : inverted ? getColors(theme).text.copyInverted : getColors(theme).text.copy;
+}, function (_a) {
+  var theme = _a.theme,
+      inverted = _a.inverted,
+      isDisabled = _a.isDisabled;
+  return isDisabled ? getColors(theme).elementBg.medium : inverted ? getColors(theme).text.copyInverted : getColors(theme).text.copy;
+}, spacings.nudge, function (_a) {
+  var isDisabled = _a.isDisabled,
+      inverted = _a.inverted,
+      theme = _a.theme;
+  return !isDisabled && css(templateObject_1 || (templateObject_1 = __makeTemplateObject(["\n            &:focus-visible {\n                outline: 2px dotted\n                    ", ";\n                outline-offset: 2px;\n            }\n\n            &:active:not(:focus-visible) {\n                @media (hover: none) {\n                    outline: none;\n                    opacity: 0.6;\n                }\n            }\n        "], ["\n            &:focus-visible {\n                outline: 2px dotted\n                    ", ";\n                outline-offset: 2px;\n            }\n\n            &:active:not(:focus-visible) {\n                @media (hover: none) {\n                    outline: none;\n                    opacity: 0.6;\n                }\n            }\n        "])), inverted ? getColors(theme).primary.inverted : getColors(theme).primary.default);
+});
+var Pointer = React.forwardRef(function (_a, ref) {
+  var _b = _a.as,
+      as = _b === void 0 ? 'a' : _b,
+      isInverted = _a.isInverted,
+      isDisabled = _a.isDisabled,
+      onClick = _a.onClick,
+      className = _a.className,
+      _c = _a.decoration,
+      decoration = _c === void 0 ? 'underline' : _c,
+      children = _a.children,
+      ariaLabel = _a.ariaLabel,
+      rest = __rest(_a, ["as", "isInverted", "isDisabled", "onClick", "className", "decoration", "children", "ariaLabel"]);
+
+  switch (as) {
+    case 'button':
+      {
+        return React.createElement(View, __assign({
+          ref: ref,
+          as: as,
+          tabIndex: isDisabled ? -1 : 0,
+          decoration: decoration,
+          inverted: isInverted,
+          disabled: isDisabled,
+          isDisabled: isDisabled,
+          onClick: onClick,
+          className: className,
+          "aria-label": ariaLabel
+        }, rest), children);
+      }
+
+    case 'a':
+      {
+        return React.createElement(View, __assign({
+          ref: ref,
+          as: as,
+          tabIndex: isDisabled ? -1 : 0,
+          decoration: decoration,
+          href: rest.href,
+          "data-disabled": isDisabled,
+          "data-inverted": isInverted,
+          target: rest.isExternal ? '_blank' : undefined,
+          rel: rest.isExternal ? 'noopener' : undefined,
+          inverted: isInverted,
+          isDisabled: isDisabled,
+          onClick: onClick,
+          className: className,
+          "aria-label": ariaLabel
+        }, rest), children);
+      }
+
+    default:
+      {
+        return React.createElement(View, __assign({
+          ref: ref,
+          as: "span",
+          tabIndex: isDisabled ? -1 : 0,
+          decoration: decoration,
+          "data-disabled": isDisabled,
+          "data-inverted": isInverted,
+          inverted: isInverted,
+          isDisabled: isDisabled,
+          onClick: onClick,
+          className: className,
+          "aria-label": ariaLabel
+        }, rest), children);
+      }
+  }
+});
+Pointer.displayName = 'Button';
+var Icon = styled.div.withConfig({
+  displayName: "Pointer__Icon",
+  componentId: "sc-1jne5k6-1"
+})(templateObject_3 || (templateObject_3 = __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, function (_a) {
+  var theme = _a.theme,
+      iconColor = _a.iconColor;
+  return iconColor || getColors(theme).text.copyInverted;
+}, View, function (_a) {
+  var theme = _a.theme,
+      iconColor = _a.iconColor;
+  return iconColor || getColors(theme).elementBg.medium;
+}, View);
+var Label = styled.span.withConfig({
+  displayName: "Pointer__Label",
+  componentId: "sc-1jne5k6-2"
+})(templateObject_4 || (templateObject_4 = __makeTemplateObject(["\n    display: inline-block;\n"], ["\n    display: inline-block;\n"])));
+var Pointer$1 = {
+  View: Pointer,
+  Label: Label,
+  Icon: Icon
+};
+var templateObject_1, templateObject_2, templateObject_3, templateObject_4;
+
+export { Pointer$1 as P };
+//# sourceMappingURL=Pointer-41c10bba.js.map

package/esm/Pointer-41c10bba.js.map

@@ -0,0 +1 @@
+{"version":3,"file":"Pointer-41c10bba.js","sources":["../src/components/buttons/Pointer.tsx"],"sourcesContent":["import * as React from 'react';\nimport styled, { css } 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    isDisabled?: boolean;\n    decoration?: '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: ${({ decoration }) =>\n        decoration ? decoration : '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: ${({ isDisabled }) => (isDisabled ? 'none' : 'all')};\n\n    background: none;\n    color: ${({ theme, inverted, isDisabled }) =>\n        isDisabled\n            ? color(theme).elementBg.medium\n            : inverted\n            ? color(theme).text.copyInverted\n            : color(theme).text.copy};\n\n    transition: color 0.2s ease-in-out, opacity 0.2s ease-in-out;\n\n    & > * {\n        color: ${({ theme, inverted, isDisabled }) =>\n            isDisabled\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    @media (hover: hover) and (pointer: fine) {\n        &:hover {\n            opacity: 0.6;\n        }\n    }\n\n    &:focus-visible {\n        outline: none;\n    }\n\n    ${({ isDisabled, inverted, theme }) =>\n        !isDisabled &&\n        css`\n            &:focus-visible {\n                outline: 2px dotted\n                    ${inverted\n                        ? color(theme).primary.inverted\n                        : color(theme).primary.default};\n                outline-offset: 2px;\n            }\n\n            &:active:not(:focus-visible) {\n                @media (hover: none) {\n                    outline: none;\n                    opacity: 0.6;\n                }\n            }\n        `}\n`;\n\ninterface Props {\n    isInverted?: boolean;\n    isDisabled?: boolean;\n    onClick?: () => void;\n    decoration?: 'none' | 'underline';\n    className?: string;\n    children?: React.ReactNode;\n    ariaLabel?: string;\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\nexport type DecoratorProps = Props & {\n    as?: 'decorator';\n};\n\nconst Pointer = React.forwardRef<\n    HTMLElement,\n    BtnProps | LinkProps | DecoratorProps\n>(\n    (\n        {\n            as = 'a',\n            isInverted,\n            isDisabled,\n            onClick,\n            className,\n            decoration = 'underline',\n            children,\n            ariaLabel,\n            ...rest\n        },\n        ref\n    ) => {\n        switch (as) {\n            case 'button': {\n                return (\n                    <View\n                        ref={ref as React.RefObject<HTMLButtonElement>}\n                        as={as}\n                        tabIndex={isDisabled ? -1 : 0}\n                        decoration={decoration}\n                        inverted={isInverted}\n                        disabled={isDisabled}\n                        isDisabled={isDisabled}\n                        onClick={onClick}\n                        className={className}\n                        aria-label={ariaLabel}\n                        {...rest}\n                    >\n                        {children}\n                    </View>\n                );\n            }\n\n            case 'a': {\n                return (\n                    <View\n                        ref={ref as React.RefObject<HTMLAnchorElement>}\n                        as={as}\n                        tabIndex={isDisabled ? -1 : 0}\n                        decoration={decoration}\n                        href={(rest as LinkProps).href}\n                        data-disabled={isDisabled}\n                        data-inverted={isInverted}\n                        target={\n                            (rest as LinkProps).isExternal\n                                ? '_blank'\n                                : undefined\n                        }\n                        rel={\n                            (rest as LinkProps).isExternal\n                                ? 'noopener'\n                                : undefined\n                        }\n                        inverted={isInverted}\n                        isDisabled={isDisabled}\n                        onClick={onClick}\n                        className={className}\n                        aria-label={ariaLabel}\n                        {...rest}\n                    >\n                        {children}\n                    </View>\n                );\n            }\n\n            default: {\n                return (\n                    <View\n                        ref={ref}\n                        as=\"span\"\n                        tabIndex={isDisabled ? -1 : 0}\n                        decoration={decoration}\n                        data-disabled={isDisabled}\n                        data-inverted={isInverted}\n                        inverted={isInverted}\n                        isDisabled={isDisabled}\n                        onClick={onClick}\n                        className={className}\n                        aria-label={ariaLabel}\n                        {...rest}\n                    >\n                        {children}\n                    </View>\n                );\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"],"names":["View","styled","a","templateObject_2","__makeTemplateObject","_a","theme","font","copy","medium","family","withRange","size","weight","decoration","letterSpacing","inverted","color","primary","default","isDisabled","elementBg","text","copyInverted","spacings","nudge","css","Pointer","React","forwardRef","ref","_b","as","isInverted","onClick","className","_c","children","ariaLabel","rest","__rest","createElement","__assign","tabIndex","disabled","href","target","isExternal","undefined","rel","displayName","Icon","div","templateObject_3","iconColor","Label","span","templateObject_4"],"mappings":"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"}

package/esm/{Section-bd61eb2f.js → Section-ca6daed2.js}

@@ -1,8 +1,8 @@
-import { a as __makeTemplateObject } from './Filter-19220970.js';
+import { a as __makeTemplateObject } from './ButtonLeft-a9a132f5.js';
 import React__default, { forwardRef } from 'react';
 import styled, { css } from 'styled-components';
-import { c as concat } from './concat-ab3c66f2.js';
-import { c as getGlobals, w as withRange, m as mq, s as spacings } from './styles-1f1841ef.js';
+import { c as concat } from './concat-b6d6d978.js';
+import { c as getGlobals, w as withRange, m as mq, s as spacings } from './styles-f3ba5bae.js';
 
 var getBackground = function (bgColor, mode) {
   var bgValue = undefined;
@@ -111,6 +111,8 @@ var Section = forwardRef(function (_a, ref) {
       _d = _a.isStackable,
       isStackable = _d === void 0 ? false : _d,
       className = _a.className,
+      ariaLabeledBy = _a.ariaLabeledBy,
+      ariaLabel = _a.ariaLabel,
       children = _a.children;
 
   switch (bgMode) {
@@ -146,7 +148,9 @@ var Section = forwardRef(function (_a, ref) {
     addSeperation: !renderAs || renderAs && renderAs !== 'div' ? addSeperation : false,
     isStackable: isStackable,
     "data-stack-ident": isStackable ? 'true' : 'false',
-    className: className
+    className: className,
+    "aria-labelledby": ariaLabeledBy,
+    "aria-label": ariaLabel
   }, bgColor && React__default.createElement(Back, {
     bgColor: bgColor,
     bgMode: bgMode,
@@ -182,4 +186,4 @@ var mapToBgMode = function (mode, preventSplit, isMirrored) {
 var templateObject_1, templateObject_2, templateObject_3, templateObject_4;
 
 export { Section as S, mapToBgMode as m };
-//# sourceMappingURL=Section-bd61eb2f.js.map
+//# sourceMappingURL=Section-ca6daed2.js.map

package/esm/Section-ca6daed2.js.map

@@ -0,0 +1 @@
+{"version":3,"file":"Section-ca6daed2.js","sources":["../src/components/base/Section.tsx"],"sourcesContent":["import React, { forwardRef } from 'react';\nimport styled, { css } from 'styled-components';\nimport { concat } from 'utils/concat';\nimport { mq, spacings, withRange, getGlobals as global } from 'utils/styles';\n\nexport type BgMode = 'full' | 'larger-left' | 'larger-right' | 'inverted';\n\nconst getBackground = (bgColor: string, mode?: BgMode) => {\n    let bgValue = undefined;\n\n    switch (mode) {\n        case 'full':\n            bgValue = bgColor;\n            break;\n\n        case 'inverted':\n            bgValue = bgColor;\n            break;\n\n        case 'larger-left':\n            bgValue = `linear-gradient(to left, transparent 40%, ${bgColor} 40%)`;\n            break;\n\n        case 'larger-right':\n            bgValue = `linear-gradient(to right, transparent 40%, ${bgColor} 40%)`;\n            break;\n\n        default:\n            bgValue = bgColor;\n            break;\n    }\n    return bgValue;\n};\n\nconst View = styled.section<{\n    as?: SectionType;\n    bgIdent: string;\n    bgColor: string;\n    isStackable?: boolean;\n    addSeperation?: boolean;\n}>`\n    position: relative;\n    overflow: ${({ as }) => (as === 'div' ? 'visible' : 'hidden')};\n\n    // section paddings\n    ${({ addSeperation, isStackable, bgIdent, theme }) => {\n        const padding = global(theme).sections.seperation.padding.default;\n        const paddingStacked =\n            global(theme).sections.seperation.padding.stackable;\n        const forcePadding = global(theme).sections.seperation.forcePadding;\n\n        if (addSeperation) {\n            return css`\n                ${withRange(padding, 'padding-top')}\n                ${withRange(\n                    isStackable ? paddingStacked : padding,\n                    'padding-bottom'\n                )}\n\n                section[data-stack-ident='true'] + & {\n                    ${withRange(paddingStacked, 'padding-top')};\n                }\n\n                section[data-bg-ident='${bgIdent}']\n                    + &[data-bg-ident='${bgIdent}'] {\n                    padding-top: ${forcePadding ? undefined : '0 !important'};\n\n                    @media ${mq.xxlarge} {\n                        padding-top: ${forcePadding\n                            ? undefined\n                            : '0 !important'};\n                    }\n                }\n            `;\n        } else return '';\n    }}\n\n    // section margins\n    ${({ addSeperation, isStackable, bgIdent, bgColor, theme }) => {\n        const margin = global(theme).sections.seperation.margin.default;\n        const marginStacked =\n            global(theme).sections.seperation.margin.stackable;\n\n        const bgColorPart = bgColor ? `__${bgColor}` : '';\n\n        if (addSeperation) {\n            return css`\n                *:not([data-bg-ident='light'])\n                    + &[data-bg-ident='larger-left${bgColorPart}'] {\n                    ${withRange(margin, 'margin-top')};\n                }\n\n                *:not([data-bg-ident='light'])\n                    + &[data-bg-ident='larger-right${bgColorPart}'] {\n                    ${withRange(margin, 'margin-top')};\n                }\n\n                section[data-bg-ident='larger-left${bgColorPart}']\n                    + &:not([data-bg-ident='light']) {\n                    ${withRange(\n                        isStackable ? marginStacked : margin,\n                        'margin-top'\n                    )};\n                }\n\n                section[data-bg-ident='larger-right${bgColorPart}']\n                    + &:not([data-bg-ident='light']) {\n                    ${withRange(\n                        isStackable ? marginStacked : margin,\n                        'margin-top'\n                    )};\n                }\n\n                section[data-bg-ident='${bgIdent}']\n                    + &[data-bg-ident='${bgIdent}'] {\n                    margin-top: 0 !important;\n\n                    @media ${mq.xxlarge} {\n                        margin-top: 0 !important;\n                    }\n                }\n            `;\n        } else return '';\n    }}\n`;\n\nconst Back = styled.div<{\n    bgColor?: string;\n    bgMode?: BgMode;\n    clampSolidBg?: boolean;\n}>`\n    display: ${({ bgColor }) => (bgColor ? 'block' : 'none')};\n    position: absolute;\n    top: 0;\n    right: 0;\n    bottom: 0;\n    left: 0;\n    max-width: ${({ bgMode, clampSolidBg }) => {\n        if (bgMode !== 'larger-left' && bgMode !== 'larger-right') {\n            return clampSolidBg ? `${spacings.wrapperLarge}px` : undefined;\n        } else {\n            return `${spacings.wrapper}px`;\n        }\n    }};\n    background: ${({ bgColor }) => bgColor || undefined};\n    margin: 0 auto;\n    z-index: -1;\n\n    @media ${mq.semilarge} {\n        background: ${({ bgColor, bgMode }) =>\n            bgColor && bgMode ? getBackground(bgColor, bgMode) : undefined};\n    }\n\n    @media ${mq.xlarge} {\n        :before {\n            content: ${({ bgMode }) =>\n                bgMode === 'larger-left' ? `\"\"` : undefined};\n            position: absolute;\n            top: 0;\n            left: 0;\n            bottom: 0;\n            width: ${(spacings.wrapperLarge - spacings.wrapper) / 2}px;\n            background-color: ${({ bgColor }) => bgColor && bgColor};\n            transform: translateX(-100%);\n        }\n        :after {\n            content: ${({ bgMode }) =>\n                bgMode === 'larger-right' ? `\"\"` : undefined};\n            position: absolute;\n            top: 0;\n            right: 0;\n            bottom: 0;\n            width: ${(spacings.wrapperLarge - spacings.wrapper) / 2}px;\n            background-color: ${({ bgColor }) => bgColor && bgColor};\n            transform: translateX(100%);\n        }\n    }\n`;\n\nexport type SectionType = 'header' | 'footer' | 'div' | 'article';\n\nexport interface SectionProps {\n    /** ID value for targeting section with anchor hashes */\n    anchorId?: string;\n\n    /** Render as specific HTML tag type */\n    renderAs?: SectionType;\n\n    /** Background color */\n    bgColor?: string;\n\n    /** Background mode */\n    bgMode?: BgMode;\n\n    /** Clamp solid backgrounds (full, inverted) to large wrapper width */\n    clampSolidBg?: boolean;\n\n    /** Enable section seperation spacing */\n    addSeperation?: boolean;\n\n    /** Allow stack feature for reduced section spacing to following section */\n    isStackable?: boolean;\n\n    ariaLabeledBy?: string;\n    ariaLabel?: string;\n}\n\nconst Section = forwardRef<\n    HTMLElement,\n    SectionProps & {\n        className?: string;\n        children?: React.ReactNode;\n    }\n>(\n    (\n        {\n            anchorId,\n            renderAs,\n            bgColor,\n            bgMode,\n            clampSolidBg = true,\n            addSeperation = false,\n            isStackable = false,\n            className,\n            ariaLabeledBy,\n            ariaLabel,\n            children,\n        },\n        ref\n    ) => {\n        switch (bgMode) {\n            case 'larger-left':\n                bgMode = 'larger-left';\n                break;\n            case 'larger-right':\n                bgMode = 'larger-right';\n                break;\n            case 'inverted':\n                bgMode = 'inverted';\n                break;\n            case 'full':\n                bgMode = 'full';\n                break;\n            default:\n                bgMode = undefined;\n        }\n\n        const noPadIdent = addSeperation ? '' : 'nopad';\n        const ident =\n            bgColor && bgMode\n                ? concat([`${bgMode}__${bgColor}`, noPadIdent], '--')\n                : 'light';\n\n        return (\n            <View\n                ref={ref}\n                id={anchorId || undefined}\n                as={renderAs}\n                data-bg-ident={ident}\n                bgIdent={ident}\n                bgColor={bgColor || ''}\n                addSeperation={\n                    !renderAs || (renderAs && renderAs !== 'div')\n                        ? addSeperation\n                        : false\n                }\n                isStackable={isStackable}\n                data-stack-ident={isStackable ? 'true' : 'false'}\n                className={className}\n                aria-labelledby={ariaLabeledBy}\n                aria-label={ariaLabel}\n            >\n                {bgColor && (\n                    <Back\n                        bgColor={bgColor}\n                        bgMode={bgMode}\n                        clampSolidBg={clampSolidBg}\n                    />\n                )}\n                {children}\n            </View>\n        );\n    }\n);\n\nSection.displayName = 'Section';\n\nexport default Section;\n\nexport const mapToBgMode = (\n    mode?: 'full' | 'splitted' | 'inverted',\n    preventSplit = false,\n    isMirrored = false\n): BgMode | undefined => {\n    switch (mode) {\n        case 'full':\n            return 'full';\n        case 'inverted':\n            return 'inverted';\n        case 'splitted': {\n            if (!preventSplit)\n                return isMirrored ? 'larger-left' : 'larger-right';\n            else return undefined;\n        }\n\n        default:\n            return undefined;\n    }\n};\n"],"names":["getBackground","bgColor","mode","bgValue","undefined","concat","View","styled","section","templateObject_3","__makeTemplateObject","_a","as","addSeperation","isStackable","bgIdent","theme","padding","global","sections","seperation","default","paddingStacked","stackable","forcePadding","css","templateObject_1","withRange","mq","xxlarge","margin","marginStacked","bgColorPart","templateObject_2","Back","div","templateObject_4","bgMode","clampSolidBg","spacings","wrapperLarge","wrapper","semilarge","xlarge","Section","forwardRef","ref","anchorId","renderAs","_b","_c","_d","className","ariaLabeledBy","ariaLabel","children","noPadIdent","ident","React","createElement","id","displayName","mapToBgMode","preventSplit","isMirrored"],"mappings":";;;;;;AAOA,IAAMA,aAAa,GAAG,UAACC,OAAD,EAAkBC,IAAlB,EAA+B;AACjD,EAAIC,IAAAA,OAAO,GAAGC,SAAd,CAAA;;AAEA,EAAA,QAAQF,IAAR;AACI,IAAA,KAAK,MAAL;AACIC,MAAAA,OAAO,GAAGF,OAAV,CAAA;AACA,MAAA,MAAA;;AAEJ,IAAA,KAAK,UAAL;AACIE,MAAAA,OAAO,GAAGF,OAAV,CAAA;AACA,MAAA,MAAA;;AAEJ,IAAA,KAAK,aAAL;AACIE,MAAAA,OAAO,GAAG,4CAAAE,CAAAA,MAAA,CAA6CJ,OAA7C,EAAoD,OAApD,CAAV,CAAA;AACA,MAAA,MAAA;;AAEJ,IAAA,KAAK,cAAL;AACIE,MAAAA,OAAO,GAAG,6CAAAE,CAAAA,MAAA,CAA8CJ,OAA9C,EAAqD,OAArD,CAAV,CAAA;AACA,MAAA,MAAA;;AAEJ,IAAA;AACIE,MAAAA,OAAO,GAAGF,OAAV,CAAA;AACA,MAAA,MAAA;AAnBR,GAAA;;AAqBA,EAAA,OAAOE,OAAP,CAAA;AACH,CAzBD,CAAA;;AA2BA,IAAMG,IAAI,GAAGC,MAAM,CAACC,OAAV,CAAA,UAAA,CAAA;AAAA,EAAA,WAAA,EAAA,eAAA;AAAA,EAAA,WAAA,EAAA,cAAA;AAAA,CAAA,CAAA,CAMRC,gBAAA,KAAAA,gBAAA,GAAAC,oBAAA,CAAA,CAAA,2CAAA,EAAA,oCAAA,EAAA,kCAAA,EAAA,IAAA,CAAA,EAAA,CAAA,2CAAA,EAE+D,oCAF/D,EAmCG,kCAnCH,EAmFG,IAnFH,CAAA,CAAA,CANQ,EAQM,UAACC,EAAD,EAAO;AAAJ,EAAA,IAAAC,EAAE,GAAAD,EAAA,CAAAC,EAAF,CAAA;AAAS,EAAA,OAACA,EAAE,KAAK,KAAP,GAAe,SAAf,GAA2B,QAA5B,CAAA;AAAqC,CARvD,EAWJ,UAACD,EAAD,EAA+C;MAA5CE,aAAa,GAAAF,EAAA,CAAAE;MAAEC,WAAW,GAAAH,EAAA,CAAAG;MAAEC,OAAO,GAAAJ,EAAA,CAAAI;MAAEC,KAAK,GAAAL,EAAA,CAAAK;AAC3C,EAAA,IAAMC,OAAO,GAAGC,UAAM,CAACF,KAAD,CAAN,CAAcG,QAAd,CAAuBC,UAAvB,CAAkCH,OAAlC,CAA0CI,OAA1D,CAAA;AACA,EAAA,IAAMC,cAAc,GAChBJ,UAAM,CAACF,KAAD,CAAN,CAAcG,QAAd,CAAuBC,UAAvB,CAAkCH,OAAlC,CAA0CM,SAD9C,CAAA;AAEA,EAAMC,IAAAA,YAAY,GAAGN,UAAM,CAACF,KAAD,CAAN,CAAcG,QAAd,CAAuBC,UAAvB,CAAkCI,YAAvD,CAAA;;AAEA,EAAA,IAAIX,aAAJ,EAAmB;AACf,IAAOY,OAAAA,GAAG,CAAAC,gBAAA,KAAAA,gBAAA,GAAAhB,oBAAA,CAAA,CAAA,oBAAA,EAAA,oBAAA,EAAA,kFAAA,EAAA,iEAAA,EAAA,6CAAA,EAAA,yCAAA,EAAA,kCAAA,EAAA,2CAAA,EAAA,2DAAA,CAAA,EAAA,CAAA,oBAAA,EAC6B,oBAD7B,EAKL,kFALK,EAQwC,iEARxC,EAW0B,6CAX1B,EAY0B,yCAZ1B,EAasD,kCAbtD,EAeiB,2CAfjB,EAkBsB,2DAlBtB,CAAA,CAAA,CAAA,EACJiB,SAAS,CAACV,OAAD,EAAU,aAAV,CADL,EAEJU,SAAS,CACPb,WAAW,GAAGQ,cAAH,GAAoBL,OADxB,EAEP,gBAFO,CAFL,EAQAU,SAAS,CAACL,cAAD,EAAiB,aAAjB,CART,EAWmBP,OAXnB,EAYmBA,OAZnB,EAaaS,YAAY,GAAGpB,SAAH,GAAe,cAbxC,EAeOwB,EAAE,CAACC,OAfV,EAgBiBL,YAAY,GACrBpB,SADqB,GAErB,cAlBR,CAAV,CAAA;AAsBH,GAvBD,MAuBO,OAAO,EAAP,CAAA;AACV,CAzCK,EA4CJ,UAACO,EAAD,EAAwD;AAArD,EAAA,IAAAE,aAAa,GAAAF,EAAA,CAAAE,aAAb;AAAA,MAAeC,WAAW,GAAAH,EAAA,CAAAG,WAA1B;AAAA,MAA4BC,OAAO,GAAAJ,EAAA,CAAAI,OAAnC;AAAA,MAAqCd,OAAO,GAAAU,EAAA,CAAAV,OAA5C;AAAA,MAA8Ce,KAAK,GAAAL,EAAA,CAAAK,KAAnD,CAAA;AACD,EAAA,IAAMc,MAAM,GAAGZ,UAAM,CAACF,KAAD,CAAN,CAAcG,QAAd,CAAuBC,UAAvB,CAAkCU,MAAlC,CAAyCT,OAAxD,CAAA;AACA,EAAA,IAAMU,aAAa,GACfb,UAAM,CAACF,KAAD,CAAN,CAAcG,QAAd,CAAuBC,UAAvB,CAAkCU,MAAlC,CAAyCP,SAD7C,CAAA;AAGA,EAAMS,IAAAA,WAAW,GAAG/B,OAAO,GAAG,IAAA,CAAKI,MAAL,CAAKJ,OAAL,CAAH,GAAoB,EAA/C,CAAA;;AAEA,EAAA,IAAIY,aAAJ,EAAmB;AACf,IAAOY,OAAAA,GAAG,CAAAQ,gBAAA,KAAAA,gBAAA,GAAAvB,oBAAA,CAAA,CAAA,sGAAA,EAAA,4BAAA,EAAA,6HAAA,EAAA,4BAAA,EAAA,4EAAA,EAAA,kFAAA,EAAA,6EAAA,EAAA,kFAAA,EAAA,iEAAA,EAAA,6CAAA,EAAA,oFAAA,EAAA,+GAAA,CAAA,EAAA,CAAA,sGAAA,EAEyC,4BAFzC,EAG+B,6HAH/B,EAO0C,4BAP1C,EAQ+B,4EAR/B,EAWyC,kFAXzC,EAgBD,6EAhBC,EAmB0C,kFAnB1C,EAwBD,iEAxBC,EA2B0B,6CA3B1B,EA4B0B,oFA5B1B,EA+BiB,+GA/BjB,CAAA,CAAA,CAAA,EAE8BsB,WAF9B,EAGAL,SAAS,CAACG,MAAD,EAAS,YAAT,CAHT,EAO+BE,WAP/B,EAQAL,SAAS,CAACG,MAAD,EAAS,YAAT,CART,EAW8BE,WAX9B,EAaAL,SAAS,CACPb,WAAW,GAAGiB,aAAH,GAAmBD,MADvB,EAEP,YAFO,CAbT,EAmB+BE,WAnB/B,EAqBAL,SAAS,CACPb,WAAW,GAAGiB,aAAH,GAAmBD,MADvB,EAEP,YAFO,CArBT,EA2BmBf,OA3BnB,EA4BmBA,OA5BnB,EA+BOa,EAAE,CAACC,OA/BV,CAAV,CAAA;AAoCH,GArCD,MAqCO,OAAO,EAAP,CAAA;AACV,CAzFK,CAAV,CAAA;AA4FA,IAAMK,IAAI,GAAG3B,MAAM,CAAC4B,GAAV,CAAA,UAAA,CAAA;AAAA,EAAA,WAAA,EAAA,eAAA;AAAA,EAAA,WAAA,EAAA,cAAA;AAAA,CAAA,CAAA,CAIRC,gBAAA,KAAAA,gBAAA,GAAA1B,oBAAA,CAAA,CAAA,iBAAA,EAAA,uGAAA,EAAA,qBAAA,EAAA,yDAAA,EAAA,0BAAA,EAAA,yBAAA,EAAA,8CAAA,EAAA,4HAAA,EAAA,qCAAA,EAAA,kGAAA,EAAA,6HAAA,EAAA,qCAAA,EAAA,iEAAA,CAAA,EAAA,CAAA,iBAAA,EAC0D,uGAD1D,EAaG,qBAbH,EAcqD,yDAdrD,EAkBuB,0BAlBvB,EAoBwE,yBApBxE,EAuBoB,8CAvBpB,EA0ByD,4HA1BzD,EA+BiE,qCA/BjE,EAgCiE,kGAhCjE,EAqC0D,6HArC1D,EA0CiE,qCA1CjE,EA2CiE,iEA3CjE,CAAA,CAAA,CAJQ,EAKK,UAACC,EAAD,EAAY;AAAT,EAAA,IAAAV,OAAO,GAAAU,EAAA,CAAAV,OAAP,CAAA;AAAc,EAAA,OAACA,OAAO,GAAG,OAAH,GAAa,MAArB,CAAA;AAA4B,CALlD,EAWO,UAACU,EAAD,EAAyB;MAAtB0B,MAAM,GAAA1B,EAAA,CAAA0B;MAAEC,YAAY,GAAA3B,EAAA,CAAA2B;;AAChC,EAAA,IAAID,MAAM,KAAK,aAAX,IAA4BA,MAAM,KAAK,cAA3C,EAA2D;AACvD,IAAA,OAAOC,YAAY,GAAG,EAAGjC,CAAAA,MAAH,CAAGkC,QAAQ,CAACC,YAAZ,EAA4B,IAA5B,CAAH,GAAkCpC,SAArD,CAAA;AACH,GAFD,MAEO;AACH,IAAO,OAAA,EAAA,CAAGC,MAAH,CAAGkC,QAAQ,CAACE,OAAZ,MAAA,CAAP,CAAA;AACH,GAAA;AACJ,CAjBK,EAkBQ,UAAC9B,EAAD,EAAY;AAAT,EAAA,IAAAV,OAAO,GAAAU,EAAA,CAAAV,OAAP,CAAA;AAAc,EAAAA,OAAAA,OAAO,IAAIG,SAAX,CAAA;AAAoB,CAlB7C,EAsBGwB,EAAE,CAACc,SAtBN,EAuBY,UAAC/B,EAAD,EAAoB;MAAjBV,OAAO,GAAAU,EAAA,CAAAV;MAAEoC,MAAM,GAAA1B,EAAA,CAAA0B;AAC5B,EAAApC,OAAAA,OAAO,IAAIoC,MAAX,GAAoBrC,aAAa,CAACC,OAAD,EAAUoC,MAAV,CAAjC,GAAqDjC,SAArD,CAAA;AAA8D,CAxBhE,EA2BGwB,EAAE,CAACe,MA3BN,EA6Ba,UAAChC,EAAD,EAAW;AAAR,EAAA,IAAA0B,MAAM,GAAA1B,EAAA,CAAA0B,MAAN,CAAA;AACV,EAAA,OAAAA,MAAM,KAAK,aAAX,GAA2B,MAA3B,GAAkCjC,SAAlC,CAAA;AAA2C,CA9BjD,EAmCW,CAACmC,QAAQ,CAACC,YAAT,GAAwBD,QAAQ,CAACE,OAAlC,IAA6C,CAnCxD,EAoCsB,UAAC9B,EAAD,EAAY;AAAT,EAAA,IAAAV,OAAO,GAAAU,EAAA,CAAAV,OAAP,CAAA;AAAc,EAAAA,OAAAA,OAAO,IAAIA,OAAX,CAAA;AAAkB,CApCzD,EAwCa,UAACU,EAAD,EAAW;AAAR,EAAA,IAAA0B,MAAM,GAAA1B,EAAA,CAAA0B,MAAN,CAAA;AACV,EAAA,OAAAA,MAAM,KAAK,cAAX,GAA4B,MAA5B,GAAmCjC,SAAnC,CAAA;AAA4C,CAzClD,EA8CW,CAACmC,QAAQ,CAACC,YAAT,GAAwBD,QAAQ,CAACE,OAAlC,IAA6C,CA9CxD,EA+CsB,UAAC9B,EAAD,EAAY;AAAT,EAAA,IAAAV,OAAO,GAAAU,EAAA,CAAAV,OAAP,CAAA;AAAc,EAAAA,OAAAA,OAAO,IAAIA,OAAX,CAAA;AAAkB,CA/CzD,CAAV,CAAA;AAiFM2C,IAAAA,OAAO,GAAGC,UAAU,CAOtB,UACIlC,EADJ,EAcImC,GAdJ,EAcO;AAZC,EAAA,IAAAC,QAAQ,cAAR;AAAA,MACAC,QAAQ,cADR;AAAA,MAEA/C,OAAO,aAFP;AAAA,MAGAoC,MAAM,YAHN;AAAA,MAIAY,EAAA,GAAAtC,EAAA,CAAA2B,YAJA;AAAA,MAIAA,YAAY,GAAAW,EAAA,KAAA,KAAA,CAAA,GAAG,IAAH,GAAOA,EAJnB;AAAA,MAKAC,qBALA;AAAA,MAKArC,aAAa,GAAGqC,EAAA,KAAA,KAAA,CAAA,GAAA,KAAA,KALhB;AAAA,MAMAC,EAAA,GAAAxC,EAAA,CAAAG,WANA;AAAA,MAMAA,WAAW,GAAAqC,EAAA,KAAA,KAAA,CAAA,GAAG,KAAH,GAAQA,EANnB;AAAA,MAOAC,SAAS,GAAAzC,EAAA,CAAAyC,SAPT;AAAA,MAQAC,aAAa,GAAA1C,EAAA,CAAA0C,aARb;AAAA,MASAC,SAAS,GAAA3C,EAAA,CAAA2C,SATT;AAAA,MAUAC,QAAQ,GAAA5C,EAAA,CAAA4C,QAVR,CAAA;;AAcJ,EAAA,QAAQlB,MAAR;AACI,IAAA,KAAK,aAAL;AACIA,MAAAA,MAAM,GAAG,aAAT,CAAA;AACA,MAAA,MAAA;;AACJ,IAAA,KAAK,cAAL;AACIA,MAAAA,MAAM,GAAG,cAAT,CAAA;AACA,MAAA,MAAA;;AACJ,IAAA,KAAK,UAAL;AACIA,MAAAA,MAAM,GAAG,UAAT,CAAA;AACA,MAAA,MAAA;;AACJ,IAAA,KAAK,MAAL;AACIA,MAAAA,MAAM,GAAG,MAAT,CAAA;AACA,MAAA,MAAA;;AACJ,IAAA;AACIA,MAAAA,MAAM,GAAGjC,SAAT,CAAA;AAdR,GAAA;;AAiBA,EAAA,IAAMoD,UAAU,GAAG3C,aAAa,GAAG,EAAH,GAAQ,OAAxC,CAAA;AACA,EAAM4C,IAAAA,KAAK,GACPxD,OAAO,IAAIoC,MAAX,GACMhC,MAAM,CAAC,CAAC,SAAA,CAAGgC,MAAH,EAAS,IAAT,CAAShC,CAAAA,MAAT,CAAcJ,OAAd,CAAD,EAA0BuD,UAA1B,CAAD,EAAwC,IAAxC,CADZ,GAEM,OAHV,CAAA;AAKA,EAAA,OACIE,cAAC,CAAAC,aAAD,CAACrD,IAAD;AACIwC,IAAAA,GAAG,EAAEA;AACLc,IAAAA,EAAE,EAAEb,QAAQ,IAAI3C;AAChBQ,IAAAA,EAAE,EAAEoC;qBACWS;AACf1C,IAAAA,OAAO,EAAE0C;AACTxD,IAAAA,OAAO,EAAEA,OAAO,IAAI;AACpBY,IAAAA,aAAa,EACT,CAACmC,QAAD,IAAcA,QAAQ,IAAIA,QAAQ,KAAK,KAAvC,GACMnC,aADN,GAEM;AAEVC,IAAAA,WAAW,EAAEA;AAAW,IAAA,kBAAA,EACNA,WAAW,GAAG,MAAH,GAAY;AACzCsC,IAAAA,SAAS,EAAEA;AAAS,IAAA,iBAAA,EACHC;AAAa,IAClBC,YAAAA,EAAAA,SAAAA;GAhBhB,EAkBKrD,OAAO,IACJyD,cAAA,CAAAC,aAAA,CAACzB,IAAD,EAAK;AACDjC,IAAAA,OAAO,EAAEA,OADR;AAEDoC,IAAAA,MAAM,EAAEA,MAFP;AAGDC,IAAAA,YAAY,EAAEA,YAAAA;AAHb,GAAL,CAnBR,EAyBKiB,QAzBL,CADJ,CAAA;AA6BH,CA3EqB,EAA1B;AA8EAX,OAAO,CAACiB,WAAR,GAAsB,SAAtB,CAAA;AAIO,IAAMC,WAAW,GAAG,UACvB5D,IADuB,EAEvB6D,YAFuB,EAGvBC,UAHuB,EAGL;AADlB,EAAA,IAAAD,YAAA,KAAA,KAAA,CAAA,EAAA;AAAAA,IAAAA,YAAoB,GAAA,KAApB,CAAA;AAAoB,GAAA;;AACpB,EAAA,IAAAC,UAAA,KAAA,KAAA,CAAA,EAAA;AAAAA,IAAAA,UAAkB,GAAA,KAAlB,CAAA;AAAkB,GAAA;;AAElB,EAAA,QAAQ9D,IAAR;AACI,IAAA,KAAK,MAAL;AACI,MAAA,OAAO,MAAP,CAAA;;AACJ,IAAA,KAAK,UAAL;AACI,MAAA,OAAO,UAAP,CAAA;;AACJ,IAAA,KAAK,UAAL;AAAiB,MAAA;AACb,QAAA,IAAI,CAAC6D,YAAL,EACI,OAAOC,UAAU,GAAG,aAAH,GAAmB,cAApC,CADJ,KAEK,OAAO5D,SAAP,CAAA;AACR,OAAA;;AAED,IAAA;AACI,MAAA,OAAOA,SAAP,CAAA;AAZR,GAAA;AAcH,EAnBM;;;;;"}

package/esm/{SocialList-abaf970d.js → SocialList-d5adb772.js}

@@ -1,9 +1,9 @@
-import { a as __makeTemplateObject } from './Filter-19220970.js';
+import { a as __makeTemplateObject } from './ButtonLeft-a9a132f5.js';
 import React__default from 'react';
 import styled from 'styled-components';
-import { s as spacings, g as getColors } from './styles-1f1841ef.js';
-import { L as Link } from './Link-6067a27f.js';
-import { C as Copy } from './Copy-fd9e25c0.js';
+import { s as spacings, g as getColors } from './styles-f3ba5bae.js';
+import { L as Link } from './Link-d4a291af.js';
+import { C as Copy } from './Copy-5a18e01f.js';
 
 var View = styled.div.withConfig({
   displayName: "SocialList__View",
@@ -58,4 +58,4 @@ var SocialList = function (_a) {
 var templateObject_1, templateObject_2, templateObject_3, templateObject_4;
 
 export { SocialList as S };
-//# sourceMappingURL=SocialList-abaf970d.js.map
+//# sourceMappingURL=SocialList-d5adb772.js.map

package/esm/{SocialList-abaf970d.js.map → SocialList-d5adb772.js.map}

@@ -1 +1 @@
-{"version":3,"file":"SocialList-abaf970d.js","sources":["../src/components/blocks/SocialList.tsx"],"sourcesContent":["import React, { FC } from 'react';\nimport styled from 'styled-components';\n\nimport { getColors as color, spacings } from 'utils/styles';\nimport Link from 'components/typography/Link';\nimport Copy from 'components/typography/Copy';\n\nconst View = styled.div`\n    & > * {\n        margin: 0;\n        padding: 0;\n    }\n\n    & > * + * {\n        margin-top: ${spacings.nudge * 2}px;\n    }\n`;\n\nconst List = styled.ul`\n    display: inline-flex;\n    flex-direction: row;\n    align-items: center;\n    list-style: none;\n\n    & > * + * {\n        margin-left: ${spacings.nudge * 3}px;\n    }\n`;\n\nconst IconContainer = styled.li`\n    display: block;\n    padding: 0;\n`;\n\nconst StyledLink = styled(Link)`\n    display: block;\n    padding: ${spacings.nudge * 2}px ${spacings.nudge * 1.5}px;\n    margin: -${spacings.nudge * 2}px -${spacings.nudge * 1.5}px;\n    color: ${({ theme, isInverted }) =>\n        isInverted ? color(theme).text.inverted : color(theme).text.default};\n    outline: none;\n\n    transition: all ease-in-out 0.2s;\n\n    &:focus {\n        outline: none;\n    }\n\n    &:focus > * {\n        outline: 2px solid\n            ${({ theme, isInverted }) =>\n                isInverted\n                    ? color(theme).primary.inverted\n                    : color(theme).primary.default};\n        outline-offset: 2px;\n    }\n\n    &:focus:not(:focus-visible) > * {\n        outline: none;\n    }\n`;\n\nexport interface SocialItem {\n    href: string;\n    icon: (props: { isInverted?: boolean; title?: string }) => React.ReactNode;\n    title?: string;\n}\n\nconst SocialList: FC<{\n    isInverted?: boolean;\n    title?: string;\n    items?: SocialItem[];\n    className?: string;\n}> = ({ isInverted = false, title, items, className }) => {\n    return (\n        <View className={className}>\n            {title && (\n                <Copy type=\"copy-b\" isInverted={isInverted}>\n                    {title}\n                </Copy>\n            )}\n            <List>\n                {items?.map((item, i) => (\n                    <IconContainer key={i}>\n                        <StyledLink\n                            isExternal\n                            href={item.href}\n                            isInverted={isInverted}\n                            ariaLabel={item.title || `social_${i}`}\n                        >\n                            {item.icon &&\n                                item.icon({ isInverted, title: item.title })}\n                        </StyledLink>\n                    </IconContainer>\n                ))}\n            </List>\n        </View>\n    );\n};\n\nexport default SocialList;\n"],"names":["View","styled","div","spacings","nudge","List","ul","IconContainer","li","templateObject_3","__makeTemplateObject","StyledLink","Link","templateObject_4","_a","theme","isInverted","color","text","inverted","default","primary","SocialList","_b","title","items","className","React","createElement","Copy","type","map","item","i","key","isExternal","href","ariaLabel","concat","icon"],"mappings":"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"}
+{"version":3,"file":"SocialList-d5adb772.js","sources":["../src/components/blocks/SocialList.tsx"],"sourcesContent":["import React, { FC } from 'react';\nimport styled from 'styled-components';\n\nimport { getColors as color, spacings } from 'utils/styles';\nimport Link from 'components/typography/Link';\nimport Copy from 'components/typography/Copy';\n\nconst View = styled.div`\n    & > * {\n        margin: 0;\n        padding: 0;\n    }\n\n    & > * + * {\n        margin-top: ${spacings.nudge * 2}px;\n    }\n`;\n\nconst List = styled.ul`\n    display: inline-flex;\n    flex-direction: row;\n    align-items: center;\n    list-style: none;\n\n    & > * + * {\n        margin-left: ${spacings.nudge * 3}px;\n    }\n`;\n\nconst IconContainer = styled.li`\n    display: block;\n    padding: 0;\n`;\n\nconst StyledLink = styled(Link)`\n    display: block;\n    padding: ${spacings.nudge * 2}px ${spacings.nudge * 1.5}px;\n    margin: -${spacings.nudge * 2}px -${spacings.nudge * 1.5}px;\n    color: ${({ theme, isInverted }) =>\n        isInverted ? color(theme).text.inverted : color(theme).text.default};\n    outline: none;\n\n    transition: all ease-in-out 0.2s;\n\n    &:focus {\n        outline: none;\n    }\n\n    &:focus > * {\n        outline: 2px solid\n            ${({ theme, isInverted }) =>\n                isInverted\n                    ? color(theme).primary.inverted\n                    : color(theme).primary.default};\n        outline-offset: 2px;\n    }\n\n    &:focus:not(:focus-visible) > * {\n        outline: none;\n    }\n`;\n\nexport interface SocialItem {\n    href: string;\n    icon: (props: { isInverted?: boolean; title?: string }) => React.ReactNode;\n    title?: string;\n}\n\nconst SocialList: FC<{\n    isInverted?: boolean;\n    title?: string;\n    items?: SocialItem[];\n    className?: string;\n}> = ({ isInverted = false, title, items, className }) => {\n    return (\n        <View className={className}>\n            {title && (\n                <Copy type=\"copy-b\" isInverted={isInverted}>\n                    {title}\n                </Copy>\n            )}\n            <List>\n                {items?.map((item, i) => (\n                    <IconContainer key={i}>\n                        <StyledLink\n                            isExternal\n                            href={item.href}\n                            isInverted={isInverted}\n                            ariaLabel={item.title || `social_${i}`}\n                        >\n                            {item.icon &&\n                                item.icon({ isInverted, title: item.title })}\n                        </StyledLink>\n                    </IconContainer>\n                ))}\n            </List>\n        </View>\n    );\n};\n\nexport default SocialList;\n"],"names":["View","styled","div","spacings","nudge","List","ul","IconContainer","li","templateObject_3","__makeTemplateObject","StyledLink","Link","templateObject_4","_a","theme","isInverted","color","text","inverted","default","primary","SocialList","_b","title","items","className","React","createElement","Copy","type","map","item","i","key","isExternal","href","ariaLabel","concat","icon"],"mappings":"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"}