fis-component 0.0.74 → 0.0.76

package/dist/cjs/types/src/components/Select/Select.stories.d.ts

@@ -15,3 +15,4 @@ export declare const Disabled: import("@storybook/core/csf").AnnotatedStoryFn<im
 export declare const NumberType: import("@storybook/core/csf").AnnotatedStoryFn<import("@storybook/react").ReactRenderer, NumberSelectStoryProps>;
 export declare const CustomMaxHeight: import("@storybook/core/csf").AnnotatedStoryFn<import("@storybook/react").ReactRenderer, SingleSelectStoryProps>;
 export declare const TextEllipsis: import("@storybook/core/csf").AnnotatedStoryFn<import("@storybook/react").ReactRenderer, SingleSelectStoryProps>;
+export declare const PlaceholderDemo: import("@storybook/core/csf").AnnotatedStoryFn<import("@storybook/react").ReactRenderer, SingleSelectStoryProps>;

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

@@ -9,10 +9,11 @@ export interface SelectOption<T = string | number> {
         value: T;
     }[];
 }
-type BaseSelectProps<T extends string | number> = Partial<InputLabelProps> & Omit<MenuProps, "groups" | "multi" | "selectedValues" | "onChangeSelected" | "onClickMenu" | "size"> & Omit<SelectFieldProps, "value" | "onChange"> & {
+type BaseSelectProps<T extends string | number> = Partial<InputLabelProps> & Omit<MenuProps, "groups" | "multi" | "selectedValues" | "onChangeSelected" | "onClickMenu" | "size" | "placeholder"> & Omit<SelectFieldProps, "value" | "onChange"> & {
     options: SelectOption<T>[];
     message?: string;
     disabled?: boolean;
+    placeholder?: string;
     placeholderSearch?: string;
     positive?: boolean;
     multiDisplayText?: (count: number) => string;

package/dist/esm/index.js

@@ -70536,9 +70536,12 @@ ${({ $disabled }) => {
 `;
 const SpanLabel$1 = styled.span `
   margin: 0;
-  display: flex;
-  align-items: center;
-  justify-content: center;
+  overflow: hidden;
+  text-overflow: ellipsis;
+  white-space: nowrap;
+  // display: flex;
+  // align-items: center;
+  // justify-content: center;
 
   &.no-padding {
     padding-right: 0;
@@ -73417,7 +73420,7 @@ function isMenuSize(value) {
     return value === "sm" || value === "md";
 }
 
-const FISSelect = forwardRef(({ className, style, size = "md", options, value, disabled = false, textLabel = "", iconLabel, required, negative, message, positive, multi, placeholderSearch, loading, onChange, renderOption, onClickIconLabel, displayValue, multiDisplayText, searchValue, onSearchChange, portal, maxHeight, ...restProps }, ref) => {
+const FISSelect = forwardRef(({ className, style, size = "md", options, value, disabled = false, textLabel = "", iconLabel, required, negative, message, positive, multi, placeholder, placeholderSearch, loading, onChange, renderOption, onClickIconLabel, displayValue, multiDisplayText, searchValue, onSearchChange, portal, maxHeight, ...restProps }, ref) => {
     const [isOpen, setIsOpen] = useState(false);
     const [referenceElement, setReferenceElement] = useState(null);
     const [popperElement, setPopperElement] = useState(null);
@@ -73556,7 +73559,7 @@ const FISSelect = forwardRef(({ className, style, size = "md", options, value, d
         document.addEventListener("mousedown", handleClickOutside);
         return () => document.removeEventListener("mousedown", handleClickOutside);
     }, [referenceElement, popperElement]);
-    return (jsxs(DivWrapperSC$1, { className: className, style: style, children: [(textLabel || iconLabel) && (jsx(FISInputLabel, { textLabel: textLabel, required: required, iconLabel: iconLabel, onClickIconLabel: onClickIconLabel })), jsx(DivInputWrapperSC, { ref: setReferenceElement, onClick: handleToggle, "$hasValue": !!value, children: jsx(FISSelectItem, { ...restProps, ref: ref, size: size, iconSuffix: isOpen ? jsx(ArrowUpIcon, {}) : jsx(ArrowDownIcon, {}), value: computedDisplayValue(), disabled: disabled, activeDropdown: isOpen, negative: negative }) }), message && (jsx(SpanHintSC$3, { className: classNames({ disabled, negative, positive }), children: message })), multi && value.length > 0 && (jsx(SelectedTagsWrapper, { children: jsx(MultipleValue, { options: selectedItems, onRemove: handleOptionRemove }) })), isOpen && (jsx(Portal, { portal: portal, children: jsx(DivDropdownMenuSC, { ref: setPopperElement, style: {
+    return (jsxs(DivWrapperSC$1, { className: className, style: style, children: [(textLabel || iconLabel) && (jsx(FISInputLabel, { textLabel: textLabel, required: required, iconLabel: iconLabel, onClickIconLabel: onClickIconLabel })), jsx(DivInputWrapperSC, { ref: setReferenceElement, onClick: handleToggle, "$hasValue": !!value, children: jsx(FISSelectItem, { ...restProps, ref: ref, size: size, placeholder: placeholder, iconSuffix: isOpen ? jsx(ArrowUpIcon, {}) : jsx(ArrowDownIcon, {}), value: computedDisplayValue(), disabled: disabled, activeDropdown: isOpen, negative: negative }) }), message && (jsx(SpanHintSC$3, { className: classNames({ disabled, negative, positive }), children: message })), multi && value.length > 0 && (jsx(SelectedTagsWrapper, { children: jsx(MultipleValue, { options: selectedItems, onRemove: handleOptionRemove }) })), isOpen && (jsx(Portal, { portal: portal, children: jsx(DivDropdownMenuSC, { ref: setPopperElement, style: {
                         ...styles.popper,
                         width: referenceElement?.offsetWidth,
                         zIndex: 9999,