@laerdal/life-react-components 3.2.1-dev.11.full → 3.2.1-dev.12.full
This diff represents the content of publicly available package versions that have been released to one of the supported registries. The information contained in this diff is provided for informational purposes only and reflects changes between package versions as they appear in their respective public registries.
package/dist/Button/Button.cjs
CHANGED
|
@@ -109,24 +109,24 @@ var ButtonSecondaryStyled = (0, _styledComponents.default)(ButtonPrimaryStyled)(
|
|
|
109
109
|
return (props === null || props === void 0 ? void 0 : props.colorTheme) === 'dark' ? _styles.COLORS.primary_700 : _styles.COLORS.neutral_100;
|
|
110
110
|
});
|
|
111
111
|
exports.ButtonSecondaryStyled = ButtonSecondaryStyled;
|
|
112
|
-
var ButtonTertiaryStyled = (0, _styledComponents.default)(ButtonPrimaryStyled)(_templateObject3 || (_templateObject3 = (0, _taggedTemplateLiteral2.default)(["\n div.button-content {\n color: ", ";\n background-color: transparent;\n div svg path {\n fill: ", ";\n }\n padding: ", ";\n }\n &:hover > div.button-content,\n &.hover-state > div.button-content {\n background-color: ", ";\n color: ", ";\n div {\n svg {\n path {\n fill: ", ";\n }\n }\n }\n }\n &:active > div.button-content,\n &.active-state > div.button-content {\n background-color: ", ";\n color: ", ";\n div {\n svg {\n path {\n fill: ", ";\n }\n }\n }\n }\n\n &:disabled > div.button-content,\n &.disabled-state > div.button-content {\n background-color: transparent !important;\n color: ", ";\n border-color: transparent !important;\n }\n"])), function (props) {
|
|
113
|
-
return props.colorTheme === 'teal' ? _styles.COLORS.accent1 : _styles.COLORS.white;
|
|
112
|
+
var ButtonTertiaryStyled = (0, _styledComponents.default)(ButtonPrimaryStyled)(_templateObject3 || (_templateObject3 = (0, _taggedTemplateLiteral2.default)(["\n div.button-content {\n color: ", ";\n background-color: transparent;\n\n div svg path {\n fill: ", ";\n }\n\n padding: ", ";\n }\n\n &:hover > div.button-content,\n &.hover-state > div.button-content {\n background-color: ", ";\n color: ", ";\n\n div {\n svg {\n path {\n fill: ", ";\n }\n }\n }\n }\n &:active > div.button-content,\n &.active-state > div.button-content {\n background-color: ", ";\n color: ", ";\n\n div {\n svg {\n path {\n fill: ", ";\n }\n }\n }\n }\n\n &:disabled > div.button-content,\n &.disabled-state > div.button-content {\n background-color: transparent !important;\n color: ", ";\n border-color: transparent !important;\n }\n"])), function (props) {
|
|
113
|
+
return props.colorTheme === 'teal' ? _styles.COLORS.accent1 : props.colorTheme === 'dark' ? _styles.COLORS.white : _styles.COLORS.primary_500;
|
|
114
114
|
}, function (props) {
|
|
115
|
-
return props.colorTheme === 'teal' ? _styles.COLORS.accent1 : _styles.COLORS.white;
|
|
115
|
+
return props.colorTheme === 'teal' ? _styles.COLORS.accent1 : props.colorTheme === 'dark' ? _styles.COLORS.white : _styles.COLORS.primary_500;
|
|
116
116
|
}, function (props) {
|
|
117
117
|
return props.size === _types.Size.Large ? '12px 16px' : props.size === _types.Size.Small ? '4px 8px' : '6px 12px';
|
|
118
118
|
}, function (props) {
|
|
119
|
-
return props.colorTheme === 'teal' ? _styles.COLORS.accent1_20 : _styles.COLORS.primary_700;
|
|
119
|
+
return props.colorTheme === 'teal' ? _styles.COLORS.accent1_20 : props.colorTheme === 'dark' ? _styles.COLORS.primary_700 : _styles.COLORS.primary_20;
|
|
120
120
|
}, function (props) {
|
|
121
|
-
return props.colorTheme === 'teal' ? _styles.COLORS.accent1_700 : _styles.COLORS.white;
|
|
121
|
+
return props.colorTheme === 'teal' ? _styles.COLORS.accent1_700 : props.colorTheme === 'dark' ? _styles.COLORS.white : _styles.COLORS.primary_700;
|
|
122
122
|
}, function (props) {
|
|
123
|
-
return props.colorTheme === 'teal' ? _styles.COLORS.accent1_700 : _styles.COLORS.white;
|
|
123
|
+
return props.colorTheme === 'teal' ? _styles.COLORS.accent1_700 : props.colorTheme === 'dark' ? _styles.COLORS.white : _styles.COLORS.primary_700;
|
|
124
124
|
}, function (props) {
|
|
125
|
-
return props.colorTheme === 'teal' ? _styles.COLORS.accent1_100 : _styles.COLORS.primary_600;
|
|
125
|
+
return props.colorTheme === 'teal' ? _styles.COLORS.accent1_100 : props.colorTheme === 'dark' ? _styles.COLORS.primary_600 : _styles.COLORS.primary_100;
|
|
126
126
|
}, function (props) {
|
|
127
|
-
return props.colorTheme === 'teal' ? _styles.COLORS.accent1_800 : _styles.COLORS.white;
|
|
127
|
+
return props.colorTheme === 'teal' ? _styles.COLORS.accent1_800 : props.colorTheme === 'dark' ? _styles.COLORS.white : _styles.COLORS.primary_800;
|
|
128
128
|
}, function (props) {
|
|
129
|
-
return props.colorTheme === 'teal' ? _styles.COLORS.accent1_800 : _styles.COLORS.white;
|
|
129
|
+
return props.colorTheme === 'teal' ? _styles.COLORS.accent1_800 : props.colorTheme === 'dark' ? _styles.COLORS.white : _styles.COLORS.primary_800;
|
|
130
130
|
}, _styles.COLORS.primary_700);
|
|
131
131
|
exports.ButtonTertiaryStyled = ButtonTertiaryStyled;
|
|
132
132
|
var ButtonPositiveStyled = (0, _styledComponents.default)(ButtonPrimaryStyled)(_templateObject4 || (_templateObject4 = (0, _taggedTemplateLiteral2.default)(["\n div.button-content {\n color: white;\n background-color: ", ";\n }\n &:hover > div.button-content,\n &.hover-state > div.button-content {\n background-color: ", ";\n }\n &:active > div.button-content,\n &.active-state > div.button-content {\n background-color: ", ";\n }\n\n &:disabled > div.button-content,\n &.disabled-state > div.button-content {\n background-color: ", ";\n color: ", ";\n }\n"])), _styles.COLORS.correct_500, _styles.COLORS.correct_700, _styles.COLORS.correct_800, _styles.COLORS.neutral_100, _styles.COLORS.neutral_300);
|
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"file":"Button.cjs","names":["getBorderRadius","flatEdge","radius","ButtonPrimaryStyled","styled","button","props","size","Size","Large","ComponentLStyling","ComponentTextStyle","Bold","colorTheme","COLORS","primary_800","white","Small","ComponentSStyling","ComponentMStyling","accent1","primary","width","minWidth","Medium","iconOnly","accent1_700","primary_100","primary_700","primary_600","accent1_800","primary_200","invertFocus","undefined","invertedFocusStyles","focusStyles","neutral_100","neutral_300","ButtonSecondaryStyled","primary_300","ButtonTertiaryStyled","accent1_20","accent1_100","ButtonPositiveStyled","correct_500","correct_700","correct_800","ButtonCriticalStyled","critical_500","critical_700","critical_800","Button","React","forwardRef","ref","children","variant","type","testId","disabled","icon","loading","renderProps","renderContent","ButtonStyled","className","defaultOnMouseDownHandler","role","title"],"sources":["../../src/Button/Button.tsx"],"sourcesContent":["import * as React from 'react';\nimport styled, { css } from 'styled-components';\nimport { LoadingIndicator } from '../LoadingIndicator';\nimport { ComponentLStyling, ComponentMStyling, ComponentSStyling, ComponentTextStyle } from '../styles';\nimport { COLORS, focusStyles, invertedFocusStyles } from '../styles';\nimport { Size, Testable } from '../types';\nimport { defaultOnMouseDownHandler } from '../common';\n\nconst getBorderRadius = (flatEdge: string | undefined, radius: number) => {\n switch (flatEdge) {\n case 'left':\n return `0px ${radius}px ${radius}px 0px`;\n\n case 'right':\n return `${radius}px 0px 0px ${radius}px`;\n\n case 'none':\n default:\n return `${radius}px`;\n }\n};\n\nexport const ButtonPrimaryStyled = styled.button<ButtonProps>`\n border: none;\n background-color: transparent;\n cursor: pointer;\n padding: 0;\n margin: 0;\n position: relative;\n box-sizing: border-box;\n min-height: ${(props) => (props.size === Size.Large ? '56px' : '48px')};\n &.loading-state {\n cursor: wait;\n }\n div.button-content {\n ${(props) =>\n props.size === Size.Large\n ? ComponentLStyling(ComponentTextStyle.Bold, props?.colorTheme === 'dark' ? COLORS.primary_800 : COLORS.white)\n : props.size === Size.Small\n ? ComponentSStyling(ComponentTextStyle.Bold, props?.colorTheme === 'dark' ? COLORS.primary_800 : COLORS.white)\n : ComponentMStyling(ComponentTextStyle.Bold, props?.colorTheme === 'dark' ? COLORS.primary_800 : COLORS.white)};\n\n background-color: ${(props) => (props.colorTheme === 'teal' ? COLORS.accent1 : props?.colorTheme === 'dark' ? COLORS.white : COLORS.primary)};\n border-radius: ${(props) => getBorderRadius(props.flatEdge, 8)};\n\n width: ${(props) => props.width};\n position: relative;\n\n min-height: ${(props) => (props.size === Size.Large ? '56px' : props.size === Size.Small ? '32px' : '40px')};\n min-width: ${(props) => props.minWidth};\n\n box-sizing: border-box;\n display: flex;\n align-items: center;\n justify-content: center;\n padding: ${(props) => (props.size === Size.Large ? '14px 16px' : props.size === Size.Small ? '6px 8px' : '8px 12px')};\n\n span.icon:not(.loading) {\n pointer-events: none;\n }\n\n span.loading {\n opacity: 0;\n }\n\n .icon {\n margin: ${(props) => (props.size === Size.Medium ? props.iconOnly ? '-2px -8px' : '' : (props.size === Size.Small ? props.iconOnly ? '-2px -6px' : '' : '' ))};\n width: ${(props) => (props.size === Size.Large ? '28px' : props.size === Size.Small ? '20px' : '24px')};\n height: ${(props) => (props.size === Size.Large ? '28px' : props.size === Size.Small ? '20px' : '24px')};\n svg {\n width: ${(props) => (props.size === Size.Large ? '28px' : props.size === Size.Small ? '20px' : '24px')} !important;\n height: ${(props) => (props.size === Size.Large ? '28px' : props.size === Size.Small ? '20px' : '24px')} !important;\n }\n }\n\n .label {\n margin: 0 4px;\n }\n\n div {\n position: absolute;\n width: 100%;\n svg {\n height: ${(props) => (props.size === Size.Large ? '28px' : props.size === Size.Small ? '20px' : '24px')};\n width: ${(props) => (props.size === Size.Large ? '28px' : props.size === Size.Small ? '20px' : '24px')};\n path {\n fill: ${(props) => (props.colorTheme === 'dark' ? COLORS.primary : COLORS.white)};\n }\n }\n }\n }\n &:hover > div.button-content,\n &.hover-state > div.button-content {\n background-color: ${(props) => (props.colorTheme === 'teal' ? COLORS.accent1_700 : props?.colorTheme === 'dark' ? COLORS.primary_100 : COLORS.primary_700)};\n color: ${(props) => (props?.colorTheme === 'dark' ? COLORS.primary_600 : COLORS.white)};\n }\n &:active > div.button-content,\n &.active-state > div.button-content {\n background-color: ${(props) => (props.colorTheme === 'teal' ? COLORS.accent1_800 : props?.colorTheme === 'dark' ? COLORS.primary_200 : COLORS.primary_800)};\n color: ${(props) => (props?.colorTheme === 'dark' ? COLORS.primary_800 : COLORS.white)};\n }\n\n &:focus,\n &.focus-state {\n ${(props) => (props.invertFocus || (props.invertFocus === undefined && props.colorTheme === 'dark') ? invertedFocusStyles : focusStyles)}\n }\n &:disabled,\n &.disabled-state {\n cursor: not-allowed;\n }\n &:disabled > div.button-content,\n &.disabled-state > div.button-content {\n pointer-events: none;\n background-color: ${(props) => (props.colorTheme === 'dark' ? COLORS.primary_700 : COLORS.neutral_100)};\n color: ${(props) => (props.colorTheme === 'dark' ? COLORS.primary_800 : COLORS.neutral_300)};\n }\n`;\n\nexport const ButtonSecondaryStyled = styled(ButtonPrimaryStyled)<ButtonProps>`\n div.button-content {\n color: ${(props) => (props.colorTheme === 'teal' ? COLORS.accent1 : props?.colorTheme === 'dark' ? COLORS.white : COLORS.primary)};\n background-color: transparent;\n div svg path {\n fill: ${(props) => (props.colorTheme === 'teal' ? COLORS.accent1 : COLORS.primary)};\n }\n box-shadow: inset 0 0 0 2px ${(props) => (props.colorTheme === 'teal' ? COLORS.accent1 : props?.colorTheme === 'dark' ? COLORS.white : COLORS.primary)};\n \n padding: ${(props) => (props.size === Size.Large ? '12px 16px' : props.size === Size.Small ? '4px 8px' : '6px 12px')};\n }\n\n &:hover > div.button-content,\n &.hover-state > div.button-content {\n color: ${(props) => (props.colorTheme === 'teal' ? COLORS.accent1_700 : props?.colorTheme === 'dark' ? COLORS.primary_200 : COLORS.primary_700)};\n box-shadow: inset 0 0 0 2px ${(props) => (props.colorTheme === 'teal' ? COLORS.accent1_700 : props?.colorTheme === 'dark' ? COLORS.primary_200 : COLORS.primary_700)};\n \n background-color: transparent;\n div {\n svg {\n path {\n fill: ${(props) => (props.colorTheme === 'teal' ? COLORS.accent1_700 : COLORS.primary_700)};\n }\n }\n }\n }\n &:active > div.button-content,\n &.active-state > div.button-content {\n color: ${(props) => (props.colorTheme === 'teal' ? COLORS.accent1_800 : props?.colorTheme === 'dark' ? COLORS.primary_300 : COLORS.primary_800)};\n box-shadow: inset 0 0 0 2px ${(props) => (props.colorTheme === 'teal' ? COLORS.accent1_800 : props?.colorTheme === 'dark' ? COLORS.primary_300 : COLORS.primary_800)};\n \n background-color: transparent;\n div {\n svg {\n path {\n fill: ${(props) => (props.colorTheme === 'teal' ? COLORS.accent1_800 : props?.colorTheme === 'dark' ? COLORS.white : COLORS.primary_800)};\n }\n }\n }\n }\n\n &:disabled > div.button-content,\n &.disabled-state > div.button-content {\n background-color: transparent;\n color: ${(props) => (props?.colorTheme === 'dark' ? COLORS.primary_700 : COLORS.neutral_300)};\n box-shadow: inset 0 0 0 2px ${(props) => (props?.colorTheme === 'dark' ? COLORS.primary_700 : COLORS.neutral_100)};\n }\n`;\n\nexport const ButtonTertiaryStyled = styled(ButtonPrimaryStyled)<ButtonProps>`\n div.button-content {\n color: ${(props) => (props.colorTheme === 'teal' ? COLORS.accent1 : COLORS.white)};\n background-color: transparent;\n div svg path {\n fill: ${(props) => (props.colorTheme === 'teal' ? COLORS.accent1 : COLORS.white)};\n }\n padding: ${(props) => (props.size === Size.Large ? '12px 16px' : props.size === Size.Small ? '4px 8px' : '6px 12px')};\n }\n &:hover > div.button-content,\n &.hover-state > div.button-content {\n background-color: ${(props) => (props.colorTheme === 'teal' ? COLORS.accent1_20 : COLORS.primary_700)};\n color: ${(props) => (props.colorTheme === 'teal' ? COLORS.accent1_700 : COLORS.white)};\n div {\n svg {\n path {\n fill: ${(props) => (props.colorTheme === 'teal' ? COLORS.accent1_700 : COLORS.white)};\n }\n }\n }\n }\n &:active > div.button-content,\n &.active-state > div.button-content {\n background-color: ${(props) => (props.colorTheme === 'teal' ? COLORS.accent1_100 : COLORS.primary_600)};\n color: ${(props) => (props.colorTheme === 'teal' ? COLORS.accent1_800 : COLORS.white)};\n div {\n svg {\n path {\n fill: ${(props) => (props.colorTheme === 'teal' ? COLORS.accent1_800 : COLORS.white)};\n }\n }\n }\n }\n\n &:disabled > div.button-content,\n &.disabled-state > div.button-content {\n background-color: transparent !important;\n color: ${COLORS.primary_700};\n border-color: transparent !important;\n }\n`;\n\nexport const ButtonPositiveStyled = styled(ButtonPrimaryStyled)<ButtonProps>`\n div.button-content {\n color: white;\n background-color: ${COLORS.correct_500};\n }\n &:hover > div.button-content,\n &.hover-state > div.button-content {\n background-color: ${COLORS.correct_700};\n }\n &:active > div.button-content,\n &.active-state > div.button-content {\n background-color: ${COLORS.correct_800};\n }\n\n &:disabled > div.button-content,\n &.disabled-state > div.button-content {\n background-color: ${COLORS.neutral_100};\n color: ${COLORS.neutral_300};\n }\n`;\n\nexport const ButtonCriticalStyled = styled(ButtonPrimaryStyled)<ButtonProps>`\n div.button-content {\n color: white;\n background-color: ${COLORS.critical_500};\n }\n &:hover > div.button-content,\n &.hover-state > div.button-content {\n background-color: ${COLORS.critical_700};\n }\n &:active > div.button-content,\n &.active-state > div.button-content {\n background-color: ${COLORS.critical_800};\n }\n\n &:disabled > div.button-content,\n &.disabled-state > div.button-content {\n background-color: ${COLORS.neutral_100};\n color: ${COLORS.neutral_300}; \n }\n`;\n\nexport interface ButtonProps extends React.ButtonHTMLAttributes<HTMLButtonElement> {\n variant?: 'primary' | 'secondary' | 'tertiary' | 'positive' | 'critical';\n flatEdge?: 'right' | 'left' | 'none' | undefined;\n role?: 'button' | string;\n title?: string;\n size?: Size;\n colorTheme?: 'teal' | 'dark';\n invertFocus?: boolean;\n width?: 'auto' | string;\n loading?: boolean;\n testId?: string;\n icon?: React.ReactNode;\n minWidth?: string;\n iconOnly?: boolean;\n}\n\nconst Button = React.forwardRef<HTMLButtonElement, ButtonProps>(\n ({ children = '', variant = 'primary', type = 'button', size = Size.Medium, width = 'auto', minWidth = '64px', testId, disabled, flatEdge, icon, ...props }, ref) => {\n // Let's filter out properties that we don't need to render.\n const { loading, ...renderProps } = props;\n\n const renderContent = () => (\n <>\n {icon && <span className={(children ? 'extramargin ' : '') + (loading ? 'icon loading' : 'icon')}>{icon}</span>}\n {children && <span className={loading ? 'label loading' : 'label'}>{children}</span>}\n {loading && <LoadingIndicator />}\n </>\n );\n\n let ButtonStyled = ButtonPrimaryStyled;\n switch (variant) {\n case 'secondary':\n ButtonStyled = ButtonSecondaryStyled;\n break;\n case 'tertiary':\n ButtonStyled = ButtonTertiaryStyled;\n break;\n case 'positive':\n ButtonStyled = ButtonPositiveStyled;\n break;\n case 'critical':\n ButtonStyled = ButtonCriticalStyled;\n break;\n }\n\n return (\n <ButtonStyled\n {...renderProps}\n ref={ref}\n disabled={disabled}\n iconOnly={!children}\n type={type}\n size={size}\n flatEdge={flatEdge}\n width={width}\n minWidth={minWidth}\n data-testid={testId}\n className={props.loading ? 'loading-state ' + props.className : ' ' + props.className}\n onMouseDown={defaultOnMouseDownHandler}>\n <div className=\"button-content\">{renderContent()}</div>\n </ButtonStyled>\n );\n },\n);\n\nexport default Button;\n"],"mappings":";;;;;;;;;;;;AAAA;AACA;AACA;AACA;AAEA;AACA;AAAsD;AAAA;EAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAEtD,IAAMA,eAAe,GAAG,SAAlBA,eAAe,CAAIC,QAA4B,EAAEC,MAAc,EAAK;EACxE,QAAQD,QAAQ;IACd,KAAK,MAAM;MACT,qBAAcC,MAAM,gBAAMA,MAAM;IAElC,KAAK,OAAO;MACV,iBAAUA,MAAM,wBAAcA,MAAM;IAEtC,KAAK,MAAM;IACX;MACE,iBAAUA,MAAM;EAAK;AAE3B,CAAC;AAEM,IAAMC,mBAAmB,GAAGC,yBAAM,CAACC,MAAM,+nDAQhC,UAACC,KAAK;EAAA,OAAMA,KAAK,CAACC,IAAI,KAAKC,WAAI,CAACC,KAAK,GAAG,MAAM,GAAG,MAAM;AAAA,CAAC,EAKlE,UAACH,KAAK;EAAA,OACNA,KAAK,CAACC,IAAI,KAAKC,WAAI,CAACC,KAAK,GACrB,IAAAC,yBAAiB,EAACC,0BAAkB,CAACC,IAAI,EAAE,CAAAN,KAAK,aAALA,KAAK,uBAALA,KAAK,CAAEO,UAAU,MAAK,MAAM,GAAGC,cAAM,CAACC,WAAW,GAAGD,cAAM,CAACE,KAAK,CAAC,GAC5GV,KAAK,CAACC,IAAI,KAAKC,WAAI,CAACS,KAAK,GACzB,IAAAC,yBAAiB,EAACP,0BAAkB,CAACC,IAAI,EAAE,CAAAN,KAAK,aAALA,KAAK,uBAALA,KAAK,CAAEO,UAAU,MAAK,MAAM,GAAGC,cAAM,CAACC,WAAW,GAAGD,cAAM,CAACE,KAAK,CAAC,GAC5G,IAAAG,yBAAiB,EAACR,0BAAkB,CAACC,IAAI,EAAE,CAAAN,KAAK,aAALA,KAAK,uBAALA,KAAK,CAAEO,UAAU,MAAK,MAAM,GAAGC,cAAM,CAACC,WAAW,GAAGD,cAAM,CAACE,KAAK,CAAC;AAAA,GAE9F,UAACV,KAAK;EAAA,OAAMA,KAAK,CAACO,UAAU,KAAK,MAAM,GAAGC,cAAM,CAACM,OAAO,GAAG,CAAAd,KAAK,aAALA,KAAK,uBAALA,KAAK,CAAEO,UAAU,MAAK,MAAM,GAAGC,cAAM,CAACE,KAAK,GAAGF,cAAM,CAACO,OAAO;AAAA,CAAC,EAC3H,UAACf,KAAK;EAAA,OAAKN,eAAe,CAACM,KAAK,CAACL,QAAQ,EAAE,CAAC,CAAC;AAAA,GAErD,UAACK,KAAK;EAAA,OAAKA,KAAK,CAACgB,KAAK;AAAA,GAGjB,UAAChB,KAAK;EAAA,OAAMA,KAAK,CAACC,IAAI,KAAKC,WAAI,CAACC,KAAK,GAAG,MAAM,GAAGH,KAAK,CAACC,IAAI,KAAKC,WAAI,CAACS,KAAK,GAAG,MAAM,GAAG,MAAM;AAAA,CAAC,EAC9F,UAACX,KAAK;EAAA,OAAKA,KAAK,CAACiB,QAAQ;AAAA,GAM3B,UAACjB,KAAK;EAAA,OAAMA,KAAK,CAACC,IAAI,KAAKC,WAAI,CAACC,KAAK,GAAG,WAAW,GAAGH,KAAK,CAACC,IAAI,KAAKC,WAAI,CAACS,KAAK,GAAG,SAAS,GAAG,UAAU;AAAA,CAAC,EAWxG,UAACX,KAAK;EAAA,OAAMA,KAAK,CAACC,IAAI,KAAKC,WAAI,CAACgB,MAAM,GAAGlB,KAAK,CAACmB,QAAQ,GAAG,WAAW,GAAG,EAAE,GAAInB,KAAK,CAACC,IAAI,KAAKC,WAAI,CAACS,KAAK,GAAGX,KAAK,CAACmB,QAAQ,GAAG,WAAW,GAAG,EAAE,GAAG,EAAI;AAAA,CAAC,EACpJ,UAACnB,KAAK;EAAA,OAAMA,KAAK,CAACC,IAAI,KAAKC,WAAI,CAACC,KAAK,GAAG,MAAM,GAAGH,KAAK,CAACC,IAAI,KAAKC,WAAI,CAACS,KAAK,GAAG,MAAM,GAAG,MAAM;AAAA,CAAC,EAC5F,UAACX,KAAK;EAAA,OAAMA,KAAK,CAACC,IAAI,KAAKC,WAAI,CAACC,KAAK,GAAG,MAAM,GAAGH,KAAK,CAACC,IAAI,KAAKC,WAAI,CAACS,KAAK,GAAG,MAAM,GAAG,MAAM;AAAA,CAAC,EAE5F,UAACX,KAAK;EAAA,OAAMA,KAAK,CAACC,IAAI,KAAKC,WAAI,CAACC,KAAK,GAAG,MAAM,GAAGH,KAAK,CAACC,IAAI,KAAKC,WAAI,CAACS,KAAK,GAAG,MAAM,GAAG,MAAM;AAAA,CAAC,EAC5F,UAACX,KAAK;EAAA,OAAMA,KAAK,CAACC,IAAI,KAAKC,WAAI,CAACC,KAAK,GAAG,MAAM,GAAGH,KAAK,CAACC,IAAI,KAAKC,WAAI,CAACS,KAAK,GAAG,MAAM,GAAG,MAAM;AAAA,CAAC,EAY7F,UAACX,KAAK;EAAA,OAAMA,KAAK,CAACC,IAAI,KAAKC,WAAI,CAACC,KAAK,GAAG,MAAM,GAAGH,KAAK,CAACC,IAAI,KAAKC,WAAI,CAACS,KAAK,GAAG,MAAM,GAAG,MAAM;AAAA,CAAC,EAC9F,UAACX,KAAK;EAAA,OAAMA,KAAK,CAACC,IAAI,KAAKC,WAAI,CAACC,KAAK,GAAG,MAAM,GAAGH,KAAK,CAACC,IAAI,KAAKC,WAAI,CAACS,KAAK,GAAG,MAAM,GAAG,MAAM;AAAA,CAAC,EAE5F,UAACX,KAAK;EAAA,OAAMA,KAAK,CAACO,UAAU,KAAK,MAAM,GAAGC,cAAM,CAACO,OAAO,GAAGP,cAAM,CAACE,KAAK;AAAA,CAAC,EAOlE,UAACV,KAAK;EAAA,OAAMA,KAAK,CAACO,UAAU,KAAK,MAAM,GAAGC,cAAM,CAACY,WAAW,GAAG,CAAApB,KAAK,aAALA,KAAK,uBAALA,KAAK,CAAEO,UAAU,MAAK,MAAM,GAAGC,cAAM,CAACa,WAAW,GAAGb,cAAM,CAACc,WAAW;AAAA,CAAC,EACjJ,UAACtB,KAAK;EAAA,OAAM,CAAAA,KAAK,aAALA,KAAK,uBAALA,KAAK,CAAEO,UAAU,MAAK,MAAM,GAAGC,cAAM,CAACe,WAAW,GAAGf,cAAM,CAACE,KAAK;AAAA,CAAC,EAIlE,UAACV,KAAK;EAAA,OAAMA,KAAK,CAACO,UAAU,KAAK,MAAM,GAAGC,cAAM,CAACgB,WAAW,GAAG,CAAAxB,KAAK,aAALA,KAAK,uBAALA,KAAK,CAAEO,UAAU,MAAK,MAAM,GAAGC,cAAM,CAACiB,WAAW,GAAGjB,cAAM,CAACC,WAAW;AAAA,CAAC,EACjJ,UAACT,KAAK;EAAA,OAAM,CAAAA,KAAK,aAALA,KAAK,uBAALA,KAAK,CAAEO,UAAU,MAAK,MAAM,GAAGC,cAAM,CAACC,WAAW,GAAGD,cAAM,CAACE,KAAK;AAAA,CAAC,EAKpF,UAACV,KAAK;EAAA,OAAMA,KAAK,CAAC0B,WAAW,IAAK1B,KAAK,CAAC0B,WAAW,KAAKC,SAAS,IAAI3B,KAAK,CAACO,UAAU,KAAK,MAAO,GAAGqB,2BAAmB,GAAGC,mBAAW;AAAA,CAAC,EASpH,UAAC7B,KAAK;EAAA,OAAMA,KAAK,CAACO,UAAU,KAAK,MAAM,GAAGC,cAAM,CAACc,WAAW,GAAGd,cAAM,CAACsB,WAAW;AAAA,CAAC,EAC7F,UAAC9B,KAAK;EAAA,OAAMA,KAAK,CAACO,UAAU,KAAK,MAAM,GAAGC,cAAM,CAACC,WAAW,GAAGD,cAAM,CAACuB,WAAW;AAAA,CAAC,CAE9F;AAAC;AAEK,IAAMC,qBAAqB,GAAG,IAAAlC,yBAAM,EAACD,mBAAmB,CAAC,u+BAEnD,UAACG,KAAK;EAAA,OAAMA,KAAK,CAACO,UAAU,KAAK,MAAM,GAAGC,cAAM,CAACM,OAAO,GAAG,CAAAd,KAAK,aAALA,KAAK,uBAALA,KAAK,CAAEO,UAAU,MAAK,MAAM,GAAGC,cAAM,CAACE,KAAK,GAAGF,cAAM,CAACO,OAAO;AAAA,CAAC,EAGvH,UAACf,KAAK;EAAA,OAAMA,KAAK,CAACO,UAAU,KAAK,MAAM,GAAGC,cAAM,CAACM,OAAO,GAAGN,cAAM,CAACO,OAAO;AAAA,CAAC,EAEtD,UAACf,KAAK;EAAA,OAAMA,KAAK,CAACO,UAAU,KAAK,MAAM,GAAGC,cAAM,CAACM,OAAO,GAAG,CAAAd,KAAK,aAALA,KAAK,uBAALA,KAAK,CAAEO,UAAU,MAAK,MAAM,GAAGC,cAAM,CAACE,KAAK,GAAGF,cAAM,CAACO,OAAO;AAAA,CAAC,EAE3I,UAACf,KAAK;EAAA,OAAMA,KAAK,CAACC,IAAI,KAAKC,WAAI,CAACC,KAAK,GAAG,WAAW,GAAGH,KAAK,CAACC,IAAI,KAAKC,WAAI,CAACS,KAAK,GAAG,SAAS,GAAG,UAAU;AAAA,CAAC,EAK3G,UAACX,KAAK;EAAA,OAAMA,KAAK,CAACO,UAAU,KAAK,MAAM,GAAGC,cAAM,CAACY,WAAW,GAAG,CAAApB,KAAK,aAALA,KAAK,uBAALA,KAAK,CAAEO,UAAU,MAAK,MAAM,GAAGC,cAAM,CAACiB,WAAW,GAAGjB,cAAM,CAACc,WAAW;AAAA,CAAC,EACjH,UAACtB,KAAK;EAAA,OAAMA,KAAK,CAACO,UAAU,KAAK,MAAM,GAAGC,cAAM,CAACY,WAAW,GAAG,CAAApB,KAAK,aAALA,KAAK,uBAALA,KAAK,CAAEO,UAAU,MAAK,MAAM,GAAGC,cAAM,CAACiB,WAAW,GAAGjB,cAAM,CAACc,WAAW;AAAA,CAAC,EAMtJ,UAACtB,KAAK;EAAA,OAAMA,KAAK,CAACO,UAAU,KAAK,MAAM,GAAGC,cAAM,CAACY,WAAW,GAAGZ,cAAM,CAACc,WAAW;AAAA,CAAC,EAOvF,UAACtB,KAAK;EAAA,OAAMA,KAAK,CAACO,UAAU,KAAK,MAAM,GAAGC,cAAM,CAACgB,WAAW,GAAG,CAAAxB,KAAK,aAALA,KAAK,uBAALA,KAAK,CAAEO,UAAU,MAAK,MAAM,GAAGC,cAAM,CAACyB,WAAW,GAAGzB,cAAM,CAACC,WAAW;AAAA,CAAC,EACjH,UAACT,KAAK;EAAA,OAAMA,KAAK,CAACO,UAAU,KAAK,MAAM,GAAGC,cAAM,CAACgB,WAAW,GAAG,CAAAxB,KAAK,aAALA,KAAK,uBAALA,KAAK,CAAEO,UAAU,MAAK,MAAM,GAAGC,cAAM,CAACyB,WAAW,GAAGzB,cAAM,CAACC,WAAW;AAAA,CAAC,EAMtJ,UAACT,KAAK;EAAA,OAAMA,KAAK,CAACO,UAAU,KAAK,MAAM,GAAGC,cAAM,CAACgB,WAAW,GAAG,CAAAxB,KAAK,aAALA,KAAK,uBAALA,KAAK,CAAEO,UAAU,MAAK,MAAM,GAAGC,cAAM,CAACE,KAAK,GAAGF,cAAM,CAACC,WAAW;AAAA,CAAC,EASrI,UAACT,KAAK;EAAA,OAAM,CAAAA,KAAK,aAALA,KAAK,uBAALA,KAAK,CAAEO,UAAU,MAAK,MAAM,GAAGC,cAAM,CAACc,WAAW,GAAGd,cAAM,CAACuB,WAAW;AAAA,CAAC,EAC9D,UAAC/B,KAAK;EAAA,OAAM,CAAAA,KAAK,aAALA,KAAK,uBAALA,KAAK,CAAEO,UAAU,MAAK,MAAM,GAAGC,cAAM,CAACc,WAAW,GAAGd,cAAM,CAACsB,WAAW;AAAA,CAAC,CAEpH;AAAC;AAEK,IAAMI,oBAAoB,GAAG,IAAApC,yBAAM,EAACD,mBAAmB,CAAC,+1BAElD,UAACG,KAAK;EAAA,OAAMA,KAAK,CAACO,UAAU,KAAK,MAAM,GAAGC,cAAM,CAACM,OAAO,GAAGN,cAAM,CAACE,KAAK;AAAA,CAAC,EAGvE,UAACV,KAAK;EAAA,OAAMA,KAAK,CAACO,UAAU,KAAK,MAAM,GAAGC,cAAM,CAACM,OAAO,GAAGN,cAAM,CAACE,KAAK;AAAA,CAAC,EAEvE,UAACV,KAAK;EAAA,OAAMA,KAAK,CAACC,IAAI,KAAKC,WAAI,CAACC,KAAK,GAAG,WAAW,GAAGH,KAAK,CAACC,IAAI,KAAKC,WAAI,CAACS,KAAK,GAAG,SAAS,GAAG,UAAU;AAAA,CAAC,EAIhG,UAACX,KAAK;EAAA,OAAMA,KAAK,CAACO,UAAU,KAAK,MAAM,GAAGC,cAAM,CAAC2B,UAAU,GAAG3B,cAAM,CAACc,WAAW;AAAA,CAAC,EAC5F,UAACtB,KAAK;EAAA,OAAMA,KAAK,CAACO,UAAU,KAAK,MAAM,GAAGC,cAAM,CAACY,WAAW,GAAGZ,cAAM,CAACE,KAAK;AAAA,CAAC,EAIvE,UAACV,KAAK;EAAA,OAAMA,KAAK,CAACO,UAAU,KAAK,MAAM,GAAGC,cAAM,CAACY,WAAW,GAAGZ,cAAM,CAACE,KAAK;AAAA,CAAC,EAOtE,UAACV,KAAK;EAAA,OAAMA,KAAK,CAACO,UAAU,KAAK,MAAM,GAAGC,cAAM,CAAC4B,WAAW,GAAG5B,cAAM,CAACe,WAAW;AAAA,CAAC,EAC7F,UAACvB,KAAK;EAAA,OAAMA,KAAK,CAACO,UAAU,KAAK,MAAM,GAAGC,cAAM,CAACgB,WAAW,GAAGhB,cAAM,CAACE,KAAK;AAAA,CAAC,EAIvE,UAACV,KAAK;EAAA,OAAMA,KAAK,CAACO,UAAU,KAAK,MAAM,GAAGC,cAAM,CAACgB,WAAW,GAAGhB,cAAM,CAACE,KAAK;AAAA,CAAC,EASjFF,cAAM,CAACc,WAAW,CAG9B;AAAC;AAEK,IAAMe,oBAAoB,GAAG,IAAAvC,yBAAM,EAACD,mBAAmB,CAAC,kgBAGvCW,cAAM,CAAC8B,WAAW,EAIlB9B,cAAM,CAAC+B,WAAW,EAIlB/B,cAAM,CAACgC,WAAW,EAKlBhC,cAAM,CAACsB,WAAW,EAC7BtB,cAAM,CAACuB,WAAW,CAE9B;AAAC;AAEK,IAAMU,oBAAoB,GAAG,IAAA3C,yBAAM,EAACD,mBAAmB,CAAC,sgBAGvCW,cAAM,CAACkC,YAAY,EAInBlC,cAAM,CAACmC,YAAY,EAInBnC,cAAM,CAACoC,YAAY,EAKnBpC,cAAM,CAACsB,WAAW,EAC7BtB,cAAM,CAACuB,WAAW,CAE9B;AAAC;AAkBF,IAAMc,MAAM,gBAAGC,KAAK,CAACC,UAAU,CAC7B,gBAA6JC,GAAG,EAAK;EAAA,yBAAlKC,QAAQ;IAARA,QAAQ,8BAAG,EAAE;IAAA,oBAAEC,OAAO;IAAPA,OAAO,6BAAG,SAAS;IAAA,iBAAEC,IAAI;IAAJA,IAAI,0BAAG,QAAQ;IAAA,iBAAElD,IAAI;IAAJA,IAAI,0BAAGC,WAAI,CAACgB,MAAM;IAAA,kBAAEF,KAAK;IAALA,KAAK,2BAAG,MAAM;IAAA,qBAAEC,QAAQ;IAARA,QAAQ,8BAAG,MAAM;IAAEmC,MAAM,QAANA,MAAM;IAAEC,QAAQ,QAARA,QAAQ;IAAE1D,QAAQ,QAARA,QAAQ;IAAE2D,IAAI,QAAJA,IAAI;IAAKtD,KAAK;EACvJ;EACA,IAAQuD,OAAO,GAAqBvD,KAAK,CAAjCuD,OAAO;IAAKC,WAAW,0CAAKxD,KAAK;EAEzC,IAAMyD,aAAa,GAAG,SAAhBA,aAAa;IAAA,oBACjB;MAAA,WACGH,IAAI,iBAAI;QAAM,SAAS,EAAE,CAACL,QAAQ,GAAG,cAAc,GAAG,EAAE,KAAKM,OAAO,GAAG,cAAc,GAAG,MAAM,CAAE;QAAA,UAAED;MAAI,EAAQ,EAC9GL,QAAQ,iBAAI;QAAM,SAAS,EAAEM,OAAO,GAAG,eAAe,GAAG,OAAQ;QAAA,UAAEN;MAAQ,EAAQ,EACnFM,OAAO,iBAAI,qBAAC,kCAAgB,KAAG;IAAA,EAC/B;EAAA,CACJ;EAED,IAAIG,YAAY,GAAG7D,mBAAmB;EACtC,QAAQqD,OAAO;IACb,KAAK,WAAW;MACdQ,YAAY,GAAG1B,qBAAqB;MACpC;IACF,KAAK,UAAU;MACb0B,YAAY,GAAGxB,oBAAoB;MACnC;IACF,KAAK,UAAU;MACbwB,YAAY,GAAGrB,oBAAoB;MACnC;IACF,KAAK,UAAU;MACbqB,YAAY,GAAGjB,oBAAoB;MACnC;EAAM;EAGV,oBACE,qBAAC,YAAY,kCACPe,WAAW;IACf,GAAG,EAAER,GAAI;IACT,QAAQ,EAAEK,QAAS;IACnB,QAAQ,EAAE,CAACJ,QAAS;IACpB,IAAI,EAAEE,IAAK;IACX,IAAI,EAAElD,IAAK;IACX,QAAQ,EAAEN,QAAS;IACnB,KAAK,EAAEqB,KAAM;IACb,QAAQ,EAAEC,QAAS;IACnB,eAAamC,MAAO;IACpB,SAAS,EAAEpD,KAAK,CAACuD,OAAO,GAAG,gBAAgB,GAAGvD,KAAK,CAAC2D,SAAS,GAAG,GAAG,GAAG3D,KAAK,CAAC2D,SAAU;IACtF,WAAW,EAAEC,iCAA0B;IAAA,uBACvC;MAAK,SAAS,EAAC,gBAAgB;MAAA,UAAEH,aAAa;IAAE;EAAO,GAC1C;AAEnB,CAAC,CACF;AAAC;EA9DAP,OAAO,4BAAG,SAAS,EAAG,WAAW,EAAG,UAAU,EAAG,UAAU,EAAG,UAAU;EAExEW,IAAI,0DAAG,QAAQ;EACfC,KAAK;EAELvD,UAAU,4BAAG,MAAM,EAAG,MAAM;EAC5BmB,WAAW;EACXV,KAAK,0DAAG,MAAM;EACduC,OAAO;EACPH,MAAM;EACNE,IAAI;EACJrC,QAAQ;EACRE,QAAQ;AAAA;AAAA,eAoDK0B,MAAM;AAAA"}
|
|
1
|
+
{"version":3,"file":"Button.cjs","names":["getBorderRadius","flatEdge","radius","ButtonPrimaryStyled","styled","button","props","size","Size","Large","ComponentLStyling","ComponentTextStyle","Bold","colorTheme","COLORS","primary_800","white","Small","ComponentSStyling","ComponentMStyling","accent1","primary","width","minWidth","Medium","iconOnly","accent1_700","primary_100","primary_700","primary_600","accent1_800","primary_200","invertFocus","undefined","invertedFocusStyles","focusStyles","neutral_100","neutral_300","ButtonSecondaryStyled","primary_300","ButtonTertiaryStyled","primary_500","accent1_20","primary_20","accent1_100","ButtonPositiveStyled","correct_500","correct_700","correct_800","ButtonCriticalStyled","critical_500","critical_700","critical_800","Button","React","forwardRef","ref","children","variant","type","testId","disabled","icon","loading","renderProps","renderContent","ButtonStyled","className","defaultOnMouseDownHandler","role","title"],"sources":["../../src/Button/Button.tsx"],"sourcesContent":["import * as React from 'react';\nimport styled, { css } from 'styled-components';\nimport { LoadingIndicator } from '../LoadingIndicator';\nimport { ComponentLStyling, ComponentMStyling, ComponentSStyling, ComponentTextStyle } from '../styles';\nimport { COLORS, focusStyles, invertedFocusStyles } from '../styles';\nimport { Size, Testable } from '../types';\nimport { defaultOnMouseDownHandler } from '../common';\n\nconst getBorderRadius = (flatEdge: string | undefined, radius: number) => {\n switch (flatEdge) {\n case 'left':\n return `0px ${radius}px ${radius}px 0px`;\n\n case 'right':\n return `${radius}px 0px 0px ${radius}px`;\n\n case 'none':\n default:\n return `${radius}px`;\n }\n};\n\nexport const ButtonPrimaryStyled = styled.button<ButtonProps>`\n border: none;\n background-color: transparent;\n cursor: pointer;\n padding: 0;\n margin: 0;\n position: relative;\n box-sizing: border-box;\n min-height: ${(props) => (props.size === Size.Large ? '56px' : '48px')};\n &.loading-state {\n cursor: wait;\n }\n div.button-content {\n ${(props) =>\n props.size === Size.Large\n ? ComponentLStyling(ComponentTextStyle.Bold, props?.colorTheme === 'dark' ? COLORS.primary_800 : COLORS.white)\n : props.size === Size.Small\n ? ComponentSStyling(ComponentTextStyle.Bold, props?.colorTheme === 'dark' ? COLORS.primary_800 : COLORS.white)\n : ComponentMStyling(ComponentTextStyle.Bold, props?.colorTheme === 'dark' ? COLORS.primary_800 : COLORS.white)};\n\n background-color: ${(props) => (props.colorTheme === 'teal' ? COLORS.accent1 : props?.colorTheme === 'dark' ? COLORS.white : COLORS.primary)};\n border-radius: ${(props) => getBorderRadius(props.flatEdge, 8)};\n\n width: ${(props) => props.width};\n position: relative;\n\n min-height: ${(props) => (props.size === Size.Large ? '56px' : props.size === Size.Small ? '32px' : '40px')};\n min-width: ${(props) => props.minWidth};\n\n box-sizing: border-box;\n display: flex;\n align-items: center;\n justify-content: center;\n padding: ${(props) => (props.size === Size.Large ? '14px 16px' : props.size === Size.Small ? '6px 8px' : '8px 12px')};\n\n span.icon:not(.loading) {\n pointer-events: none;\n }\n\n span.loading {\n opacity: 0;\n }\n\n .icon {\n margin: ${(props) => (props.size === Size.Medium ? props.iconOnly ? '-2px -8px' : '' : (props.size === Size.Small ? props.iconOnly ? '-2px -6px' : '' : '' ))};\n width: ${(props) => (props.size === Size.Large ? '28px' : props.size === Size.Small ? '20px' : '24px')};\n height: ${(props) => (props.size === Size.Large ? '28px' : props.size === Size.Small ? '20px' : '24px')};\n svg {\n width: ${(props) => (props.size === Size.Large ? '28px' : props.size === Size.Small ? '20px' : '24px')} !important;\n height: ${(props) => (props.size === Size.Large ? '28px' : props.size === Size.Small ? '20px' : '24px')} !important;\n }\n }\n\n .label {\n margin: 0 4px;\n }\n\n div {\n position: absolute;\n width: 100%;\n svg {\n height: ${(props) => (props.size === Size.Large ? '28px' : props.size === Size.Small ? '20px' : '24px')};\n width: ${(props) => (props.size === Size.Large ? '28px' : props.size === Size.Small ? '20px' : '24px')};\n path {\n fill: ${(props) => (props.colorTheme === 'dark' ? COLORS.primary : COLORS.white)};\n }\n }\n }\n }\n &:hover > div.button-content,\n &.hover-state > div.button-content {\n background-color: ${(props) => (props.colorTheme === 'teal' ? COLORS.accent1_700 : props?.colorTheme === 'dark' ? COLORS.primary_100 : COLORS.primary_700)};\n color: ${(props) => (props?.colorTheme === 'dark' ? COLORS.primary_600 : COLORS.white)};\n }\n &:active > div.button-content,\n &.active-state > div.button-content {\n background-color: ${(props) => (props.colorTheme === 'teal' ? COLORS.accent1_800 : props?.colorTheme === 'dark' ? COLORS.primary_200 : COLORS.primary_800)};\n color: ${(props) => (props?.colorTheme === 'dark' ? COLORS.primary_800 : COLORS.white)};\n }\n\n &:focus,\n &.focus-state {\n ${(props) => (props.invertFocus || (props.invertFocus === undefined && props.colorTheme === 'dark') ? invertedFocusStyles : focusStyles)}\n }\n &:disabled,\n &.disabled-state {\n cursor: not-allowed;\n }\n &:disabled > div.button-content,\n &.disabled-state > div.button-content {\n pointer-events: none;\n background-color: ${(props) => (props.colorTheme === 'dark' ? COLORS.primary_700 : COLORS.neutral_100)};\n color: ${(props) => (props.colorTheme === 'dark' ? COLORS.primary_800 : COLORS.neutral_300)};\n }\n`;\n\nexport const ButtonSecondaryStyled = styled(ButtonPrimaryStyled)<ButtonProps>`\n div.button-content {\n color: ${(props) => (props.colorTheme === 'teal' ? COLORS.accent1 : props?.colorTheme === 'dark' ? COLORS.white : COLORS.primary)};\n background-color: transparent;\n div svg path {\n fill: ${(props) => (props.colorTheme === 'teal' ? COLORS.accent1 : COLORS.primary)};\n }\n box-shadow: inset 0 0 0 2px ${(props) => (props.colorTheme === 'teal' ? COLORS.accent1 : props?.colorTheme === 'dark' ? COLORS.white : COLORS.primary)};\n \n padding: ${(props) => (props.size === Size.Large ? '12px 16px' : props.size === Size.Small ? '4px 8px' : '6px 12px')};\n }\n\n &:hover > div.button-content,\n &.hover-state > div.button-content {\n color: ${(props) => (props.colorTheme === 'teal' ? COLORS.accent1_700 : props?.colorTheme === 'dark' ? COLORS.primary_200 : COLORS.primary_700)};\n box-shadow: inset 0 0 0 2px ${(props) => (props.colorTheme === 'teal' ? COLORS.accent1_700 : props?.colorTheme === 'dark' ? COLORS.primary_200 : COLORS.primary_700)};\n \n background-color: transparent;\n div {\n svg {\n path {\n fill: ${(props) => (props.colorTheme === 'teal' ? COLORS.accent1_700 : COLORS.primary_700)};\n }\n }\n }\n }\n &:active > div.button-content,\n &.active-state > div.button-content {\n color: ${(props) => (props.colorTheme === 'teal' ? COLORS.accent1_800 : props?.colorTheme === 'dark' ? COLORS.primary_300 : COLORS.primary_800)};\n box-shadow: inset 0 0 0 2px ${(props) => (props.colorTheme === 'teal' ? COLORS.accent1_800 : props?.colorTheme === 'dark' ? COLORS.primary_300 : COLORS.primary_800)};\n \n background-color: transparent;\n div {\n svg {\n path {\n fill: ${(props) => (props.colorTheme === 'teal' ? COLORS.accent1_800 : props?.colorTheme === 'dark' ? COLORS.white : COLORS.primary_800)};\n }\n }\n }\n }\n\n &:disabled > div.button-content,\n &.disabled-state > div.button-content {\n background-color: transparent;\n color: ${(props) => (props?.colorTheme === 'dark' ? COLORS.primary_700 : COLORS.neutral_300)};\n box-shadow: inset 0 0 0 2px ${(props) => (props?.colorTheme === 'dark' ? COLORS.primary_700 : COLORS.neutral_100)};\n }\n`;\n\nexport const ButtonTertiaryStyled = styled(ButtonPrimaryStyled)<ButtonProps>`\n div.button-content {\n color: ${(props) => (props.colorTheme === 'teal' ? COLORS.accent1 : props.colorTheme === 'dark' ? COLORS.white : COLORS.primary_500)};\n background-color: transparent;\n\n div svg path {\n fill: ${(props) => (props.colorTheme === 'teal' ? COLORS.accent1 : props.colorTheme === 'dark' ? COLORS.white : COLORS.primary_500)};\n }\n\n padding: ${(props) => (props.size === Size.Large ? '12px 16px' : props.size === Size.Small ? '4px 8px' : '6px 12px')};\n }\n\n &:hover > div.button-content,\n &.hover-state > div.button-content {\n background-color: ${(props) => (props.colorTheme === 'teal' ? COLORS.accent1_20 : props.colorTheme === 'dark' ? COLORS.primary_700 : COLORS.primary_20)};\n color: ${(props) => (props.colorTheme === 'teal' ? COLORS.accent1_700 : props.colorTheme === 'dark' ? COLORS.white : COLORS.primary_700)};\n\n div {\n svg {\n path {\n fill: ${(props) => (props.colorTheme === 'teal' ? COLORS.accent1_700 : props.colorTheme === 'dark' ? COLORS.white : COLORS.primary_700)};\n }\n }\n }\n }\n &:active > div.button-content,\n &.active-state > div.button-content {\n background-color: ${(props) => (props.colorTheme === 'teal' ? COLORS.accent1_100 : props.colorTheme === 'dark' ? COLORS.primary_600 : COLORS.primary_100)};\n color: ${(props) => (props.colorTheme === 'teal' ? COLORS.accent1_800 : props.colorTheme === 'dark' ? COLORS.white : COLORS.primary_800)};\n\n div {\n svg {\n path {\n fill: ${(props) => (props.colorTheme === 'teal' ? COLORS.accent1_800 : props.colorTheme === 'dark' ? COLORS.white : COLORS.primary_800)};\n }\n }\n }\n }\n\n &:disabled > div.button-content,\n &.disabled-state > div.button-content {\n background-color: transparent !important;\n color: ${COLORS.primary_700};\n border-color: transparent !important;\n }\n`;\n\nexport const ButtonPositiveStyled = styled(ButtonPrimaryStyled)<ButtonProps>`\n div.button-content {\n color: white;\n background-color: ${COLORS.correct_500};\n }\n &:hover > div.button-content,\n &.hover-state > div.button-content {\n background-color: ${COLORS.correct_700};\n }\n &:active > div.button-content,\n &.active-state > div.button-content {\n background-color: ${COLORS.correct_800};\n }\n\n &:disabled > div.button-content,\n &.disabled-state > div.button-content {\n background-color: ${COLORS.neutral_100};\n color: ${COLORS.neutral_300};\n }\n`;\n\nexport const ButtonCriticalStyled = styled(ButtonPrimaryStyled)<ButtonProps>`\n div.button-content {\n color: white;\n background-color: ${COLORS.critical_500};\n }\n &:hover > div.button-content,\n &.hover-state > div.button-content {\n background-color: ${COLORS.critical_700};\n }\n &:active > div.button-content,\n &.active-state > div.button-content {\n background-color: ${COLORS.critical_800};\n }\n\n &:disabled > div.button-content,\n &.disabled-state > div.button-content {\n background-color: ${COLORS.neutral_100};\n color: ${COLORS.neutral_300}; \n }\n`;\n\nexport interface ButtonProps extends React.ButtonHTMLAttributes<HTMLButtonElement> {\n variant?: 'primary' | 'secondary' | 'tertiary' | 'positive' | 'critical';\n flatEdge?: 'right' | 'left' | 'none' | undefined;\n role?: 'button' | string;\n title?: string;\n size?: Size;\n colorTheme?: 'teal' | 'dark';\n invertFocus?: boolean;\n width?: 'auto' | string;\n loading?: boolean;\n testId?: string;\n icon?: React.ReactNode;\n minWidth?: string;\n iconOnly?: boolean;\n}\n\nconst Button = React.forwardRef<HTMLButtonElement, ButtonProps>(\n ({ children = '', variant = 'primary', type = 'button', size = Size.Medium, width = 'auto', minWidth = '64px', testId, disabled, flatEdge, icon, ...props }, ref) => {\n // Let's filter out properties that we don't need to render.\n const { loading, ...renderProps } = props;\n\n const renderContent = () => (\n <>\n {icon && <span className={(children ? 'extramargin ' : '') + (loading ? 'icon loading' : 'icon')}>{icon}</span>}\n {children && <span className={loading ? 'label loading' : 'label'}>{children}</span>}\n {loading && <LoadingIndicator />}\n </>\n );\n\n let ButtonStyled = ButtonPrimaryStyled;\n switch (variant) {\n case 'secondary':\n ButtonStyled = ButtonSecondaryStyled;\n break;\n case 'tertiary':\n ButtonStyled = ButtonTertiaryStyled;\n break;\n case 'positive':\n ButtonStyled = ButtonPositiveStyled;\n break;\n case 'critical':\n ButtonStyled = ButtonCriticalStyled;\n break;\n }\n\n return (\n <ButtonStyled\n {...renderProps}\n ref={ref}\n disabled={disabled}\n iconOnly={!children}\n type={type}\n size={size}\n flatEdge={flatEdge}\n width={width}\n minWidth={minWidth}\n data-testid={testId}\n className={props.loading ? 'loading-state ' + props.className : ' ' + props.className}\n onMouseDown={defaultOnMouseDownHandler}>\n <div className=\"button-content\">{renderContent()}</div>\n </ButtonStyled>\n );\n },\n);\n\nexport default Button;\n"],"mappings":"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"}
|
package/dist/Button/Button.js
CHANGED
|
@@ -100,24 +100,24 @@ export var ButtonSecondaryStyled = styled(ButtonPrimaryStyled)(_templateObject2
|
|
|
100
100
|
}, function (props) {
|
|
101
101
|
return (props === null || props === void 0 ? void 0 : props.colorTheme) === 'dark' ? COLORS.primary_700 : COLORS.neutral_100;
|
|
102
102
|
});
|
|
103
|
-
export var ButtonTertiaryStyled = styled(ButtonPrimaryStyled)(_templateObject3 || (_templateObject3 = _taggedTemplateLiteral(["\n div.button-content {\n color: ", ";\n background-color: transparent;\n div svg path {\n fill: ", ";\n }\n padding: ", ";\n }\n &:hover > div.button-content,\n &.hover-state > div.button-content {\n background-color: ", ";\n color: ", ";\n div {\n svg {\n path {\n fill: ", ";\n }\n }\n }\n }\n &:active > div.button-content,\n &.active-state > div.button-content {\n background-color: ", ";\n color: ", ";\n div {\n svg {\n path {\n fill: ", ";\n }\n }\n }\n }\n\n &:disabled > div.button-content,\n &.disabled-state > div.button-content {\n background-color: transparent !important;\n color: ", ";\n border-color: transparent !important;\n }\n"])), function (props) {
|
|
104
|
-
return props.colorTheme === 'teal' ? COLORS.accent1 : COLORS.white;
|
|
103
|
+
export var ButtonTertiaryStyled = styled(ButtonPrimaryStyled)(_templateObject3 || (_templateObject3 = _taggedTemplateLiteral(["\n div.button-content {\n color: ", ";\n background-color: transparent;\n\n div svg path {\n fill: ", ";\n }\n\n padding: ", ";\n }\n\n &:hover > div.button-content,\n &.hover-state > div.button-content {\n background-color: ", ";\n color: ", ";\n\n div {\n svg {\n path {\n fill: ", ";\n }\n }\n }\n }\n &:active > div.button-content,\n &.active-state > div.button-content {\n background-color: ", ";\n color: ", ";\n\n div {\n svg {\n path {\n fill: ", ";\n }\n }\n }\n }\n\n &:disabled > div.button-content,\n &.disabled-state > div.button-content {\n background-color: transparent !important;\n color: ", ";\n border-color: transparent !important;\n }\n"])), function (props) {
|
|
104
|
+
return props.colorTheme === 'teal' ? COLORS.accent1 : props.colorTheme === 'dark' ? COLORS.white : COLORS.primary_500;
|
|
105
105
|
}, function (props) {
|
|
106
|
-
return props.colorTheme === 'teal' ? COLORS.accent1 : COLORS.white;
|
|
106
|
+
return props.colorTheme === 'teal' ? COLORS.accent1 : props.colorTheme === 'dark' ? COLORS.white : COLORS.primary_500;
|
|
107
107
|
}, function (props) {
|
|
108
108
|
return props.size === Size.Large ? '12px 16px' : props.size === Size.Small ? '4px 8px' : '6px 12px';
|
|
109
109
|
}, function (props) {
|
|
110
|
-
return props.colorTheme === 'teal' ? COLORS.accent1_20 : COLORS.primary_700;
|
|
110
|
+
return props.colorTheme === 'teal' ? COLORS.accent1_20 : props.colorTheme === 'dark' ? COLORS.primary_700 : COLORS.primary_20;
|
|
111
111
|
}, function (props) {
|
|
112
|
-
return props.colorTheme === 'teal' ? COLORS.accent1_700 : COLORS.white;
|
|
112
|
+
return props.colorTheme === 'teal' ? COLORS.accent1_700 : props.colorTheme === 'dark' ? COLORS.white : COLORS.primary_700;
|
|
113
113
|
}, function (props) {
|
|
114
|
-
return props.colorTheme === 'teal' ? COLORS.accent1_700 : COLORS.white;
|
|
114
|
+
return props.colorTheme === 'teal' ? COLORS.accent1_700 : props.colorTheme === 'dark' ? COLORS.white : COLORS.primary_700;
|
|
115
115
|
}, function (props) {
|
|
116
|
-
return props.colorTheme === 'teal' ? COLORS.accent1_100 : COLORS.primary_600;
|
|
116
|
+
return props.colorTheme === 'teal' ? COLORS.accent1_100 : props.colorTheme === 'dark' ? COLORS.primary_600 : COLORS.primary_100;
|
|
117
117
|
}, function (props) {
|
|
118
|
-
return props.colorTheme === 'teal' ? COLORS.accent1_800 : COLORS.white;
|
|
118
|
+
return props.colorTheme === 'teal' ? COLORS.accent1_800 : props.colorTheme === 'dark' ? COLORS.white : COLORS.primary_800;
|
|
119
119
|
}, function (props) {
|
|
120
|
-
return props.colorTheme === 'teal' ? COLORS.accent1_800 : COLORS.white;
|
|
120
|
+
return props.colorTheme === 'teal' ? COLORS.accent1_800 : props.colorTheme === 'dark' ? COLORS.white : COLORS.primary_800;
|
|
121
121
|
}, COLORS.primary_700);
|
|
122
122
|
export var ButtonPositiveStyled = styled(ButtonPrimaryStyled)(_templateObject4 || (_templateObject4 = _taggedTemplateLiteral(["\n div.button-content {\n color: white;\n background-color: ", ";\n }\n &:hover > div.button-content,\n &.hover-state > div.button-content {\n background-color: ", ";\n }\n &:active > div.button-content,\n &.active-state > div.button-content {\n background-color: ", ";\n }\n\n &:disabled > div.button-content,\n &.disabled-state > div.button-content {\n background-color: ", ";\n color: ", ";\n }\n"])), COLORS.correct_500, COLORS.correct_700, COLORS.correct_800, COLORS.neutral_100, COLORS.neutral_300);
|
|
123
123
|
export var ButtonCriticalStyled = styled(ButtonPrimaryStyled)(_templateObject5 || (_templateObject5 = _taggedTemplateLiteral(["\n div.button-content {\n color: white;\n background-color: ", ";\n }\n &:hover > div.button-content,\n &.hover-state > div.button-content {\n background-color: ", ";\n }\n &:active > div.button-content,\n &.active-state > div.button-content {\n background-color: ", ";\n }\n\n &:disabled > div.button-content,\n &.disabled-state > div.button-content {\n background-color: ", ";\n color: ", "; \n }\n"])), COLORS.critical_500, COLORS.critical_700, COLORS.critical_800, COLORS.neutral_100, COLORS.neutral_300);
|
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"file":"Button.js","names":["React","styled","LoadingIndicator","ComponentLStyling","ComponentMStyling","ComponentSStyling","ComponentTextStyle","COLORS","focusStyles","invertedFocusStyles","Size","defaultOnMouseDownHandler","getBorderRadius","flatEdge","radius","ButtonPrimaryStyled","button","props","size","Large","Bold","colorTheme","primary_800","white","Small","accent1","primary","width","minWidth","Medium","iconOnly","accent1_700","primary_100","primary_700","primary_600","accent1_800","primary_200","invertFocus","undefined","neutral_100","neutral_300","ButtonSecondaryStyled","primary_300","ButtonTertiaryStyled","accent1_20","accent1_100","ButtonPositiveStyled","correct_500","correct_700","correct_800","ButtonCriticalStyled","critical_500","critical_700","critical_800","Button","forwardRef","ref","children","variant","type","testId","disabled","icon","loading","renderProps","renderContent","ButtonStyled","className","role","title"],"sources":["../../src/Button/Button.tsx"],"sourcesContent":["import * as React from 'react';\nimport styled, { css } from 'styled-components';\nimport { LoadingIndicator } from '../LoadingIndicator';\nimport { ComponentLStyling, ComponentMStyling, ComponentSStyling, ComponentTextStyle } from '../styles';\nimport { COLORS, focusStyles, invertedFocusStyles } from '../styles';\nimport { Size, Testable } from '../types';\nimport { defaultOnMouseDownHandler } from '../common';\n\nconst getBorderRadius = (flatEdge: string | undefined, radius: number) => {\n switch (flatEdge) {\n case 'left':\n return `0px ${radius}px ${radius}px 0px`;\n\n case 'right':\n return `${radius}px 0px 0px ${radius}px`;\n\n case 'none':\n default:\n return `${radius}px`;\n }\n};\n\nexport const ButtonPrimaryStyled = styled.button<ButtonProps>`\n border: none;\n background-color: transparent;\n cursor: pointer;\n padding: 0;\n margin: 0;\n position: relative;\n box-sizing: border-box;\n min-height: ${(props) => (props.size === Size.Large ? '56px' : '48px')};\n &.loading-state {\n cursor: wait;\n }\n div.button-content {\n ${(props) =>\n props.size === Size.Large\n ? ComponentLStyling(ComponentTextStyle.Bold, props?.colorTheme === 'dark' ? COLORS.primary_800 : COLORS.white)\n : props.size === Size.Small\n ? ComponentSStyling(ComponentTextStyle.Bold, props?.colorTheme === 'dark' ? COLORS.primary_800 : COLORS.white)\n : ComponentMStyling(ComponentTextStyle.Bold, props?.colorTheme === 'dark' ? COLORS.primary_800 : COLORS.white)};\n\n background-color: ${(props) => (props.colorTheme === 'teal' ? COLORS.accent1 : props?.colorTheme === 'dark' ? COLORS.white : COLORS.primary)};\n border-radius: ${(props) => getBorderRadius(props.flatEdge, 8)};\n\n width: ${(props) => props.width};\n position: relative;\n\n min-height: ${(props) => (props.size === Size.Large ? '56px' : props.size === Size.Small ? '32px' : '40px')};\n min-width: ${(props) => props.minWidth};\n\n box-sizing: border-box;\n display: flex;\n align-items: center;\n justify-content: center;\n padding: ${(props) => (props.size === Size.Large ? '14px 16px' : props.size === Size.Small ? '6px 8px' : '8px 12px')};\n\n span.icon:not(.loading) {\n pointer-events: none;\n }\n\n span.loading {\n opacity: 0;\n }\n\n .icon {\n margin: ${(props) => (props.size === Size.Medium ? props.iconOnly ? '-2px -8px' : '' : (props.size === Size.Small ? props.iconOnly ? '-2px -6px' : '' : '' ))};\n width: ${(props) => (props.size === Size.Large ? '28px' : props.size === Size.Small ? '20px' : '24px')};\n height: ${(props) => (props.size === Size.Large ? '28px' : props.size === Size.Small ? '20px' : '24px')};\n svg {\n width: ${(props) => (props.size === Size.Large ? '28px' : props.size === Size.Small ? '20px' : '24px')} !important;\n height: ${(props) => (props.size === Size.Large ? '28px' : props.size === Size.Small ? '20px' : '24px')} !important;\n }\n }\n\n .label {\n margin: 0 4px;\n }\n\n div {\n position: absolute;\n width: 100%;\n svg {\n height: ${(props) => (props.size === Size.Large ? '28px' : props.size === Size.Small ? '20px' : '24px')};\n width: ${(props) => (props.size === Size.Large ? '28px' : props.size === Size.Small ? '20px' : '24px')};\n path {\n fill: ${(props) => (props.colorTheme === 'dark' ? COLORS.primary : COLORS.white)};\n }\n }\n }\n }\n &:hover > div.button-content,\n &.hover-state > div.button-content {\n background-color: ${(props) => (props.colorTheme === 'teal' ? COLORS.accent1_700 : props?.colorTheme === 'dark' ? COLORS.primary_100 : COLORS.primary_700)};\n color: ${(props) => (props?.colorTheme === 'dark' ? COLORS.primary_600 : COLORS.white)};\n }\n &:active > div.button-content,\n &.active-state > div.button-content {\n background-color: ${(props) => (props.colorTheme === 'teal' ? COLORS.accent1_800 : props?.colorTheme === 'dark' ? COLORS.primary_200 : COLORS.primary_800)};\n color: ${(props) => (props?.colorTheme === 'dark' ? COLORS.primary_800 : COLORS.white)};\n }\n\n &:focus,\n &.focus-state {\n ${(props) => (props.invertFocus || (props.invertFocus === undefined && props.colorTheme === 'dark') ? invertedFocusStyles : focusStyles)}\n }\n &:disabled,\n &.disabled-state {\n cursor: not-allowed;\n }\n &:disabled > div.button-content,\n &.disabled-state > div.button-content {\n pointer-events: none;\n background-color: ${(props) => (props.colorTheme === 'dark' ? COLORS.primary_700 : COLORS.neutral_100)};\n color: ${(props) => (props.colorTheme === 'dark' ? COLORS.primary_800 : COLORS.neutral_300)};\n }\n`;\n\nexport const ButtonSecondaryStyled = styled(ButtonPrimaryStyled)<ButtonProps>`\n div.button-content {\n color: ${(props) => (props.colorTheme === 'teal' ? COLORS.accent1 : props?.colorTheme === 'dark' ? COLORS.white : COLORS.primary)};\n background-color: transparent;\n div svg path {\n fill: ${(props) => (props.colorTheme === 'teal' ? COLORS.accent1 : COLORS.primary)};\n }\n box-shadow: inset 0 0 0 2px ${(props) => (props.colorTheme === 'teal' ? COLORS.accent1 : props?.colorTheme === 'dark' ? COLORS.white : COLORS.primary)};\n \n padding: ${(props) => (props.size === Size.Large ? '12px 16px' : props.size === Size.Small ? '4px 8px' : '6px 12px')};\n }\n\n &:hover > div.button-content,\n &.hover-state > div.button-content {\n color: ${(props) => (props.colorTheme === 'teal' ? COLORS.accent1_700 : props?.colorTheme === 'dark' ? COLORS.primary_200 : COLORS.primary_700)};\n box-shadow: inset 0 0 0 2px ${(props) => (props.colorTheme === 'teal' ? COLORS.accent1_700 : props?.colorTheme === 'dark' ? COLORS.primary_200 : COLORS.primary_700)};\n \n background-color: transparent;\n div {\n svg {\n path {\n fill: ${(props) => (props.colorTheme === 'teal' ? COLORS.accent1_700 : COLORS.primary_700)};\n }\n }\n }\n }\n &:active > div.button-content,\n &.active-state > div.button-content {\n color: ${(props) => (props.colorTheme === 'teal' ? COLORS.accent1_800 : props?.colorTheme === 'dark' ? COLORS.primary_300 : COLORS.primary_800)};\n box-shadow: inset 0 0 0 2px ${(props) => (props.colorTheme === 'teal' ? COLORS.accent1_800 : props?.colorTheme === 'dark' ? COLORS.primary_300 : COLORS.primary_800)};\n \n background-color: transparent;\n div {\n svg {\n path {\n fill: ${(props) => (props.colorTheme === 'teal' ? COLORS.accent1_800 : props?.colorTheme === 'dark' ? COLORS.white : COLORS.primary_800)};\n }\n }\n }\n }\n\n &:disabled > div.button-content,\n &.disabled-state > div.button-content {\n background-color: transparent;\n color: ${(props) => (props?.colorTheme === 'dark' ? COLORS.primary_700 : COLORS.neutral_300)};\n box-shadow: inset 0 0 0 2px ${(props) => (props?.colorTheme === 'dark' ? COLORS.primary_700 : COLORS.neutral_100)};\n }\n`;\n\nexport const ButtonTertiaryStyled = styled(ButtonPrimaryStyled)<ButtonProps>`\n div.button-content {\n color: ${(props) => (props.colorTheme === 'teal' ? COLORS.accent1 : COLORS.white)};\n background-color: transparent;\n div svg path {\n fill: ${(props) => (props.colorTheme === 'teal' ? COLORS.accent1 : COLORS.white)};\n }\n padding: ${(props) => (props.size === Size.Large ? '12px 16px' : props.size === Size.Small ? '4px 8px' : '6px 12px')};\n }\n &:hover > div.button-content,\n &.hover-state > div.button-content {\n background-color: ${(props) => (props.colorTheme === 'teal' ? COLORS.accent1_20 : COLORS.primary_700)};\n color: ${(props) => (props.colorTheme === 'teal' ? COLORS.accent1_700 : COLORS.white)};\n div {\n svg {\n path {\n fill: ${(props) => (props.colorTheme === 'teal' ? COLORS.accent1_700 : COLORS.white)};\n }\n }\n }\n }\n &:active > div.button-content,\n &.active-state > div.button-content {\n background-color: ${(props) => (props.colorTheme === 'teal' ? COLORS.accent1_100 : COLORS.primary_600)};\n color: ${(props) => (props.colorTheme === 'teal' ? COLORS.accent1_800 : COLORS.white)};\n div {\n svg {\n path {\n fill: ${(props) => (props.colorTheme === 'teal' ? COLORS.accent1_800 : COLORS.white)};\n }\n }\n }\n }\n\n &:disabled > div.button-content,\n &.disabled-state > div.button-content {\n background-color: transparent !important;\n color: ${COLORS.primary_700};\n border-color: transparent !important;\n }\n`;\n\nexport const ButtonPositiveStyled = styled(ButtonPrimaryStyled)<ButtonProps>`\n div.button-content {\n color: white;\n background-color: ${COLORS.correct_500};\n }\n &:hover > div.button-content,\n &.hover-state > div.button-content {\n background-color: ${COLORS.correct_700};\n }\n &:active > div.button-content,\n &.active-state > div.button-content {\n background-color: ${COLORS.correct_800};\n }\n\n &:disabled > div.button-content,\n &.disabled-state > div.button-content {\n background-color: ${COLORS.neutral_100};\n color: ${COLORS.neutral_300};\n }\n`;\n\nexport const ButtonCriticalStyled = styled(ButtonPrimaryStyled)<ButtonProps>`\n div.button-content {\n color: white;\n background-color: ${COLORS.critical_500};\n }\n &:hover > div.button-content,\n &.hover-state > div.button-content {\n background-color: ${COLORS.critical_700};\n }\n &:active > div.button-content,\n &.active-state > div.button-content {\n background-color: ${COLORS.critical_800};\n }\n\n &:disabled > div.button-content,\n &.disabled-state > div.button-content {\n background-color: ${COLORS.neutral_100};\n color: ${COLORS.neutral_300}; \n }\n`;\n\nexport interface ButtonProps extends React.ButtonHTMLAttributes<HTMLButtonElement> {\n variant?: 'primary' | 'secondary' | 'tertiary' | 'positive' | 'critical';\n flatEdge?: 'right' | 'left' | 'none' | undefined;\n role?: 'button' | string;\n title?: string;\n size?: Size;\n colorTheme?: 'teal' | 'dark';\n invertFocus?: boolean;\n width?: 'auto' | string;\n loading?: boolean;\n testId?: string;\n icon?: React.ReactNode;\n minWidth?: string;\n iconOnly?: boolean;\n}\n\nconst Button = React.forwardRef<HTMLButtonElement, ButtonProps>(\n ({ children = '', variant = 'primary', type = 'button', size = Size.Medium, width = 'auto', minWidth = '64px', testId, disabled, flatEdge, icon, ...props }, ref) => {\n // Let's filter out properties that we don't need to render.\n const { loading, ...renderProps } = props;\n\n const renderContent = () => (\n <>\n {icon && <span className={(children ? 'extramargin ' : '') + (loading ? 'icon loading' : 'icon')}>{icon}</span>}\n {children && <span className={loading ? 'label loading' : 'label'}>{children}</span>}\n {loading && <LoadingIndicator />}\n </>\n );\n\n let ButtonStyled = ButtonPrimaryStyled;\n switch (variant) {\n case 'secondary':\n ButtonStyled = ButtonSecondaryStyled;\n break;\n case 'tertiary':\n ButtonStyled = ButtonTertiaryStyled;\n break;\n case 'positive':\n ButtonStyled = ButtonPositiveStyled;\n break;\n case 'critical':\n ButtonStyled = ButtonCriticalStyled;\n break;\n }\n\n return (\n <ButtonStyled\n {...renderProps}\n ref={ref}\n disabled={disabled}\n iconOnly={!children}\n type={type}\n size={size}\n flatEdge={flatEdge}\n width={width}\n minWidth={minWidth}\n data-testid={testId}\n className={props.loading ? 'loading-state ' + props.className : ' ' + props.className}\n onMouseDown={defaultOnMouseDownHandler}>\n <div className=\"button-content\">{renderContent()}</div>\n </ButtonStyled>\n );\n },\n);\n\nexport default Button;\n"],"mappings":"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"}
|
|
1
|
+
{"version":3,"file":"Button.js","names":["React","styled","LoadingIndicator","ComponentLStyling","ComponentMStyling","ComponentSStyling","ComponentTextStyle","COLORS","focusStyles","invertedFocusStyles","Size","defaultOnMouseDownHandler","getBorderRadius","flatEdge","radius","ButtonPrimaryStyled","button","props","size","Large","Bold","colorTheme","primary_800","white","Small","accent1","primary","width","minWidth","Medium","iconOnly","accent1_700","primary_100","primary_700","primary_600","accent1_800","primary_200","invertFocus","undefined","neutral_100","neutral_300","ButtonSecondaryStyled","primary_300","ButtonTertiaryStyled","primary_500","accent1_20","primary_20","accent1_100","ButtonPositiveStyled","correct_500","correct_700","correct_800","ButtonCriticalStyled","critical_500","critical_700","critical_800","Button","forwardRef","ref","children","variant","type","testId","disabled","icon","loading","renderProps","renderContent","ButtonStyled","className","role","title"],"sources":["../../src/Button/Button.tsx"],"sourcesContent":["import * as React from 'react';\nimport styled, { css } from 'styled-components';\nimport { LoadingIndicator } from '../LoadingIndicator';\nimport { ComponentLStyling, ComponentMStyling, ComponentSStyling, ComponentTextStyle } from '../styles';\nimport { COLORS, focusStyles, invertedFocusStyles } from '../styles';\nimport { Size, Testable } from '../types';\nimport { defaultOnMouseDownHandler } from '../common';\n\nconst getBorderRadius = (flatEdge: string | undefined, radius: number) => {\n switch (flatEdge) {\n case 'left':\n return `0px ${radius}px ${radius}px 0px`;\n\n case 'right':\n return `${radius}px 0px 0px ${radius}px`;\n\n case 'none':\n default:\n return `${radius}px`;\n }\n};\n\nexport const ButtonPrimaryStyled = styled.button<ButtonProps>`\n border: none;\n background-color: transparent;\n cursor: pointer;\n padding: 0;\n margin: 0;\n position: relative;\n box-sizing: border-box;\n min-height: ${(props) => (props.size === Size.Large ? '56px' : '48px')};\n &.loading-state {\n cursor: wait;\n }\n div.button-content {\n ${(props) =>\n props.size === Size.Large\n ? ComponentLStyling(ComponentTextStyle.Bold, props?.colorTheme === 'dark' ? COLORS.primary_800 : COLORS.white)\n : props.size === Size.Small\n ? ComponentSStyling(ComponentTextStyle.Bold, props?.colorTheme === 'dark' ? COLORS.primary_800 : COLORS.white)\n : ComponentMStyling(ComponentTextStyle.Bold, props?.colorTheme === 'dark' ? COLORS.primary_800 : COLORS.white)};\n\n background-color: ${(props) => (props.colorTheme === 'teal' ? COLORS.accent1 : props?.colorTheme === 'dark' ? COLORS.white : COLORS.primary)};\n border-radius: ${(props) => getBorderRadius(props.flatEdge, 8)};\n\n width: ${(props) => props.width};\n position: relative;\n\n min-height: ${(props) => (props.size === Size.Large ? '56px' : props.size === Size.Small ? '32px' : '40px')};\n min-width: ${(props) => props.minWidth};\n\n box-sizing: border-box;\n display: flex;\n align-items: center;\n justify-content: center;\n padding: ${(props) => (props.size === Size.Large ? '14px 16px' : props.size === Size.Small ? '6px 8px' : '8px 12px')};\n\n span.icon:not(.loading) {\n pointer-events: none;\n }\n\n span.loading {\n opacity: 0;\n }\n\n .icon {\n margin: ${(props) => (props.size === Size.Medium ? props.iconOnly ? '-2px -8px' : '' : (props.size === Size.Small ? props.iconOnly ? '-2px -6px' : '' : '' ))};\n width: ${(props) => (props.size === Size.Large ? '28px' : props.size === Size.Small ? '20px' : '24px')};\n height: ${(props) => (props.size === Size.Large ? '28px' : props.size === Size.Small ? '20px' : '24px')};\n svg {\n width: ${(props) => (props.size === Size.Large ? '28px' : props.size === Size.Small ? '20px' : '24px')} !important;\n height: ${(props) => (props.size === Size.Large ? '28px' : props.size === Size.Small ? '20px' : '24px')} !important;\n }\n }\n\n .label {\n margin: 0 4px;\n }\n\n div {\n position: absolute;\n width: 100%;\n svg {\n height: ${(props) => (props.size === Size.Large ? '28px' : props.size === Size.Small ? '20px' : '24px')};\n width: ${(props) => (props.size === Size.Large ? '28px' : props.size === Size.Small ? '20px' : '24px')};\n path {\n fill: ${(props) => (props.colorTheme === 'dark' ? COLORS.primary : COLORS.white)};\n }\n }\n }\n }\n &:hover > div.button-content,\n &.hover-state > div.button-content {\n background-color: ${(props) => (props.colorTheme === 'teal' ? COLORS.accent1_700 : props?.colorTheme === 'dark' ? COLORS.primary_100 : COLORS.primary_700)};\n color: ${(props) => (props?.colorTheme === 'dark' ? COLORS.primary_600 : COLORS.white)};\n }\n &:active > div.button-content,\n &.active-state > div.button-content {\n background-color: ${(props) => (props.colorTheme === 'teal' ? COLORS.accent1_800 : props?.colorTheme === 'dark' ? COLORS.primary_200 : COLORS.primary_800)};\n color: ${(props) => (props?.colorTheme === 'dark' ? COLORS.primary_800 : COLORS.white)};\n }\n\n &:focus,\n &.focus-state {\n ${(props) => (props.invertFocus || (props.invertFocus === undefined && props.colorTheme === 'dark') ? invertedFocusStyles : focusStyles)}\n }\n &:disabled,\n &.disabled-state {\n cursor: not-allowed;\n }\n &:disabled > div.button-content,\n &.disabled-state > div.button-content {\n pointer-events: none;\n background-color: ${(props) => (props.colorTheme === 'dark' ? COLORS.primary_700 : COLORS.neutral_100)};\n color: ${(props) => (props.colorTheme === 'dark' ? COLORS.primary_800 : COLORS.neutral_300)};\n }\n`;\n\nexport const ButtonSecondaryStyled = styled(ButtonPrimaryStyled)<ButtonProps>`\n div.button-content {\n color: ${(props) => (props.colorTheme === 'teal' ? COLORS.accent1 : props?.colorTheme === 'dark' ? COLORS.white : COLORS.primary)};\n background-color: transparent;\n div svg path {\n fill: ${(props) => (props.colorTheme === 'teal' ? COLORS.accent1 : COLORS.primary)};\n }\n box-shadow: inset 0 0 0 2px ${(props) => (props.colorTheme === 'teal' ? COLORS.accent1 : props?.colorTheme === 'dark' ? COLORS.white : COLORS.primary)};\n \n padding: ${(props) => (props.size === Size.Large ? '12px 16px' : props.size === Size.Small ? '4px 8px' : '6px 12px')};\n }\n\n &:hover > div.button-content,\n &.hover-state > div.button-content {\n color: ${(props) => (props.colorTheme === 'teal' ? COLORS.accent1_700 : props?.colorTheme === 'dark' ? COLORS.primary_200 : COLORS.primary_700)};\n box-shadow: inset 0 0 0 2px ${(props) => (props.colorTheme === 'teal' ? COLORS.accent1_700 : props?.colorTheme === 'dark' ? COLORS.primary_200 : COLORS.primary_700)};\n \n background-color: transparent;\n div {\n svg {\n path {\n fill: ${(props) => (props.colorTheme === 'teal' ? COLORS.accent1_700 : COLORS.primary_700)};\n }\n }\n }\n }\n &:active > div.button-content,\n &.active-state > div.button-content {\n color: ${(props) => (props.colorTheme === 'teal' ? COLORS.accent1_800 : props?.colorTheme === 'dark' ? COLORS.primary_300 : COLORS.primary_800)};\n box-shadow: inset 0 0 0 2px ${(props) => (props.colorTheme === 'teal' ? COLORS.accent1_800 : props?.colorTheme === 'dark' ? COLORS.primary_300 : COLORS.primary_800)};\n \n background-color: transparent;\n div {\n svg {\n path {\n fill: ${(props) => (props.colorTheme === 'teal' ? COLORS.accent1_800 : props?.colorTheme === 'dark' ? COLORS.white : COLORS.primary_800)};\n }\n }\n }\n }\n\n &:disabled > div.button-content,\n &.disabled-state > div.button-content {\n background-color: transparent;\n color: ${(props) => (props?.colorTheme === 'dark' ? COLORS.primary_700 : COLORS.neutral_300)};\n box-shadow: inset 0 0 0 2px ${(props) => (props?.colorTheme === 'dark' ? COLORS.primary_700 : COLORS.neutral_100)};\n }\n`;\n\nexport const ButtonTertiaryStyled = styled(ButtonPrimaryStyled)<ButtonProps>`\n div.button-content {\n color: ${(props) => (props.colorTheme === 'teal' ? COLORS.accent1 : props.colorTheme === 'dark' ? COLORS.white : COLORS.primary_500)};\n background-color: transparent;\n\n div svg path {\n fill: ${(props) => (props.colorTheme === 'teal' ? COLORS.accent1 : props.colorTheme === 'dark' ? COLORS.white : COLORS.primary_500)};\n }\n\n padding: ${(props) => (props.size === Size.Large ? '12px 16px' : props.size === Size.Small ? '4px 8px' : '6px 12px')};\n }\n\n &:hover > div.button-content,\n &.hover-state > div.button-content {\n background-color: ${(props) => (props.colorTheme === 'teal' ? COLORS.accent1_20 : props.colorTheme === 'dark' ? COLORS.primary_700 : COLORS.primary_20)};\n color: ${(props) => (props.colorTheme === 'teal' ? COLORS.accent1_700 : props.colorTheme === 'dark' ? COLORS.white : COLORS.primary_700)};\n\n div {\n svg {\n path {\n fill: ${(props) => (props.colorTheme === 'teal' ? COLORS.accent1_700 : props.colorTheme === 'dark' ? COLORS.white : COLORS.primary_700)};\n }\n }\n }\n }\n &:active > div.button-content,\n &.active-state > div.button-content {\n background-color: ${(props) => (props.colorTheme === 'teal' ? COLORS.accent1_100 : props.colorTheme === 'dark' ? COLORS.primary_600 : COLORS.primary_100)};\n color: ${(props) => (props.colorTheme === 'teal' ? COLORS.accent1_800 : props.colorTheme === 'dark' ? COLORS.white : COLORS.primary_800)};\n\n div {\n svg {\n path {\n fill: ${(props) => (props.colorTheme === 'teal' ? COLORS.accent1_800 : props.colorTheme === 'dark' ? COLORS.white : COLORS.primary_800)};\n }\n }\n }\n }\n\n &:disabled > div.button-content,\n &.disabled-state > div.button-content {\n background-color: transparent !important;\n color: ${COLORS.primary_700};\n border-color: transparent !important;\n }\n`;\n\nexport const ButtonPositiveStyled = styled(ButtonPrimaryStyled)<ButtonProps>`\n div.button-content {\n color: white;\n background-color: ${COLORS.correct_500};\n }\n &:hover > div.button-content,\n &.hover-state > div.button-content {\n background-color: ${COLORS.correct_700};\n }\n &:active > div.button-content,\n &.active-state > div.button-content {\n background-color: ${COLORS.correct_800};\n }\n\n &:disabled > div.button-content,\n &.disabled-state > div.button-content {\n background-color: ${COLORS.neutral_100};\n color: ${COLORS.neutral_300};\n }\n`;\n\nexport const ButtonCriticalStyled = styled(ButtonPrimaryStyled)<ButtonProps>`\n div.button-content {\n color: white;\n background-color: ${COLORS.critical_500};\n }\n &:hover > div.button-content,\n &.hover-state > div.button-content {\n background-color: ${COLORS.critical_700};\n }\n &:active > div.button-content,\n &.active-state > div.button-content {\n background-color: ${COLORS.critical_800};\n }\n\n &:disabled > div.button-content,\n &.disabled-state > div.button-content {\n background-color: ${COLORS.neutral_100};\n color: ${COLORS.neutral_300}; \n }\n`;\n\nexport interface ButtonProps extends React.ButtonHTMLAttributes<HTMLButtonElement> {\n variant?: 'primary' | 'secondary' | 'tertiary' | 'positive' | 'critical';\n flatEdge?: 'right' | 'left' | 'none' | undefined;\n role?: 'button' | string;\n title?: string;\n size?: Size;\n colorTheme?: 'teal' | 'dark';\n invertFocus?: boolean;\n width?: 'auto' | string;\n loading?: boolean;\n testId?: string;\n icon?: React.ReactNode;\n minWidth?: string;\n iconOnly?: boolean;\n}\n\nconst Button = React.forwardRef<HTMLButtonElement, ButtonProps>(\n ({ children = '', variant = 'primary', type = 'button', size = Size.Medium, width = 'auto', minWidth = '64px', testId, disabled, flatEdge, icon, ...props }, ref) => {\n // Let's filter out properties that we don't need to render.\n const { loading, ...renderProps } = props;\n\n const renderContent = () => (\n <>\n {icon && <span className={(children ? 'extramargin ' : '') + (loading ? 'icon loading' : 'icon')}>{icon}</span>}\n {children && <span className={loading ? 'label loading' : 'label'}>{children}</span>}\n {loading && <LoadingIndicator />}\n </>\n );\n\n let ButtonStyled = ButtonPrimaryStyled;\n switch (variant) {\n case 'secondary':\n ButtonStyled = ButtonSecondaryStyled;\n break;\n case 'tertiary':\n ButtonStyled = ButtonTertiaryStyled;\n break;\n case 'positive':\n ButtonStyled = ButtonPositiveStyled;\n break;\n case 'critical':\n ButtonStyled = ButtonCriticalStyled;\n break;\n }\n\n return (\n <ButtonStyled\n {...renderProps}\n ref={ref}\n disabled={disabled}\n iconOnly={!children}\n type={type}\n size={size}\n flatEdge={flatEdge}\n width={width}\n minWidth={minWidth}\n data-testid={testId}\n className={props.loading ? 'loading-state ' + props.className : ' ' + props.className}\n onMouseDown={defaultOnMouseDownHandler}>\n <div className=\"button-content\">{renderContent()}</div>\n </ButtonStyled>\n );\n },\n);\n\nexport default Button;\n"],"mappings":"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"}
|