@homecode/ui 4.20.0-beta-0 → 4.20.0-beta-1

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

@@ -1,4 +1,4 @@
-import { jsxs, jsx, Fragment } from 'react/jsx-runtime';
+import { jsx, jsxs, Fragment } from 'react/jsx-runtime';
 import { mapById, isMultiple, renderLabel } from './Select.helpers.js';
 import { useRef, useState, useMemo, useEffect, useCallback } from 'react';
 import { INTERACTION_MODE, getInteractionMode } from '../../tools/dom.js';
@@ -7,13 +7,14 @@ import omit from 'lodash.omit';
 import { AssistiveText } from '../AssistiveText/AssistiveText.js';
 import { Button } from '../Button/Button.js';
 import { Input } from '../Input/Input.js';
+import { Icon } from '../Icon/Icon.js';
 import { Label } from '../Label/Label.js';
 import { Popup } from '../Popup/Popup.js';
 import { RequiredStar } from '../RequiredStar/RequiredStar.js';
-import S from './Select.styl.js';
 import { Scroll } from '../Scroll/Scroll.js';
 import { useThrottle } from '../../hooks/useThrottle.js';
 import useEvent from '../../hooks/useEvent.js';
+import S from './Select.styl.js';
 
 function Select2(props) {
     const { className, value, onChange, onSearchChange, inputProps, popupProps, size = 'm', optionClassName, additionalOptions = [], options, variant, label, error, blur, disabled, trigger, required, hideRequiredStar, isSearchable, presets = [], selectAllButton, clearButton, showSelectedCount, disableLabel, } = props;
@@ -167,13 +168,15 @@ function Select2(props) {
             .join(', '));
     }, [isMultiple$1, value]);
     // console.log('selectedLabel::', selectedLabel);
-    const renderTriggerArrow = () => {
-        return null;
-    };
+    const triggerArrow = useMemo(() => {
+        if (inputProps?.hasClear && searchVal)
+            return null;
+        return (jsx(Icon, { type: "chevronDown", className: cn(S.triggerArrow, isOpen && S.isOpen), size: size }));
+    }, [isOpen, searchVal]);
     const renderTriggerInput = () => {
         return (jsx(Input, { ...triggerProps, ...inputProps, 
             // TODO: autoComplete
-            addonRight: renderTriggerArrow(), error: isErrorVisible, value: isFocused ? searchVal : selectedLabel, onChange: handleSearchChange, label: getFieldLabel(label) }));
+            addonRight: triggerArrow, error: isErrorVisible, value: isFocused ? searchVal : selectedLabel, onChange: handleSearchChange, label: getFieldLabel(label) }));
     };
     const renderAdditionalLabel = () => {
         return null;
@@ -185,9 +188,8 @@ function Select2(props) {
         const hasSelected = fullSelectedLabel.length > 0;
         const displayLabel = hasSelected ? fullSelectedLabel : label;
         const title = hasSelected ? fullSelectedLabel : null;
-        const triggerArrow = renderTriggerArrow();
         const isError = isErrorVisible;
-        const classes = cn(S.triggerButton, isError && S.isError, triggerArrow , className);
+        const classes = cn(S.triggerButton, isError && S.isError, triggerArrow && S.hasTriggerArrow, className);
         return (jsxs("div", { children: [jsxs(Button, { className: classes, variant: "default", ...props, style: { clipPath: labelClipPath }, title: title?.join?.(', '), children: [jsx("div", { className: cn(S.triggerButtonLabel, hasSelected && S.hasSelected), children: displayLabel }), triggerArrow] }), jsx(Label, { size: size, isOnTop: hasSelected, isError: isError, onClipPathChange: setLabelClipPath, children: getFieldLabel(label) })] }));
     };
     const renderTrigger = () => {

package/package.json

@@ -1,6 +1,6 @@
 {
   "name": "@homecode/ui",
-  "version": "4.20.0-beta-0",
+  "version": "4.20.0-beta-1",
   "description": "React UI components library",
   "scripts": {
     "test": "jest",