@soul-refiner/design-system 0.2.108 → 0.2.110

package/dist/components/actions/button/button.js

@@ -254,7 +254,6 @@ const Dropdown = styled(Box) `
   border: 1px solid var(--color-primary-blue-2);
   justify-content: flex-start;
   padding: 16px;
-  border-radius: 8px;
   border: 0;
 
   &:hover {
@@ -266,5 +265,7 @@ const Dropdown = styled(Box) `
   ${Styles.flex}
   ${Styles.padding}
 
+  border-radius: 8px;
+
   ${({ $sx }) => ($sx ? $sx : '')}
 `;

package/dist/components/custom/users_selection/users_selection.d.ts

@@ -1,4 +1,5 @@
 import React from 'react';
+import { IconProps } from '../../';
 type NativeProps = Pick<React.HTMLAttributes<HTMLDivElement>, 'children' | 'onBlur' | 'onBlurCapture' | 'onClick' | 'onChange' | 'onMouseDown' | 'onMouseDownCapture' | 'onMouseEnter' | 'onMouseLeave' | 'onMouseOut' | 'onMouseOver'>;
 type User = {
     id: string;
@@ -17,6 +18,7 @@ export interface UsersSelectionProps extends NativeProps, React.PropsWithChildre
     title: string;
     userIsChecked: Record<string, boolean>;
     setUserIsChecked: React.Dispatch<React.SetStateAction<Record<string, boolean>>>;
+    icon: React.ComponentType<IconProps>;
 }
-export declare const UsersSelection: ({ closeOnBlur, disabled, offset, sx, containerSx, searchSx, users, label, title, userIsChecked, setUserIsChecked, ...rest }: UsersSelectionProps) => React.JSX.Element;
+export declare const UsersSelection: ({ closeOnBlur, disabled, offset, sx, containerSx, searchSx, users, label, title, userIsChecked, setUserIsChecked, icon, ...rest }: UsersSelectionProps) => React.JSX.Element;
 export {};

package/dist/components/custom/users_selection/users_selection.js

@@ -1,11 +1,10 @@
 'use client';
-import { Group } from '../../../icons';
 import React from 'react';
 import styled from 'styled-components';
 import { Button, P, Search, Checkbox, Box } from '../../';
-export const UsersSelection = ({ closeOnBlur = true, disabled = false, offset = [0, 0], sx, containerSx, searchSx, users, label, title, userIsChecked, setUserIsChecked, ...rest }) => {
+export const UsersSelection = ({ closeOnBlur = true, disabled = false, offset = [0, 0], sx, containerSx, searchSx, users, label, title, userIsChecked, setUserIsChecked, icon, ...rest }) => {
     const wrapperRef = React.useRef(null);
-    const [open, setOpen] = React.useState(true);
+    const [open, setOpen] = React.useState(false);
     const [searchValue, setSearchValue] = React.useState('');
     React.useEffect(() => {
         if (disabled) {
@@ -25,9 +24,10 @@ export const UsersSelection = ({ closeOnBlur = true, disabled = false, offset =
             setOpen(false);
         }
     };
+    const Icon = icon;
     return (React.createElement(Wrapper, { "$sx": sx, tabIndex: 0, ref: wrapperRef, onBlurCapture: handleBlur, ...rest },
         React.createElement(Button, { type: "dropdown", isDropdownOpen: open, onClick: handleOpen },
-            React.createElement(Group, { size: 16, sx: "margin-right: 16px;" }),
+            React.createElement(Icon, { size: 16, sx: "margin-right: 16px;" }),
             label),
         open && (React.createElement(Container, { "$offset": offset, "$sx": containerSx },
             React.createElement(P, null, title),
@@ -69,6 +69,7 @@ const Container = styled.div `
   border-radius: 8px;
   overflow: auto;
   padding: 24px;
+  z-index: 2;
 
   ${({ $sx }) => ($sx ? $sx : '')}
 

package/package.json

@@ -1,6 +1,6 @@
 {
   "name": "@soul-refiner/design-system",
-  "version": "0.2.108",
+  "version": "0.2.110",
   "main": "dist/index.js",
   "license": "MIT",
   "publishConfig": {