@bolttech/molecules-dropdown 0.17.2 → 0.18.0

package/index.cjs

@@ -69,7 +69,7 @@ var indexedObject = fails$f(function () {
   // eslint-disable-next-line no-prototype-builtins -- safe
   return !$Object$4('z').propertyIsEnumerable(0);
 }) ? function (it) {
-  return classof$3(it) == 'String' ? split(it, '') : $Object$4(it);
+  return classof$3(it) === 'String' ? split(it, '') : $Object$4(it);
 } : $Object$4;
 
 // we can't use just `it == null` since of `document.all` special case
@@ -85,7 +85,7 @@ var $TypeError$7 = TypeError;
 // `RequireObjectCoercible` abstract operation
 // https://tc39.es/ecma262/#sec-requireobjectcoercible
 var requireObjectCoercible$6 = function (it) {
-  if (isNullOrUndefined$3(it)) throw $TypeError$7("Can't call method on " + it);
+  if (isNullOrUndefined$3(it)) throw new $TypeError$7("Can't call method on " + it);
   return it;
 };
 
@@ -98,7 +98,7 @@ var toIndexedObject$5 = function (it) {
 };
 
 var check = function (it) {
-  return it && it.Math == Math && it;
+  return it && it.Math === Math && it;
 };
 
 // https://github.com/zloirock/core-js/issues/86#issuecomment-115759028
@@ -140,10 +140,10 @@ var store$2 = sharedStore;
 (shared$4.exports = function (key, value) {
   return store$2[key] || (store$2[key] = value !== undefined ? value : {});
 })('versions', []).push({
-  version: '3.30.2',
+  version: '3.33.2',
   mode: 'global',
   copyright: '© 2014-2023 Denis Pushkarev (zloirock.ru)',
-  license: 'https://github.com/zloirock/core-js/blob/v3.30.2/LICENSE',
+  license: 'https://github.com/zloirock/core-js/blob/v3.33.2/LICENSE',
   source: 'https://github.com/zloirock/core-js'
 });
 
@@ -210,7 +210,6 @@ if (!version && userAgent) {
 var engineV8Version = version;
 
 /* eslint-disable es/no-symbol -- required for testing */
-
 var V8_VERSION = engineV8Version;
 var fails$e = fails$h;
 var global$b = global$f;
@@ -219,7 +218,7 @@ var $String$5 = global$b.String;
 
 // eslint-disable-next-line es/no-object-getownpropertysymbols -- required for testing
 var symbolConstructorDetection = !!Object.getOwnPropertySymbols && !fails$e(function () {
-  var symbol = Symbol();
+  var symbol = Symbol('symbol detection');
   // Chrome 38 Symbol has incorrect toString conversion
   // `get-own-property-symbols` polyfill symbols converted to object are not Symbol instances
   // nb: Do not call `String` directly to avoid this being optimized out to `symbol+''` which will,
@@ -230,7 +229,6 @@ var symbolConstructorDetection = !!Object.getOwnPropertySymbols && !fails$e(func
 });
 
 /* eslint-disable es/no-symbol -- required for testing */
-
 var NATIVE_SYMBOL$1 = symbolConstructorDetection;
 
 var useSymbolAsUid = NATIVE_SYMBOL$1
@@ -298,7 +296,7 @@ var $TypeError$6 = TypeError;
 // `Assert: Type(argument) is Object`
 var anObject$9 = function (argument) {
   if (isObject$5(argument)) return argument;
-  throw $TypeError$6($String$4(argument) + ' is not an object');
+  throw new $TypeError$6($String$4(argument) + ' is not an object');
 };
 
 var objectDefineProperties = {};
@@ -308,7 +306,7 @@ var fails$d = fails$h;
 // Detect IE8's incomplete defineProperty implementation
 var descriptors = !fails$d(function () {
   // eslint-disable-next-line es/no-object-defineproperty -- required for testing
-  return Object.defineProperty({}, 1, { get: function () { return 7; } })[1] != 7;
+  return Object.defineProperty({}, 1, { get: function () { return 7; } })[1] !== 7;
 });
 
 var DESCRIPTORS$9 = descriptors;
@@ -321,7 +319,7 @@ var v8PrototypeDefineBug = DESCRIPTORS$9 && fails$c(function () {
   return Object.defineProperty(function () { /* empty */ }, 'prototype', {
     value: 42,
     writable: false
-  }).prototype != 42;
+  }).prototype !== 42;
 });
 
 var objectDefineProperty = {};
@@ -346,7 +344,7 @@ var ie8DomDefine = !DESCRIPTORS$8 && !fails$b(function () {
   // eslint-disable-next-line es/no-object-defineproperty -- required for testing
   return Object.defineProperty(createElement('div'), 'a', {
     get: function () { return 7; }
-  }).a != 7;
+  }).a !== 7;
 });
 
 var NATIVE_BIND$1 = functionBindNative;
@@ -404,7 +402,7 @@ var $TypeError$5 = TypeError;
 // `Assert: IsCallable(argument) is true`
 var aCallable$2 = function (argument) {
   if (isCallable$d(argument)) return argument;
-  throw $TypeError$5(tryToString(argument) + ' is not a function');
+  throw new $TypeError$5(tryToString(argument) + ' is not a function');
 };
 
 var aCallable$1 = aCallable$2;
@@ -430,7 +428,7 @@ var ordinaryToPrimitive$1 = function (input, pref) {
   if (pref === 'string' && isCallable$c(fn = input.toString) && !isObject$3(val = call$9(fn, input))) return val;
   if (isCallable$c(fn = input.valueOf) && !isObject$3(val = call$9(fn, input))) return val;
   if (pref !== 'string' && isCallable$c(fn = input.toString) && !isObject$3(val = call$9(fn, input))) return val;
-  throw $TypeError$4("Can't convert object to primitive value");
+  throw new $TypeError$4("Can't convert object to primitive value");
 };
 
 var call$8 = functionCall;
@@ -453,7 +451,7 @@ var toPrimitive$1 = function (input, pref) {
     if (pref === undefined) pref = 'default';
     result = call$8(exoticToPrim, input, pref);
     if (!isObject$2(result) || isSymbol$1(result)) return result;
-    throw $TypeError$3("Can't convert object to primitive value");
+    throw new $TypeError$3("Can't convert object to primitive value");
   }
   if (pref === undefined) pref = 'number';
   return ordinaryToPrimitive(input, pref);
@@ -508,7 +506,7 @@ objectDefineProperty.f = DESCRIPTORS$7 ? V8_PROTOTYPE_DEFINE_BUG$1 ? function de
   if (IE8_DOM_DEFINE$1) try {
     return $defineProperty(O, P, Attributes);
   } catch (error) { /* empty */ }
-  if ('get' in Attributes || 'set' in Attributes) throw $TypeError$2('Accessors not supported');
+  if ('get' in Attributes || 'set' in Attributes) throw new $TypeError$2('Accessors not supported');
   if ('value' in Attributes) O[P] = Attributes.value;
   return O;
 };
@@ -578,10 +576,10 @@ var createMethod$2 = function (IS_INCLUDES) {
     var value;
     // Array#includes uses SameValueZero equality algorithm
     // eslint-disable-next-line no-self-compare -- NaN check
-    if (IS_INCLUDES && el != el) while (length > index) {
+    if (IS_INCLUDES && el !== el) while (length > index) {
       value = O[index++];
       // eslint-disable-next-line no-self-compare -- NaN check
-      if (value != value) return true;
+      if (value !== value) return true;
     // Array#indexOf ignores holes, Array#includes - not
     } else for (;length > index; index++) {
       if ((IS_INCLUDES || index in O) && O[index] === el) return IS_INCLUDES || index || 0;
@@ -677,7 +675,6 @@ var sharedKey$3 = function (key) {
 };
 
 /* global ActiveXObject -- old IE, WSH */
-
 var anObject$6 = anObject$9;
 var definePropertiesModule = objectDefineProperties;
 var enumBugKeys$1 = enumBugKeys$3;
@@ -770,7 +767,7 @@ var ArrayPrototype = Array.prototype;
 
 // Array.prototype[@@unscopables]
 // https://tc39.es/ecma262/#sec-array.prototype-@@unscopables
-if (ArrayPrototype[UNSCOPABLES] == undefined) {
+if (ArrayPrototype[UNSCOPABLES] === undefined) {
   defineProperty$4(ArrayPrototype, UNSCOPABLES, {
     configurable: true,
     value: create$2(null)
@@ -833,7 +830,7 @@ var getterFor = function (TYPE) {
   return function (it) {
     var state;
     if (!isObject$1(it) || (state = get(it)).type !== TYPE) {
-      throw TypeError$1('Incompatible receiver, ' + TYPE + ' required');
+      throw new TypeError$1('Incompatible receiver, ' + TYPE + ' required');
     } return state;
   };
 };
@@ -846,7 +843,7 @@ if (NATIVE_WEAK_MAP || shared$1.state) {
   store$1.set = store$1.set;
   /* eslint-enable no-self-assign -- prototype methods protection */
   set = function (it, metadata) {
-    if (store$1.has(it)) throw TypeError$1(OBJECT_ALREADY_INITIALIZED);
+    if (store$1.has(it)) throw new TypeError$1(OBJECT_ALREADY_INITIALIZED);
     metadata.facade = it;
     store$1.set(it, metadata);
     return metadata;
@@ -861,7 +858,7 @@ if (NATIVE_WEAK_MAP || shared$1.state) {
   var STATE = sharedKey$1('state');
   hiddenKeys$1[STATE] = true;
   set = function (it, metadata) {
-    if (hasOwn$6(it, STATE)) throw TypeError$1(OBJECT_ALREADY_INITIALIZED);
+    if (hasOwn$6(it, STATE)) throw new TypeError$1(OBJECT_ALREADY_INITIALIZED);
     metadata.facade = it;
     createNonEnumerableProperty$4(it, STATE, metadata);
     return metadata;
@@ -1099,8 +1096,8 @@ var replacement = /#|\.prototype\./;
 
 var isForced$1 = function (feature, detection) {
   var value = data[normalize(feature)];
-  return value == POLYFILL ? true
-    : value == NATIVE ? false
+  return value === POLYFILL ? true
+    : value === NATIVE ? false
     : isCallable$7(detection) ? fails$9(detection)
     : !!detection;
 };
@@ -1293,11 +1290,10 @@ var $TypeError$1 = TypeError;
 
 var aPossiblePrototype$1 = function (argument) {
   if (typeof argument == 'object' || isCallable$4(argument)) return argument;
-  throw $TypeError$1("Can't set " + $String$1(argument) + ' as a prototype');
+  throw new $TypeError$1("Can't set " + $String$1(argument) + ' as a prototype');
 };
 
 /* eslint-disable no-proto -- safe */
-
 var uncurryThisAccessor = functionUncurryThisAccessor;
 var anObject$4 = anObject$9;
 var aPossiblePrototype = aPossiblePrototype$1;
@@ -1354,12 +1350,15 @@ var iteratorDefine = function (Iterable, NAME, IteratorConstructor, next, DEFAUL
 
   var getIterationMethod = function (KIND) {
     if (KIND === DEFAULT && defaultIterator) return defaultIterator;
-    if (!BUGGY_SAFARI_ITERATORS && KIND in IterablePrototype) return IterablePrototype[KIND];
+    if (!BUGGY_SAFARI_ITERATORS && KIND && KIND in IterablePrototype) return IterablePrototype[KIND];
+
     switch (KIND) {
       case KEYS: return function keys() { return new IteratorConstructor(this, KIND); };
       case VALUES: return function values() { return new IteratorConstructor(this, KIND); };
       case ENTRIES: return function entries() { return new IteratorConstructor(this, KIND); };
-    } return function () { return new IteratorConstructor(this); };
+    }
+
+    return function () { return new IteratorConstructor(this); };
   };
 
   var TO_STRING_TAG = NAME + ' Iterator';
@@ -1369,7 +1368,7 @@ var iteratorDefine = function (Iterable, NAME, IteratorConstructor, next, DEFAUL
     || IterablePrototype['@@iterator']
     || DEFAULT && IterablePrototype[DEFAULT];
   var defaultIterator = !BUGGY_SAFARI_ITERATORS && nativeIterator || getIterationMethod(DEFAULT);
-  var anyNativeIterator = NAME == 'Array' ? IterablePrototype.entries || nativeIterator : nativeIterator;
+  var anyNativeIterator = NAME === 'Array' ? IterablePrototype.entries || nativeIterator : nativeIterator;
   var CurrentIteratorPrototype, methods, KEY;
 
   // fix native
@@ -1389,7 +1388,7 @@ var iteratorDefine = function (Iterable, NAME, IteratorConstructor, next, DEFAUL
   }
 
   // fix Array.prototype.{ values, @@iterator }.name in V8 / FF
-  if (PROPER_FUNCTION_NAME$1 && DEFAULT == VALUES && nativeIterator && nativeIterator.name !== VALUES) {
+  if (PROPER_FUNCTION_NAME$1 && DEFAULT === VALUES && nativeIterator && nativeIterator.name !== VALUES) {
     if (CONFIGURABLE_FUNCTION_NAME) {
       createNonEnumerableProperty$2(IterablePrototype, 'name', VALUES);
     } else {
@@ -1462,15 +1461,15 @@ var es_array_iterator = defineIterator(Array, 'Array', function (iterated, kind)
 }, function () {
   var state = getInternalState$1(this);
   var target = state.target;
-  var kind = state.kind;
   var index = state.index++;
   if (!target || index >= target.length) {
     state.target = undefined;
     return createIterResultObject(undefined, true);
   }
-  if (kind == 'keys') return createIterResultObject(index, false);
-  if (kind == 'values') return createIterResultObject(target[index], false);
-  return createIterResultObject([index, target[index]], false);
+  switch (state.kind) {
+    case 'keys': return createIterResultObject(index, false);
+    case 'values': return createIterResultObject(target[index], false);
+  } return createIterResultObject([index, target[index]], false);
 }, 'values');
 
 // argumentsList[@@iterator] is %ArrayProto_values%
@@ -1604,11 +1603,11 @@ var objectAssign = !$assign || fails$6(function () {
   var A = {};
   var B = {};
   // eslint-disable-next-line es/no-symbol -- safe
-  var symbol = Symbol();
+  var symbol = Symbol('assign detection');
   var alphabet = 'abcdefghijklmnopqrst';
   A[symbol] = 7;
   alphabet.split('').forEach(function (chr) { B[chr] = chr; });
-  return $assign({}, A)[symbol] != 7 || objectKeys($assign({}, B)).join('') != alphabet;
+  return $assign({}, A)[symbol] !== 7 || objectKeys($assign({}, B)).join('') !== alphabet;
 }) ? function assign(target, source) { // eslint-disable-line no-unused-vars -- required for `.length`
   var T = toObject$1(target);
   var argumentsLength = arguments.length;
@@ -1673,7 +1672,12 @@ function __awaiter(thisArg, _arguments, P, generator) {
         function step(result) { result.done ? resolve(result.value) : adopt(result.value).then(fulfilled, rejected); }
         step((generator = generator.apply(thisArg, _arguments || [])).next());
     });
-}
+}
+
+typeof SuppressedError === "function" ? SuppressedError : function (error, suppressed, message) {
+    var e = new Error(message);
+    return e.name = "SuppressedError", e.error = error, e.suppressed = suppressed, e;
+};
 
 var wellKnownSymbol$3 = wellKnownSymbol$a;
 
@@ -1693,7 +1697,7 @@ var TO_STRING_TAG = wellKnownSymbol$2('toStringTag');
 var $Object = Object;
 
 // ES3 wrong here
-var CORRECT_ARGUMENTS = classofRaw$1(function () { return arguments; }()) == 'Arguments';
+var CORRECT_ARGUMENTS = classofRaw$1(function () { return arguments; }()) === 'Arguments';
 
 // fallback for IE11 Script Access Denied error
 var tryGet = function (it, key) {
@@ -1711,7 +1715,7 @@ var classof$2 = TO_STRING_TAG_SUPPORT ? classofRaw$1 : function (it) {
     // builtinTag case
     : CORRECT_ARGUMENTS ? classofRaw$1(O)
     // ES3 arguments fallback
-    : (result = classofRaw$1(O)) == 'Object' && isCallable$2(O.callee) ? 'Arguments' : result;
+    : (result = classofRaw$1(O)) === 'Object' && isCallable$2(O.callee) ? 'Arguments' : result;
 };
 
 var classof$1 = classof$2;
@@ -1719,7 +1723,7 @@ var classof$1 = classof$2;
 var $String = String;
 
 var toString$5 = function (argument) {
-  if (classof$1(argument) === 'Symbol') throw TypeError('Cannot convert a Symbol value to a string');
+  if (classof$1(argument) === 'Symbol') throw new TypeError('Cannot convert a Symbol value to a string');
   return $String(argument);
 };
 
@@ -1750,7 +1754,7 @@ var $RegExp$2 = global$3.RegExp;
 var UNSUPPORTED_Y$1 = fails$5(function () {
   var re = $RegExp$2('a', 'y');
   re.lastIndex = 2;
-  return re.exec('abcd') != null;
+  return re.exec('abcd') !== null;
 });
 
 // UC Browser bug
@@ -1763,7 +1767,7 @@ var BROKEN_CARET = UNSUPPORTED_Y$1 || fails$5(function () {
   // https://bugzilla.mozilla.org/show_bug.cgi?id=773687
   var re = $RegExp$2('^r', 'gy');
   re.lastIndex = 2;
-  return re.exec('str') != null;
+  return re.exec('str') !== null;
 });
 
 var regexpStickyHelpers = {
@@ -1780,7 +1784,7 @@ var $RegExp$1 = global$2.RegExp;
 
 var regexpUnsupportedDotAll = fails$4(function () {
   var re = $RegExp$1('.', 's');
-  return !(re.dotAll && re.exec('\n') && re.flags === 's');
+  return !(re.dotAll && re.test('\n') && re.flags === 's');
 });
 
 var fails$3 = fails$h;
@@ -1961,7 +1965,7 @@ var fixRegexpWellKnownSymbolLogic = function (KEY, exec, FORCED, SHAM) {
     // String methods call symbol-named RegEp methods
     var O = {};
     O[SYMBOL] = function () { return 7; };
-    return ''[KEY](O) != 7;
+    return ''[KEY](O) !== 7;
   });
 
   var DELEGATES_TO_EXEC = DELEGATES_TO_SYMBOL && !fails$2(function () {
@@ -1982,7 +1986,10 @@ var fixRegexpWellKnownSymbolLogic = function (KEY, exec, FORCED, SHAM) {
       re[SYMBOL] = /./[SYMBOL];
     }
 
-    re.exec = function () { execCalled = true; return null; };
+    re.exec = function () {
+      execCalled = true;
+      return null;
+    };
 
     re[SYMBOL]('');
     return !execCalled;
@@ -2125,7 +2132,7 @@ var regexpExecAbstract = function (R, S) {
     return result;
   }
   if (classof(R) === 'RegExp') return call$2(regexpExec, R, S);
-  throw $TypeError('RegExp#exec called on incompatible receiver');
+  throw new $TypeError('RegExp#exec called on incompatible receiver');
 };
 
 var apply = functionApply;
@@ -2217,13 +2224,16 @@ fixRegExpWellKnownSymbolLogic$1('replace', function (_, nativeReplace, maybeCall
       if (!functionalReplace) replaceValue = toString$2(replaceValue);
 
       var global = rx.global;
+      var fullUnicode;
       if (global) {
-        var fullUnicode = rx.unicode;
+        fullUnicode = rx.unicode;
         rx.lastIndex = 0;
       }
+
       var results = [];
+      var result;
       while (true) {
-        var result = regExpExec$1(rx, S);
+        result = regExpExec$1(rx, S);
         if (result === null) break;
 
         push(results, result);
@@ -2241,6 +2251,7 @@ fixRegExpWellKnownSymbolLogic$1('replace', function (_, nativeReplace, maybeCall
         var matched = toString$2(result[0]);
         var position = max(min(toIntegerOrInfinity(result.index), S.length), 0);
         var captures = [];
+        var replacement;
         // NOTE: This is equivalent to
         //   captures = result.slice(1).map(maybeToString)
         // but for some reason `nativeSlice.call(result, 1, result.length)` (called in
@@ -2251,7 +2262,7 @@ fixRegExpWellKnownSymbolLogic$1('replace', function (_, nativeReplace, maybeCall
         if (functionalReplace) {
           var replacerArgs = concat([matched], captures, position, S);
           if (namedCaptures !== undefined) push(replacerArgs, namedCaptures);
-          var replacement = toString$2(apply(replaceValue, undefined, replacerArgs));
+          replacement = toString$2(apply(replaceValue, undefined, replacerArgs));
         } else {
           replacement = getSubstitution(matched, S, position, captures, namedCaptures, replaceValue);
         }
@@ -2260,6 +2271,7 @@ fixRegExpWellKnownSymbolLogic$1('replace', function (_, nativeReplace, maybeCall
           nextSourcePosition = position + matched.length;
         }
       }
+
       return accumulatedResult + stringSlice(S, nextSourcePosition);
     }
   ];
@@ -2272,7 +2284,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:", ";border:", ";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:", ";border:", ";", "}", " ", ""], ({
+})(["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:", ";", "}", " ", ""], ({
   theme
 }) => theme.components.dropdown.paddingVertical, ({
   theme
@@ -2284,11 +2296,11 @@ const ContainerDropdown = /*#__PURE__*/styled__default["default"].section.withCo
   theme
 }) => theme.components.dropdown.gap, ({
   theme,
-  variant
-}) => theme.components.dropdown[variant].container.color.default, ({
+  $variant
+}) => theme.components.dropdown[$variant].container.color.default, ({
   theme,
-  variant
-}) => `1px solid ${theme.components.dropdown[variant].container.border.default}`, ({
+  $variant
+}) => `1px solid ${theme.components.dropdown[$variant].container.border.default}`, ({
   theme
 }) => theme.components.dropdown.borderRadius, ({
   theme: {
@@ -2298,9 +2310,9 @@ const ContainerDropdown = /*#__PURE__*/styled__default["default"].section.withCo
   }
 }) => shadow.lvl0, ({
   theme,
-  variant,
-  hasValue
-}) => theme.components.dropdown[variant].text.color.fieldLabel[hasValue ? 'filled' : 'default'], ({
+  $variant,
+  $hasValue
+}) => theme.components.dropdown[$variant].text.color.fieldLabel[$hasValue ? 'filled' : 'default'], ({
   theme
 }) => theme.components.dropdown.fieldLabel.fontWeight, ({
   theme
@@ -2310,9 +2322,9 @@ const ContainerDropdown = /*#__PURE__*/styled__default["default"].section.withCo
   theme
 }) => theme.components.dropdown.fieldLabel.letterSpacing, ({
   theme,
-  variant,
-  hasValue
-}) => theme.components.dropdown[variant].text.color.required[hasValue ? 'filled' : 'default'], ({
+  $variant,
+  $hasValue
+}) => theme.components.dropdown[$variant].text.color.required[$hasValue ? 'filled' : 'default'], ({
   theme
 }) => theme.components.dropdown.required.fontWeight, ({
   theme
@@ -2322,71 +2334,71 @@ const ContainerDropdown = /*#__PURE__*/styled__default["default"].section.withCo
   theme
 }) => theme.components.dropdown.required.letterSpacing, ({
   theme,
-  variant,
-  hasValue
-}) => theme.components.dropdown[variant].icon.color[hasValue ? 'filled' : 'default'], ({
+  $variant,
+  $hasValue
+}) => theme.components.dropdown[$variant].icon.color[$hasValue ? 'filled' : 'default'], ({
   theme,
-  variant,
-  hasError
-}) => theme.components.dropdown[variant].container.color[hasError ? 'error' : 'focus'], ({
+  $variant,
+  $hasError
+}) => theme.components.dropdown[$variant].container.color[$hasError ? 'error' : 'focus'], ({
   theme,
-  variant,
-  hasError
-}) => `1px solid ${theme.components.dropdown[variant].container.border[hasError ? 'error' : 'focus']}`, ({
-  hasError
-}) => !hasError && styled.css([".fieldLabel{color:", ";}.requiredLabel{color:", ";}label.material-symbols-sharp{color:", ";}"], ({
+  $variant,
+  $hasError
+}) => `1px solid ${theme.components.dropdown[$variant].container.border[$hasError ? 'error' : 'focus']}`, ({
+  $hasError
+}) => !$hasError && styled.css([".fieldLabel{color:", ";}.requiredLabel{color:", ";}label.material-symbols-sharp{color:", ";}"], ({
   theme,
-  variant
-}) => theme.components.dropdown[variant].text.color.fieldLabel.focus, ({
+  $variant
+}) => theme.components.dropdown[$variant].text.color.fieldLabel.focus, ({
   theme,
-  variant
-}) => theme.components.dropdown[variant].text.color.required.focus, ({
+  $variant
+}) => theme.components.dropdown[$variant].text.color.required.focus, ({
   theme,
-  variant
-}) => theme.components.dropdown[variant].icon.color.focus), ({
-  hasError,
-  hasValue
-}) => hasError && styled.css(["border:", ";background-color:", ";.fieldLabel{color:", ";}.requiredLabel{color:", ";}label.material-symbols-sharp{color:", ";}"], ({
+  $variant
+}) => theme.components.dropdown[$variant].icon.color.focus), ({
+  $hasError,
+  $hasValue
+}) => $hasError && styled.css(["outline:", ";background-color:", ";.fieldLabel{color:", ";}.requiredLabel{color:", ";}label.material-symbols-sharp{color:", ";}"], ({
   theme,
-  variant
-}) => `1px solid ${theme.components.dropdown[variant].container.border[hasValue ? 'errorFilled' : 'error']}`, ({
+  $variant
+}) => `1px solid ${theme.components.dropdown[$variant].container.border[$hasValue ? 'errorFilled' : 'error']}`, ({
   theme,
-  variant
-}) => theme.components.dropdown[variant].container.color[hasValue ? 'errorFilled' : 'error'], ({
+  $variant
+}) => theme.components.dropdown[$variant].container.color[$hasValue ? 'errorFilled' : 'error'], ({
   theme,
-  variant,
-  hasValue
-}) => theme.components.dropdown[variant].text.color.fieldLabel[hasValue ? 'errorFilled' : 'error'], ({
+  $variant,
+  $hasValue
+}) => theme.components.dropdown[$variant].text.color.fieldLabel[$hasValue ? 'errorFilled' : 'error'], ({
   theme,
-  variant,
-  hasValue
-}) => theme.components.dropdown[variant].text.color.required[hasValue ? 'errorFilled' : 'error'], ({
+  $variant,
+  $hasValue
+}) => theme.components.dropdown[$variant].text.color.required[$hasValue ? 'errorFilled' : 'error'], ({
   theme,
-  variant
-}) => theme.components.dropdown[variant].icon.color[hasValue ? 'errorFilled' : 'error']), ({
+  $variant
+}) => theme.components.dropdown[$variant].icon.color[$hasValue ? 'errorFilled' : 'error']), ({
   disabled
-}) => disabled && styled.css(["cursor:not-allowed;border:", ";background-color:", ";*{cursor:not-allowed;}.fieldLabel{color:", ";}.requiredLabel{color:", ";}label.material-symbols-sharp{color:", ";}input{color:", ";::placeholder{color:", ";}}"], ({
+}) => disabled && styled.css(["cursor:not-allowed;outline:", ";background-color:", ";*{cursor:not-allowed;}.fieldLabel{color:", ";}.requiredLabel{color:", ";}label.material-symbols-sharp{color:", ";}input{color:", ";&::placeholder{color:", ";}}"], ({
   theme,
-  variant
-}) => `1px solid ${theme.components.dropdown[variant].container.border.disable}`, ({
+  $variant
+}) => `1px solid ${theme.components.dropdown[$variant].container.border.disable}`, ({
   theme,
-  variant
-}) => theme.components.dropdown[variant].container.color.disable, ({
+  $variant
+}) => theme.components.dropdown[$variant].container.color.disable, ({
   theme,
-  variant
-}) => theme.components.dropdown[variant].text.color.fieldLabel.disable, ({
+  $variant
+}) => theme.components.dropdown[$variant].text.color.fieldLabel.disable, ({
   theme,
-  variant
-}) => theme.components.dropdown[variant].text.color.required.disable, ({
+  $variant
+}) => theme.components.dropdown[$variant].text.color.required.disable, ({
   theme,
-  variant
-}) => theme.components.dropdown[variant].icon.color.disable, ({
+  $variant
+}) => theme.components.dropdown[$variant].icon.color.disable, ({
   theme,
-  variant
-}) => theme.components.dropdown[variant].text.color.fieldLabel.disable, ({
+  $variant
+}) => theme.components.dropdown[$variant].text.color.fieldLabel.disable, ({
   theme,
-  variant
-}) => theme.components.dropdown[variant].text.color.fieldLabel.disable));
+  $variant
+}) => theme.components.dropdown[$variant].text.color.fieldLabel.disable));
 const SectionContainer = /*#__PURE__*/styled__default["default"].section.withConfig({
   displayName: "molecules-dropdownstyles__SectionContainer",
   componentId: "sc-3wugi4-2"
@@ -2396,8 +2408,8 @@ const SectionContainer = /*#__PURE__*/styled__default["default"].section.withCon
   theme
 }) => theme.components.dropdown.paddingHorizontal, ({
   theme,
-  variant
-}) => theme.components.dropdown[variant].text.color.errorMessage.error, ({
+  $variant
+}) => theme.components.dropdown[$variant].text.color.errorMessage.error, ({
   theme
 }) => theme.components.dropdown.error.fontWeight, ({
   theme
@@ -2425,7 +2437,7 @@ const FieldLabelAndRequiredLabelDropdown = /*#__PURE__*/styled__default["default
 const DropdownOptionsContainer = /*#__PURE__*/styled__default["default"].div.withConfig({
   displayName: "molecules-dropdownstyles__DropdownOptionsContainer",
   componentId: "sc-3wugi4-6"
-})(["position:absolute;inset:0;top:100%;"]);
+})(["position:absolute;inset:0;top:calc(100% + 1px);"]);
 
 const ReusableDropdownComponent = _a => {
   var {
@@ -2455,9 +2467,9 @@ const ReusableDropdownComponent = _a => {
   const sizeIcon = Number(theme.components.dropdown.icon.size.replace(/[^\d.-]+/g, ''));
   return jsxRuntime.jsxs(jsxRuntime.Fragment, {
     children: [jsxRuntime.jsxs(ContainerDropdown, {
-      variant: variant,
-      hasValue: inputValue,
-      hasError: hasError,
+      "$variant": variant,
+      "$hasValue": inputValue,
+      "$hasError": hasError,
       disabled: disabled,
       "data-testid": `${dataTestId}-dropdown-container`,
       children: [jsxRuntime.jsxs(ContentDropdown, {
@@ -2482,7 +2494,7 @@ const ReusableDropdownComponent = _a => {
             ref: inputRef,
             disabled: disabled,
             value: inputLabel,
-            variant: variant,
+            "$variant": variant,
             placeholder: placeholder,
             autoComplete: "off",
             onChange: e => {
@@ -2529,7 +2541,7 @@ const ReusableDropdownComponent = _a => {
 // eslint-disable-next-line es/no-object-is -- safe
 var sameValue$1 = Object.is || function is(x, y) {
   // eslint-disable-next-line no-self-compare -- NaN check
-  return x === y ? x !== 0 || 1 / x === 1 / y : x != x && y != y;
+  return x === y ? x !== 0 || 1 / x === 1 / y : x !== x && y !== y;
 };
 
 var call = functionCall;
@@ -2701,19 +2713,21 @@ const Dropdown = /*#__PURE__*/react.forwardRef((_a, ref) => {
   }, [internalSelectedOption]);
   react.useEffect(() => {
     if (value !== (internalSelectedOption === null || internalSelectedOption === void 0 ? void 0 : internalSelectedOption.id)) {
-      setInternalSelectedOption(optionList === null || optionList === void 0 ? void 0 : optionList.find(option => option.id === value));
-      return;
+      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) || '');
+      setInputLabel((foundOption === null || foundOption === void 0 ? void 0 : foundOption.label) || '');
     }
     if (!isFirstRender || currentOptionList.length === 0) return;
     setInternalSelectedOption(currentOptionList.find(option => option.id === value));
     setIsFirstRender(false);
-  }, [currentOptionList, setSelectedOptionOnInputValue, value, internalSelectedOption === null || internalSelectedOption === void 0 ? void 0 : internalSelectedOption.id, optionList, isFirstRender]);
+  }, [currentOptionList, setSelectedOptionOnInputValue, value, internalSelectedOption, optionList, isFirstRender]);
   return jsxRuntime.jsxs(SectionContainer, Object.assign({
     onClick: () => {
       var _a;
       return (_a = inputRef.current) === null || _a === void 0 ? void 0 : _a.focus();
     },
-    variant: variant,
+    "$variant": variant,
     id: `${id}-container`,
     "data-testid": `${dataTestId}-container`,
     style: {
@@ -2835,7 +2849,7 @@ const DropdownWithHeaders = /*#__PURE__*/react.forwardRef((_a, ref) => {
       var _a;
       return (_a = inputRef.current) === null || _a === void 0 ? void 0 : _a.focus();
     },
-    variant: variant,
+    "$variant": variant,
     "data-testid": `${dataTestId}-container`,
     ref: ref
   }, uiUtils.applyDataAttributes(props), {