@homecode/ui 4.30.13 → 4.30.14

package/dist/esm/src/components/Select/Select2.js

@@ -18,7 +18,7 @@ import useEvent from '../../hooks/useEvent.js';
 import S from './Select.styl.js';
 
 function Select2(props) {
-    const { className, value, onChange, onChipClick, onSearchChange, disableTriggerArrow, inputProps, popupProps, scrollProps, size = 'm', round, optionClassName, additionalOptions = [], options, variant, label, additionalLabel, error, blur, disabled, trigger, required, hideRequiredStar, isSearchable, presets = [], selectAllButton, clearButton, showSelectedCount, disableLabel, selectedChipRemoveTooltip, selectedChipIds, onOpen, onClose, } = props;
+    const { className, value, onChange, onChipClick, onSearchChange, disableTriggerArrow, inputProps, popupProps, scrollProps, size = 'm', round, optionClassName, selectedChipClassName, additionalOptions = [], options, variant, label, additionalLabel, error, blur, disabled, trigger, required, hideRequiredStar, isSearchable, presets = [], selectAllButton, clearButton, showSelectedCount, disableLabel, selectedChipRemoveTooltip, selectedChipIds, onOpen, onClose, } = props;
     const isMultiple$1 = isMultiple(value);
     const closeOnSelect = props.closeOnSelect ?? !isMultiple$1;
     const contentRef = useRef(null);
@@ -183,7 +183,7 @@ function Select2(props) {
             const label = getLabel(id);
             if (!label)
                 return null;
-            return (jsx(Chip, { className: S.chip, size: size, selected: selectedChipIds?.includes(id), onRemove: () => onItemToggle(id), onClick: () => onChipClick?.(id), removeTooltip: selectedChipRemoveTooltip, children: label }, id));
+            return (jsx(Chip, { className: cn(S.chip, selectedChipIds?.includes(id) && selectedChipClassName, ids.items[id]?.chipClassName), size: size, selected: selectedChipIds?.includes(id), onRemove: () => onItemToggle(id), onClick: () => onChipClick?.(id), removeTooltip: selectedChipRemoveTooltip, children: label }, id));
         });
     };
     const triggerArrow = useMemo(() => {

package/dist/esm/types/src/components/Select/Select.types.d.ts

@@ -12,6 +12,8 @@ export type Option = {
     sortingKey?: string | number;
     children?: Option[];
     render?: (label: string) => string;
+    /** Applied to the selected chip in multi-select mode */
+    chipClassName?: string;
 };
 type Preset = {
     label: string;
@@ -34,6 +36,7 @@ export type Props = FormControl<Value> & InheritedInputProps & {
     closeOnSelect?: boolean;
     optionsClassName?: string;
     optionClassName?: string;
+    selectedChipClassName?: string;
     additionalLabel?: ReactNode;
     size?: Size;
     variant?: 'default' | 'outlined';

package/package.json

@@ -1,6 +1,6 @@
 {
   "name": "@homecode/ui",
-  "version": "4.30.13",
+  "version": "4.30.14",
   "description": "React UI components library",
   "scripts": {
     "tests": "jest",