reduxjs/redux-devtools
1
1
Fork 0
mirror of https://github.com/reduxjs/redux-devtools.git synced 2025-07-27 00:19:55 +03:00
Code Issues Packages Projects Releases Wiki Activity

actionListHeader

Browse Source
This commit is contained in:
Nathan Bierema 2023-12-10 23:42:25 -05:00
parent 50c075e831
commit ff256788e5
2 changed files with 12 additions and 11 deletions
Show Stats Download Patch File Download Diff File Expand all files Collapse all files

3
packages/redux-devtools-inspector-monitor/src/ActionListHeader.tsx
View File

@ -1,6 +1,7 @@
import React, { FunctionComponent } from 'react'; import React, { FunctionComponent } from 'react';
import { StylingFunction } from 'react-base16-styling'; import { StylingFunction } from 'react-base16-styling';
import RightSlider from './RightSlider'; import RightSlider from './RightSlider';
import { actionListHeaderCss } from './utils/createStylingFromTheme';
const getActiveButtons = (hasSkippedActions: boolean): ('Sweep' | 'Commit')[] => const getActiveButtons = (hasSkippedActions: boolean): ('Sweep' | 'Commit')[] =>
[hasSkippedActions && 'Sweep', 'Commit'].filter( [hasSkippedActions && 'Sweep', 'Commit'].filter(
@ -28,7 +29,7 @@ const ActionListHeader: FunctionComponent<Props> = ({
hideMainButtons, hideMainButtons,
searchValue, searchValue,
}) => ( }) => (
<div {...styling('actionListHeader')}> <div css={actionListHeaderCss}>
<input <input
{...styling('actionListHeaderSearch')} {...styling('actionListHeaderSearch')}
onChange={(e) => onSearch(e.target.value)} onChange={(e) => onSearch(e.target.value)}

14
packages/redux-devtools-inspector-monitor/src/utils/createStylingFromTheme.ts
View File

@ -89,17 +89,17 @@ export const actionListWideCss = css({
borderRightStyle: 'double', borderRightStyle: 'double',
}); });
const getSheetFromColorMap = (map: ColorMap) => ({ export const actionListHeaderCss: Interpolation<Theme> = (theme) => ({
actionListHeader: {
display: 'flex', display: 'flex',
flex: '0 0 auto', flex: '0 0 auto',
'align-items': 'center', alignItems: 'center',
'border-bottom-width': '1px', borderBottomWidth: '1px',
'border-bottom-style': 'solid', borderBottomStyle: 'solid',
'border-color': map.LIST_BORDER_COLOR, borderColor: colorMap(theme).LIST_BORDER_COLOR,
}, });
const getSheetFromColorMap = (map: ColorMap) => ({
actionListRows: { actionListRows: {
overflow: 'auto', overflow: 'auto',
}, },