@bolttech/molecules-dropdown 0.32.0 → 0.32.2

package/index.cjs

@@ -2272,7 +2272,7 @@ const ClickableElement = /*#__PURE__*/styled__default["default"].div.withConfig(
 const ContainerDropdown = /*#__PURE__*/styled__default["default"].section.withConfig({
   displayName: "molecules-dropdownstyles__ContainerDropdown",
   componentId: "sc-3wugi4-1"
-})(["display:flex;padding-top:", ";padding-bottom:", ";padding-right:", ";padding-left:", ";gap:", ";background-color:", ";outline:", ";border-radius:", ";box-shadow:", ";input{display:inline-block;text-overflow:ellipsis;white-space:nowrap;width:100%;overflow-x:hidden;}.fieldLabel{color:", ";font-weight:", ";line-height:", ";font-size:", ";letter-spacing:", ";}.requiredLabel{color:", ";font-weight:", ";line-height:", ";font-size:", ";letter-spacing:", ";}label.material-symbols-sharp{color:", ";}&:focus-within{background-color:", ";outline:", ";", "}", " ", ""], ({
+})(["display:flex;padding-top:", ";padding-bottom:", ";padding-right:", ";padding-left:", ";gap:", ";background-color:", ";outline:", ";border-radius:", ";box-shadow:", ";margin-bottom:", ";input{display:inline-block;text-overflow:ellipsis;white-space:nowrap;width:100%;overflow-x:hidden;}.fieldLabel{color:", ";font-weight:", ";line-height:", ";font-size:", ";letter-spacing:", ";}.requiredLabel{color:", ";font-weight:", ";line-height:", ";font-size:", ";letter-spacing:", ";}label.material-symbols-sharp{color:", ";}&:focus-within{background-color:", ";outline:", ";", "}", " ", ""], ({
   theme
 }) => theme.components.dropdown.paddingVertical, ({
   theme
@@ -2297,6 +2297,10 @@ const ContainerDropdown = /*#__PURE__*/styled__default["default"].section.withCo
     }
   }
 }) => shadow.lvl0, ({
+  theme,
+  $hasError,
+  $hasHelperText
+}) => $hasError || $hasHelperText ? theme.components.input.contentGap : 0, ({
   theme,
   $variant,
   $hasValue
@@ -2480,6 +2484,7 @@ const ReusableDropdownComponent = _a => {
       "$variant": variant,
       "$hasValue": inputValue,
       "$hasError": hasError,
+      "$hasHelperText": !!helperMessage,
       disabled: disabled,
       "data-testid": `${dataTestId}-dropdown-container`,
       onMouseDown: e => {
@@ -2759,7 +2764,7 @@ const Dropdown = /*#__PURE__*/react.forwardRef((_a, ref) => {
     // eslint-disable-next-line react-hooks/exhaustive-deps
   }, [internalSelectedOption]);
   react.useEffect(() => {
-    if (value !== (internalSelectedOption === null || internalSelectedOption === void 0 ? void 0 : internalSelectedOption.id)) {
+    if (value && value !== (internalSelectedOption === null || internalSelectedOption === void 0 ? void 0 : internalSelectedOption.id)) {
       const foundOption = optionList === null || optionList === void 0 ? void 0 : optionList.find(option => option.id === value);
       setInternalSelectedOption(foundOption);
       setInputValue((foundOption === null || foundOption === void 0 ? void 0 : foundOption.value) || '');
@@ -2910,7 +2915,7 @@ const DropdownWithHeaders = /*#__PURE__*/react.forwardRef((_a, ref) => {
     // eslint-disable-next-line react-hooks/exhaustive-deps
   }, [internalSelectedOption]);
   react.useEffect(() => {
-    if (value !== (internalSelectedOption === null || internalSelectedOption === void 0 ? void 0 : internalSelectedOption.id)) {
+    if (value && value !== (internalSelectedOption === null || internalSelectedOption === void 0 ? void 0 : internalSelectedOption.id)) {
       const option = optionList === null || optionList === void 0 ? void 0 : optionList.map(currentOptionsList => {
         return currentOptionsList.options.find(option => option.id === value);
       }).find(item => !!item);

package/package.json

@@ -1,14 +1,14 @@
 {
   "name": "@bolttech/molecules-dropdown",
-  "version": "0.32.0",
+  "version": "0.32.2",
   "main": "./index.cjs",
   "type": "commonjs",
   "types": "./src/index.d.ts",
   "dependencies": {
     "@bolttech/atoms-icon": "0.23.0",
     "@bolttech/atoms-input": "0.26.1",
-    "@bolttech/atoms-select": "0.22.0",
-    "@bolttech/default-theme": "0.9.0",
+    "@bolttech/atoms-select": "0.23.0",
+    "@bolttech/default-theme": "0.9.1",
     "@bolttech/form-engine": "3.1.0-beta.13",
     "@bolttech/frontend-foundations": "0.10.0",
     "@bolttech/ui-utils": "0.5.0",

package/src/lib/molecules-dropdown.styles.d.ts

@@ -5,6 +5,7 @@ type DropdownStyledProps = {
     $variant: StyleVariants;
     $hasValue: string;
     $hasError?: boolean;
+    $hasHelperText?: boolean;
     disabled?: boolean;
 };
 export declare const ClickableElement: import("styled-components").IStyledComponent<"web", {