@mrshmllw/smores-react 15.1.24 → 15.1.26
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/SupportMessage/SupportMessage.js +3 -3
- package/dist/SupportMessage/SupportMessage.js.map +1 -1
- package/dist/Table/components/RowActions.js +2 -2
- package/dist/Table/components/RowActions.js.map +1 -1
- package/dist/Table/components/commonComponents.js +4 -4
- package/dist/Table/components/commonComponents.js.map +1 -1
- package/package.json +1 -1
|
@@ -41,14 +41,14 @@ export const SupportMessage = ({ className, description, onClick, rightSideCompo
|
|
|
41
41
|
const theme = useTheme();
|
|
42
42
|
const resolveBackgroundColor = resolveToThemeColor(styles[type].backgroundColor, theme);
|
|
43
43
|
const resolvedIconColor = resolveToThemeColor(styles[type].iconColor, theme);
|
|
44
|
-
return (_jsxs(Wrapper, { className: className, "$backgroundColor": resolveBackgroundColor, onClick: onClick, ...marginProps, children: [_jsx(IconContainer, { "$size": 20, style: { alignSelf: 'flex-start' }, children: _jsx(FontAwesomeIcon, { icon: styles[type].icon, color: resolvedIconColor }) }), _jsxs(Box, { flex: true, direction: "column", mx: "
|
|
44
|
+
return (_jsxs(Wrapper, { className: className, "$backgroundColor": resolveBackgroundColor, onClick: onClick, ...marginProps, children: [_jsx(IconContainer, { "$size": 20, style: { alignSelf: 'flex-start' }, children: _jsx(FontAwesomeIcon, { icon: styles[type].icon, color: resolvedIconColor }) }), _jsxs(Box, { flex: true, direction: "column", mx: "space.100", children: [title && _jsx(Title, { children: title }), isReactElement(description) ? (_jsx(DescriptionBox, { children: description })) : (_jsx(Description, { tag: "p", children: description }))] }), rightSideComponent, onClick && rightSideComponent === undefined && (_jsx(Box, { ml: { custom: 'auto' }, children: _jsx(IconContainer, { "$size": 16, children: _jsx(FontAwesomeIcon, { icon: faChevronRight, color: theme.color.illustration.neutral[400] }) }) }))] }));
|
|
45
45
|
};
|
|
46
46
|
const Wrapper = styled(Box)(({ $backgroundColor, onClick }) => css `
|
|
47
47
|
align-items: center;
|
|
48
48
|
background-color: ${$backgroundColor};
|
|
49
49
|
border-radius: 16px;
|
|
50
50
|
${onClick && `cursor: pointer`};
|
|
51
|
-
padding:
|
|
51
|
+
padding: ${({ theme }) => theme.space[150]};
|
|
52
52
|
display: flex;
|
|
53
53
|
width: 100%;
|
|
54
54
|
|
|
@@ -62,7 +62,7 @@ const Title = styled.p `
|
|
|
62
62
|
font-weight: ${oldTheme.font.weight.medium};
|
|
63
63
|
color: ${({ theme }) => theme.color.text.base};
|
|
64
64
|
line-height: 20.8px;
|
|
65
|
-
margin-bottom:
|
|
65
|
+
margin-bottom: ${({ theme }) => theme.space['050']};
|
|
66
66
|
`;
|
|
67
67
|
const DescriptionBox = styled(Box) `
|
|
68
68
|
font-size: 14px;
|
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"file":"SupportMessage.js","sourceRoot":"","sources":["../../src/SupportMessage/SupportMessage.tsx"],"names":[],"mappings":";AAAA,OAAO,EAAE,MAAM,EAAE,MAAM,UAAU,CAAA;AAEjC,OAAO,MAAM,EAAE,EAAE,GAAG,EAAE,QAAQ,EAAE,MAAM,mBAAmB,CAAA;AAEzD,OAAO,EAAE,GAAG,EAAE,MAAM,QAAQ,CAAA;AAE5B,OAAO,EAAE,IAAI,EAAE,MAAM,SAAS,CAAA;AAC9B,OAAO,EAAE,KAAK,IAAI,QAAQ,EAAE,MAAM,UAAU,CAAA;AAC5C,OAAO,EAAE,cAAc,EAAE,MAAM,yBAAyB,CAAA;AAExD,OAAO,EAAY,mBAAmB,EAAE,MAAM,kCAAkC,CAAA;AAEhF,OAAO,EACL,aAAa,EACb,mBAAmB,EACnB,YAAY,EACZ,qBAAqB,GACtB,MAAM,kDAAkD,CAAA;AACzD,OAAO,EAAE,aAAa,EAAE,MAAM,+BAA+B,CAAA;AAC7D,OAAO,EAAE,eAAe,EAAE,MAAM,gCAAgC,CAAA;AAChE,OAAO,EAAE,cAAc,EAAE,MAAM,gDAAgD,CAAA;AAQ/E,MAAM,MAAM,GAA2C;IACrD,IAAI,EAAE;QACJ,SAAS,EAAE,iBAAiB;QAC5B,eAAe,EAAE,gCAAgC;QACjD,IAAI,EAAE,YAAY;KACnB;IACD,aAAa,EAAE;QACb,SAAS,EAAE,iBAAiB;QAC5B,eAAe,EAAE,wBAAwB;QACzC,IAAI,EAAE,YAAY;KACnB;IACD,KAAK,EAAE;QACL,SAAS,EAAE,eAAe;QAC1B,eAAe,EAAE,2BAA2B;QAC5C,IAAI,EAAE,qBAAqB;KAC5B;IACD,OAAO,EAAE;QACP,SAAS,EAAE,6BAA6B;QACxC,eAAe,EAAE,6BAA6B;QAC9C,IAAI,EAAE,mBAAmB;KAC1B;IACD,OAAO,EAAE;QACP,SAAS,EAAE,6BAA6B;QACxC,eAAe,EAAE,6BAA6B;QAC9C,IAAI,EAAE,aAAa;KACpB;CACF,CAAA;AAqBD,MAAM,CAAC,MAAM,cAAc,GAA4B,CAAC,EACtD,SAAS,EACT,WAAW,EACX,OAAO,EACP,kBAAkB,EAClB,IAAI,EACJ,KAAK,EACL,GAAG,WAAW,EACf,EAAE,EAAE;IACH,MAAM,KAAK,GAAG,QAAQ,EAAE,CAAA;IACxB,MAAM,sBAAsB,GAAG,mBAAmB,CAChD,MAAM,CAAC,IAAI,CAAC,CAAC,eAAe,EAC5B,KAAK,CACN,CAAA;IAED,MAAM,iBAAiB,GAAG,mBAAmB,CAAC,MAAM,CAAC,IAAI,CAAC,CAAC,SAAS,EAAE,KAAK,CAAC,CAAA;IAE5E,OAAO,CACL,MAAC,OAAO,IACN,SAAS,EAAE,SAAS,sBACF,sBAAsB,EACxC,OAAO,EAAE,OAAO,KACZ,WAAW,aAEf,KAAC,aAAa,aAAQ,EAAE,EAAE,KAAK,EAAE,EAAE,SAAS,EAAE,YAAY,EAAE,YAC1D,KAAC,eAAe,IAAC,IAAI,EAAE,MAAM,CAAC,IAAI,CAAC,CAAC,IAAI,EAAE,KAAK,EAAE,iBAAiB,GAAI,GACxD,EAChB,MAAC,GAAG,IAAC,IAAI,QAAC,SAAS,EAAC,QAAQ,EAAC,EAAE,EAAC,
|
|
1
|
+
{"version":3,"file":"SupportMessage.js","sourceRoot":"","sources":["../../src/SupportMessage/SupportMessage.tsx"],"names":[],"mappings":"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","sourcesContent":["import { darken } from 'polished'\nimport { FC, MouseEventHandler, ReactElement } from 'react'\nimport styled, { css, useTheme } from 'styled-components'\n\nimport { Box } from '../Box'\n\nimport { Text } from '../Text'\nimport { theme as oldTheme } from '../theme'\nimport { isReactElement } from '../utils/isReactElement'\nimport { MarginProps } from '../utils/space'\nimport { NewColor, resolveToThemeColor } from '../ThemeProvider/utils/colourMap'\nimport { IconDefinition } from '@fortawesome/fontawesome-svg-core'\nimport {\n faCircleCheck,\n faCircleExclamation,\n faCircleInfo,\n faTriangleExclamation,\n} from '@awesome.me/kit-46ca99185c/icons/classic/regular'\nimport { IconContainer } from '../sharedStyles/shared.styles'\nimport { FontAwesomeIcon } from '@fortawesome/react-fontawesome'\nimport { faChevronRight } from '@awesome.me/kit-46ca99185c/icons/classic/solid'\n\ntype StylesItem = {\n iconColor: NewColor\n backgroundColor: NewColor\n icon: IconDefinition\n}\n\nconst styles: Record<SupportMessageType, StylesItem> = {\n info: {\n iconColor: 'color.icon.base',\n backgroundColor: 'color.illustration.neutral.300',\n icon: faCircleInfo,\n },\n fallbackStyle: {\n iconColor: 'color.icon.base',\n backgroundColor: 'color.surface.base.100',\n icon: faCircleInfo,\n },\n alert: {\n iconColor: 'extended1.100',\n backgroundColor: 'color.feedback.notice.100',\n icon: faTriangleExclamation,\n },\n warning: {\n iconColor: 'color.feedback.negative.200',\n backgroundColor: 'color.feedback.negative.100',\n icon: faCircleExclamation,\n },\n success: {\n iconColor: 'color.feedback.positive.200',\n backgroundColor: 'color.feedback.positive.100',\n icon: faCircleCheck,\n },\n}\n\ntype SupportMessageType =\n | 'info'\n | 'fallbackStyle'\n | 'alert'\n | 'warning'\n | 'success'\n\nexport type SupportMessageProps = {\n className?: string\n description: string | ReactElement<any>\n onClick?: MouseEventHandler\n /**\n * Right side content, usually an icon or a button\n */\n rightSideComponent?: ReactElement<any>\n type: SupportMessageType\n title?: string\n} & MarginProps\n\nexport const SupportMessage: FC<SupportMessageProps> = ({\n className,\n description,\n onClick,\n rightSideComponent,\n type,\n title,\n ...marginProps\n}) => {\n const theme = useTheme()\n const resolveBackgroundColor = resolveToThemeColor(\n styles[type].backgroundColor,\n theme,\n )\n\n const resolvedIconColor = resolveToThemeColor(styles[type].iconColor, theme)\n\n return (\n <Wrapper\n className={className}\n $backgroundColor={resolveBackgroundColor}\n onClick={onClick}\n {...marginProps}\n >\n <IconContainer $size={20} style={{ alignSelf: 'flex-start' }}>\n <FontAwesomeIcon icon={styles[type].icon} color={resolvedIconColor} />\n </IconContainer>\n <Box flex direction=\"column\" mx=\"space.100\">\n {title && <Title>{title}</Title>}\n {isReactElement(description) ? (\n <DescriptionBox>{description}</DescriptionBox>\n ) : (\n <Description tag=\"p\">{description}</Description>\n )}\n </Box>\n {rightSideComponent}\n {onClick && rightSideComponent === undefined && (\n <Box ml={{ custom: 'auto' }}>\n <IconContainer $size={16}>\n <FontAwesomeIcon\n icon={faChevronRight}\n color={theme.color.illustration.neutral[400]}\n />\n </IconContainer>\n </Box>\n )}\n </Wrapper>\n )\n}\n\ninterface IWrapper {\n $backgroundColor: string\n onClick?: MouseEventHandler\n}\n\nconst Wrapper = styled(Box)<IWrapper>(\n ({ $backgroundColor, onClick }) => css`\n align-items: center;\n background-color: ${$backgroundColor};\n border-radius: 16px;\n ${onClick && `cursor: pointer`};\n padding: ${({ theme }) => theme.space[150]};\n display: flex;\n width: 100%;\n\n &:hover,\n &:active {\n ${onClick && `background-color: ${darken(0.1, $backgroundColor)};`};\n }\n `,\n)\n\nconst Title = styled.p`\n font-size: 16px;\n font-weight: ${oldTheme.font.weight.medium};\n color: ${({ theme }) => theme.color.text.base};\n line-height: 20.8px;\n margin-bottom: ${({ theme }) => theme.space['050']};\n`\n\nconst DescriptionBox = styled(Box)`\n font-size: 14px;\n line-height: 20px;\n`\n\nconst Description = styled(Text)`\n font-size: 14px;\n line-height: 20px;\n`\n"]}
|
|
@@ -42,10 +42,10 @@ export const RowActions = ({ rowData, rowActions, isExpanded, toggleExpansion, e
|
|
|
42
42
|
};
|
|
43
43
|
const Wrapper = styled(Box) `
|
|
44
44
|
white-space: nowrap;
|
|
45
|
-
margin-right:
|
|
45
|
+
margin-right: ${({ theme }) => theme.space[100]};
|
|
46
46
|
|
|
47
47
|
&:last-child {
|
|
48
|
-
margin-right:
|
|
48
|
+
margin-right: ${({ theme }) => theme.space['000']};
|
|
49
49
|
}
|
|
50
50
|
|
|
51
51
|
.reactElementRowAction {
|
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"file":"RowActions.js","sourceRoot":"","sources":["../../../src/Table/components/RowActions.tsx"],"names":[],"mappings":"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
|
|
1
|
+
{"version":3,"file":"RowActions.js","sourceRoot":"","sources":["../../../src/Table/components/RowActions.tsx"],"names":[],"mappings":"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","sourcesContent":["import { cloneElement, FormEvent } from 'react'\nimport styled, { useTheme } from 'styled-components'\nimport { Box } from '../../Box'\nimport { Button } from '../../Button'\nimport { IconStrict } from '../../IconStrict'\nimport { Tooltip } from '../../Tooltip'\nimport { focusOutlineStyle } from '../../utils/focusOutline'\nimport { isReactElement } from '../../utils/isReactElement'\nimport { RowActionsProps } from '../types'\nimport { StyledCell } from './commonComponents'\nimport { resolveToThemeColor } from '../../ThemeProvider/utils/colourMap'\n\nexport const RowActions = <T extends object>({\n rowData,\n rowActions,\n isExpanded,\n toggleExpansion,\n expandable,\n width,\n canExpandRow,\n}: RowActionsProps<T>) => {\n const handleAction = async (\n e: MouseEvent | FormEvent<HTMLButtonElement>,\n action: (rowData: T) => void | Promise<void>,\n ) => {\n e.stopPropagation()\n await action(rowData)\n }\n\n const theme = useTheme()\n\n const resolvedRowActionBgColor = rowActions?.bgColor\n ? resolveToThemeColor(rowActions.bgColor, theme)\n : undefined\n\n return (\n <StyledCell\n $stickyCell={Boolean(rowActions) || Boolean(expandable)}\n $rowActionsBgColor={resolvedRowActionBgColor}\n $width={width}\n >\n <Box flex alignItems=\"center\" justifyContent=\"flex-end\">\n {rowActions?.actions?.map((action, actionIndex) => {\n if (!action.showCondition || action.showCondition(rowData)) {\n return (\n <Wrapper flex key={actionIndex}>\n {'element' in action &&\n isReactElement(action.element) &&\n cloneElement(action.element, {\n onClick: async (e: MouseEvent) => {\n await handleAction(e, action.onClick)\n },\n tabIndex: 0,\n className: 'reactElementRowAction',\n })}\n {!('element' in action) && action.genericButton && (\n <Button\n {...action.genericButton}\n handleClick={(e) => void handleAction(e, action.onClick)}\n >\n {action.genericButton.children}\n </Button>\n )}\n {!('element' in action) &&\n action.iconButton &&\n (action.iconButton?.tooltipText ? (\n <Tooltip\n content={action.iconButton.tooltipText}\n position={'bottom'}\n variant=\"bubblegum\"\n >\n <IconStrict\n {...action.iconButton}\n handleClick={(e) =>\n void handleAction(e, action.onClick)\n }\n />\n </Tooltip>\n ) : (\n <IconStrict\n {...action.iconButton}\n handleClick={(e) => void handleAction(e, action.onClick)}\n />\n ))}\n </Wrapper>\n )\n }\n return null\n })}\n {canExpandRow && (\n <CaretIcon\n render=\"caret\"\n handleClick={(e) => {\n e.stopPropagation()\n toggleExpansion()\n }}\n size={24}\n $isOpen={isExpanded}\n iconColor={\n isExpanded ? 'color.surface.base.000' : 'color.icon.base'\n }\n backgroundColor={\n isExpanded\n ? 'color.surface.base.900'\n : 'color.illustration.neutral.300'\n }\n />\n )}\n </Box>\n </StyledCell>\n )\n}\n\nconst Wrapper = styled(Box)`\n white-space: nowrap;\n margin-right: ${({ theme }) => theme.space[100]};\n\n &:last-child {\n margin-right: ${({ theme }) => theme.space['000']};\n }\n\n .reactElementRowAction {\n cursor: pointer;\n ${focusOutlineStyle}\n }\n`\n\nconst CaretIcon = styled(IconStrict)<{ $isOpen?: boolean }>(\n ({ $isOpen }) => `\n transform: ${$isOpen ? 'rotate(180deg)' : 'rotate(0deg)'};\n transition: transform 0.3s ease;\n `,\n)\n"]}
|
|
@@ -26,10 +26,10 @@ export const StyledHeaderCell = styled.th `
|
|
|
26
26
|
text-align: left;
|
|
27
27
|
vertical-align: bottom;
|
|
28
28
|
${fontStyleMapping.label};
|
|
29
|
-
padding-left:
|
|
30
|
-
padding-right:
|
|
31
|
-
padding-top:
|
|
32
|
-
padding-bottom:
|
|
29
|
+
padding-left: ${({ theme }) => theme.space[100]};
|
|
30
|
+
padding-right: ${({ theme }) => theme.space[100]};
|
|
31
|
+
padding-top: ${({ theme }) => theme.space[100]};
|
|
32
|
+
padding-bottom: ${({ theme }) => theme.space[100]};
|
|
33
33
|
|
|
34
34
|
${({ $headerColor }) => $headerColor &&
|
|
35
35
|
css `
|
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"file":"commonComponents.js","sourceRoot":"","sources":["../../../src/Table/components/commonComponents.tsx"],"names":[],"mappings":"AAAA,OAAO,EAAE,MAAM,EAAE,MAAM,UAAU,CAAA;AACjC,OAAO,MAAM,EAAE,EAAE,GAAG,EAAE,MAAM,mBAAmB,CAAA;AAE/C,OAAO,EAAE,gBAAgB,EAAE,MAAM,wBAAwB,CAAA;AACzD,OAAO,EAAE,iBAAiB,EAAE,MAAM,0BAA0B,CAAA;AAO5D,MAAM,QAAQ,GAAG,CAAC,KAAc,EAAmB,EAAE,CAAC,OAAO,KAAK,KAAK,QAAQ,CAAA;AAE/E,MAAM,CAAC,MAAM,WAAW,GAAG,MAAM,CAAC,KAAK,CAAkB;;;;;gBAKzC,CAAC,EAAE,KAAK,EAAE,EAAE,EAAE,CAAC,KAAK,CAAC,KAAK,CAAC,OAAO,CAAC,IAAI,CAAC,GAAG,CAAC;;;IAGxD,CAAC,EAAE,aAAa,EAAE,EAAE,EAAE,CACtB,aAAa;IACb,GAAG,CAAA;uBACgB,QAAQ,CAAC,aAAa,CAAC,CAAC,CAAC,CAAC,aAAa,CAAC,CAAC,CAAC,MAAM;;KAElE;CACJ,CAAA;AAED,MAAM,CAAC,MAAM,gBAAgB,GAAG,MAAM,CAAC,EAAE,CAAkC;gBAC3D,CAAC,EAAE,KAAK,EAAE,EAAE,EAAE,CAAC,KAAK,CAAC,KAAK,CAAC,OAAO,CAAC,IAAI,CAAC,GAAG,CAAC;mBACzC,CAAC,EAAE,WAAW,EAAE,KAAK,EAAE,EAAE,EAAE,CAC1C,WAAW,CAAC,CAAC,CAAC,aAAa,KAAK,CAAC,KAAK,CAAC,OAAO,CAAC,IAAI,CAAC,GAAG,CAAC,EAAE,CAAC,CAAC,CAAC,MAAM;cACzD,CAAC,EAAE,YAAY,EAAE,EAAE,EAAE,CAAC,CAAC,YAAY,CAAC,CAAC,CAAC,QAAQ,CAAC,CAAC,CAAC,MAAM,CAAC;;;;;IAKlE,gBAAgB,CAAC,KAAK
|
|
1
|
+
{"version":3,"file":"commonComponents.js","sourceRoot":"","sources":["../../../src/Table/components/commonComponents.tsx"],"names":[],"mappings":"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","sourcesContent":["import { darken } from 'polished'\nimport styled, { css } from 'styled-components'\nimport { TransientProps } from 'utils/utilTypes'\nimport { fontStyleMapping } from '../../Text/fontMapping'\nimport { focusOutlineStyle } from '../../utils/focusOutline'\nimport { TableStylesProps, type TableProps } from '../types'\n\ntype StyledTableProps = {\n $roundedTable: TableProps<unknown>['roundedTable']\n}\n\nconst isString = (value: unknown): value is string => typeof value === 'string'\n\nexport const StyledTable = styled.table<StyledTableProps>`\n width: 100%;\n height: 100%;\n border-collapse: collapse;\n overflow: auto;\n background: ${({ theme }) => theme.color.surface.base[100]};\n border-spacing: 30px;\n\n ${({ $roundedTable }) =>\n $roundedTable &&\n css`\n border-radius: ${isString($roundedTable) ? $roundedTable : '16px'};\n overflow: hidden;\n `}\n`\n\nexport const StyledHeaderCell = styled.th<TransientProps<TableStylesProps>>`\n background: ${({ theme }) => theme.color.surface.base[100]};\n border-bottom: ${({ $hasKeyline, theme }) =>\n $hasKeyline ? `1px solid ${theme.color.surface.base[900]}` : 'none'};\n position: ${({ $fixedHeader }) => ($fixedHeader ? 'sticky' : 'auto')};\n top: 0;\n z-index: 2;\n text-align: left;\n vertical-align: bottom;\n ${fontStyleMapping.label};\n padding-left: ${({ theme }) => theme.space[100]};\n padding-right: ${({ theme }) => theme.space[100]};\n padding-top: ${({ theme }) => theme.space[100]};\n padding-bottom: ${({ theme }) => theme.space[100]};\n\n ${({ $headerColor }) =>\n $headerColor &&\n css`\n background: ${$headerColor};\n `}\n\n ${({ $headerHeight }) =>\n $headerHeight &&\n css`\n height: ${$headerHeight};\n `}\n\n ${({ $maxWidth }) =>\n $maxWidth &&\n css`\n max-width: ${$maxWidth};\n `}\n\n ${({ $minWidth }) =>\n $minWidth &&\n css`\n min-width: ${$minWidth};\n `}\n \n ${({ $columnPadding }) =>\n $columnPadding &&\n css`\n padding-left: ${$columnPadding};\n padding-right: ${$columnPadding};\n `};\n`\n\nexport const StyledCell = styled.td<TransientProps<TableStylesProps>>`\n vertical-align: middle;\n padding-left: ${({ $columnPadding }) => $columnPadding ?? '8px'};\n padding-right: ${({ $columnPadding }) => $columnPadding ?? '8px'};\n padding-top: ${({ $rowPadding }) => $rowPadding ?? '8px'};\n padding-bottom: ${({ $rowPadding }) => $rowPadding ?? '8px'};\n\n ${({ $hideOverflow }) =>\n $hideOverflow &&\n css`\n overflow: hidden;\n `};\n\n ${({ $noWrapContent }) =>\n $noWrapContent &&\n css`\n white-space: nowrap;\n `};\n\n ${({ $truncateContent }) =>\n $truncateContent &&\n css`\n overflow: hidden;\n white-space: nowrap;\n text-overflow: ellipsis;\n `};\n\n ${({ $stickyCell }) =>\n $stickyCell &&\n css`\n position: sticky;\n right: 0;\n `};\n\n ${({ $maxWidth }) =>\n $maxWidth &&\n css`\n max-width: ${$maxWidth};\n `}\n\n ${({ $rowActionsBgColor }) =>\n $rowActionsBgColor &&\n css`\n background: ${$rowActionsBgColor};\n `}\n`\n\nexport const StyledRow = styled.tr<TransientProps<TableStylesProps>>`\n background: ${({ theme }) => theme.color.surface.base[300]};\n\n ${({ $rowBorderColor, $noRowBorderColor }) =>\n $rowBorderColor &&\n !$noRowBorderColor &&\n css`\n border-bottom: 1px solid ${$rowBorderColor};\n `}\n\n ${({ $rowColor }) =>\n $rowColor &&\n css`\n background: ${$rowColor};\n `}\n\n ${({ $stripedColor }) =>\n $stripedColor &&\n css`\n &:nth-child(even) {\n background: ${$stripedColor};\n }\n `}\n\n ${({ $clickableRow, $rowColor, theme }) =>\n $clickableRow &&\n css`\n cursor: pointer;\n &:hover {\n background: ${darken(0.1, $rowColor ?? theme.color.surface.base[300])};\n }\n &:focus-visible {\n ${focusOutlineStyle}\n background: ${darken(0.1, $rowColor ?? theme.color.surface.base[300])};\n }\n `}\n`\n\ntype StyledSubTableCellProps = {\n $bgColor?: string\n $padding?: string | undefined\n $rowBorderColor?: string\n}\n\ntype StyledSubInnerCellProps = {\n $padding?: string | undefined\n}\n\nexport const StyledSubTableCell = styled.td<StyledSubTableCellProps>`\n padding: ${({ $padding }) => $padding ?? '12px 0'};\n\n ${({ $rowBorderColor }) =>\n $rowBorderColor &&\n css`\n border-bottom: 1px solid ${$rowBorderColor};\n `}\n\n ${({ $bgColor }) => $bgColor && `background-color: ${$bgColor};`}\n`\n\nexport const StyledSubInnerCell = styled.div<StyledSubInnerCellProps>`\n padding: ${({ $padding }) => $padding ?? '12px 0'};\n`\n"]}
|