@true-engineering/true-react-common-ui-kit 3.45.2 → 3.45.4

package/src/components/FiltersPane/components/FilterMultiSelect/FilterMultiSelect.tsx

@@ -1,10 +1,10 @@
-import { IMultiSelectListProps, MultiSelectList } from '../../../MultiSelectList';
-import { IFilterMultiSelectValues } from '../../types';
-
-export type IFilterMultiSelectProps<Value, Option = string> = IMultiSelectListProps<Value, Option>;
-
-export function FilterMultiSelect<Value extends IFilterMultiSelectValues<Option>, Option = string>(
-  props: IFilterMultiSelectProps<Value, Option>,
-): JSX.Element {
-  return <MultiSelectList {...props} />;
-}
+import { IMultiSelectListProps, MultiSelectList } from '../../../MultiSelectList';
+import { IFilterMultiSelectValues } from '../../types';
+
+export type IFilterMultiSelectProps<Value, Option = string> = IMultiSelectListProps<Value, Option>;
+
+export function FilterMultiSelect<Value extends IFilterMultiSelectValues<Option>, Option = string>(
+  props: IFilterMultiSelectProps<Value, Option>,
+): JSX.Element {
+  return <MultiSelectList {...props} />;
+}

package/src/components/FiltersPane/components/FilterMultiSelect/index.ts

@@ -1 +1 @@
-export * from './FilterMultiSelect';
+export * from './FilterMultiSelect';

package/src/components/FiltersPane/components/FilterSelect/FilterSelect.styles.ts

@@ -1,141 +1,141 @@
-import cloneDeep from 'lodash-es/cloneDeep';
-import { animations, colors, createThemedStyles, helpers, ITweakStyles } from '../../../../theme';
-import { IButtonStyles } from '../../../Button';
-import { ISearchInputStyles } from '../../../SearchInput';
-import { innerTextButtonStyles } from '../../FiltersPane.styles';
-
-const ITEM_HEIGHT = 40;
-const LIST_GAP = 12;
-
-export const useStyles = createThemedStyles('FilterSelect', {
-  root: {
-    width: 220,
-    background: colors.CLASSIC_WHITE,
-  },
-
-  list: {
-    paddingTop: LIST_GAP,
-    padding: [LIST_GAP, 0],
-    maxHeight: ITEM_HEIGHT * 5 + LIST_GAP * 2,
-    overscrollBehavior: 'contain',
-    ...helpers.withScrollBar,
-  },
-
-  label: {
-    boxSizing: 'border-box',
-    fontSize: 14,
-    padding: [12, 16],
-    userSelect: 'none',
-    display: 'flex',
-    alignItems: 'center',
-    color: colors.FONT_LABEL,
-  },
-
-  labelChosen: {
-    fontWeight: 'bold',
-    color: colors.FONT_MAIN,
-    padding: [4, 16, 12],
-  },
-
-  withoutTopGap: {
-    paddingTop: 0,
-  },
-
-  withClearButton: {
-    paddingBottom: 0,
-    maxHeight: ITEM_HEIGHT * 5 + LIST_GAP,
-  },
-
-  item: {
-    display: 'flex',
-    alignItems: 'center',
-    justifyContent: 'space-between',
-    padding: [10, 16],
-    maxWidth: '100%',
-    cursor: 'pointer',
-    fontSize: 14,
-    minHeight: ITEM_HEIGHT,
-    transition: animations.defaultTransition,
-    transitionProperty: 'background-color',
-    boxSizing: 'border-box',
-  },
-
-  option: {
-    display: 'inline-block',
-    userSelect: 'none',
-    width: '100%',
-    overflow: 'hidden',
-    whiteSpace: 'nowrap',
-    textOverflow: 'ellipsis',
-  },
-
-  icon: {
-    width: 20,
-    height: 20,
-    marginRight: 4,
-    alignSelf: 'center',
-    flexShrink: 0,
-  },
-
-  panel: {
-    display: 'flex',
-    padding: [0, 6, 8],
-    gap: 8,
-  },
-
-  panelWithFooter: {
-    borderTop: [1, 'solid', colors.BORDER_MAIN],
-    padding: [8, 16],
-  },
-
-  footer: {
-    wordBreak: 'break-word',
-    alignSelf: 'center',
-  },
-
-  clear: {
-    marginLeft: 'auto',
-    alignSelf: 'center',
-  },
-
-  preloader: {
-    width: 80,
-    height: ITEM_HEIGHT,
-    margin: 'auto',
-    display: 'flex',
-    alignItems: 'center',
-    justifyContent: 'center',
-  },
-
-  dropdownInput: {
-    borderBottom: [1, 'solid', colors.BORDER_MAIN],
-  },
-
-  nothingFound: {
-    display: 'flex',
-    alignItems: 'center',
-    textAlign: 'center',
-    padding: 16,
-    fontSize: 14,
-  },
-});
-
-export const searchInputStyles: ISearchInputStyles = {
-  tweakInput: {
-    inputWrapper: {
-      backgroundColor: 'transparent',
-      border: 'none',
-      height: 40,
-    },
-  },
-};
-
-export const clearButtonStyles = cloneDeep(innerTextButtonStyles);
-
-export type IFilterSelectStyles = ITweakStyles<
-  typeof useStyles,
-  {
-    tweakSearchInput: ISearchInputStyles;
-    tweakClearButton: IButtonStyles;
-  }
->;
+import cloneDeep from 'lodash-es/cloneDeep';
+import { animations, colors, createThemedStyles, helpers, ITweakStyles } from '../../../../theme';
+import { IButtonStyles } from '../../../Button';
+import { ISearchInputStyles } from '../../../SearchInput';
+import { innerTextButtonStyles } from '../../FiltersPane.styles';
+
+const ITEM_HEIGHT = 40;
+const LIST_GAP = 12;
+
+export const useStyles = createThemedStyles('FilterSelect', {
+  root: {
+    width: 220,
+    background: colors.CLASSIC_WHITE,
+  },
+
+  list: {
+    paddingTop: LIST_GAP,
+    padding: [LIST_GAP, 0],
+    maxHeight: ITEM_HEIGHT * 5 + LIST_GAP * 2,
+    overscrollBehavior: 'contain',
+    ...helpers.withScrollBar,
+  },
+
+  label: {
+    boxSizing: 'border-box',
+    fontSize: 14,
+    padding: [12, 16],
+    userSelect: 'none',
+    display: 'flex',
+    alignItems: 'center',
+    color: colors.FONT_LABEL,
+  },
+
+  labelChosen: {
+    fontWeight: 'bold',
+    color: colors.FONT_MAIN,
+    padding: [4, 16, 12],
+  },
+
+  withoutTopGap: {
+    paddingTop: 0,
+  },
+
+  withClearButton: {
+    paddingBottom: 0,
+    maxHeight: ITEM_HEIGHT * 5 + LIST_GAP,
+  },
+
+  item: {
+    display: 'flex',
+    alignItems: 'center',
+    justifyContent: 'space-between',
+    padding: [10, 16],
+    maxWidth: '100%',
+    cursor: 'pointer',
+    fontSize: 14,
+    minHeight: ITEM_HEIGHT,
+    transition: animations.defaultTransition,
+    transitionProperty: 'background-color',
+    boxSizing: 'border-box',
+  },
+
+  option: {
+    display: 'inline-block',
+    userSelect: 'none',
+    width: '100%',
+    overflow: 'hidden',
+    whiteSpace: 'nowrap',
+    textOverflow: 'ellipsis',
+  },
+
+  icon: {
+    width: 20,
+    height: 20,
+    marginRight: 4,
+    alignSelf: 'center',
+    flexShrink: 0,
+  },
+
+  panel: {
+    display: 'flex',
+    padding: [0, 6, 8],
+    gap: 8,
+  },
+
+  panelWithFooter: {
+    borderTop: [1, 'solid', colors.BORDER_MAIN],
+    padding: [8, 16],
+  },
+
+  footer: {
+    wordBreak: 'break-word',
+    alignSelf: 'center',
+  },
+
+  clear: {
+    marginLeft: 'auto',
+    alignSelf: 'center',
+  },
+
+  preloader: {
+    width: 80,
+    height: ITEM_HEIGHT,
+    margin: 'auto',
+    display: 'flex',
+    alignItems: 'center',
+    justifyContent: 'center',
+  },
+
+  dropdownInput: {
+    borderBottom: [1, 'solid', colors.BORDER_MAIN],
+  },
+
+  nothingFound: {
+    display: 'flex',
+    alignItems: 'center',
+    textAlign: 'center',
+    padding: 16,
+    fontSize: 14,
+  },
+});
+
+export const searchInputStyles: ISearchInputStyles = {
+  tweakInput: {
+    inputWrapper: {
+      backgroundColor: 'transparent',
+      border: 'none',
+      height: 40,
+    },
+  },
+};
+
+export const clearButtonStyles = cloneDeep(innerTextButtonStyles);
+
+export type IFilterSelectStyles = ITweakStyles<
+  typeof useStyles,
+  {
+    tweakSearchInput: ISearchInputStyles;
+    tweakClearButton: IButtonStyles;
+  }
+>;