bmi-next-brokers 1.3.1 → 1.3.3

package/dist/assets/Select.css

@@ -1 +1 @@
-._selectContainer_1o6wc_3{display:flex;flex-direction:column}._selectContainer_medium_1o6wc_9{gap:2px}._selectContainer_large_1o6wc_13,._selectContainer_extraLarge_1o6wc_14{gap:4px}._label_1o6wc_18{font-family:Poppins Regular;font-size:13px;color:var(--Content-Neutral-Default-Active, #000);font-weight:500;padding-left:4px}._label_large_1o6wc_26,._label_extraLarge_1o6wc_27{font-size:15px}._label_disabled_1o6wc_31{color:var(--content-disabled-default, #cbd5e1)}._selectWrapper_1o6wc_35{position:relative;display:flex;align-items:center}._select_1o6wc_3{border:1px solid #ddd;font-family:Poppins Regular;font-weight:100;outline:none;border-radius:16px;transition:all .2s ease;width:100%;background-color:#fff;cursor:pointer;display:flex;align-items:center;justify-content:space-between;padding-right:12px}._select_1o6wc_3._medium_1o6wc_57,._select_1o6wc_3._small_1o6wc_58{border-radius:14px}._select_1o6wc_3:hover{border:1px solid var(--Stroke-Neutral-Primary, #94a3b8)}._select_1o6wc_3:focus{box-shadow:0 0 0 3px var(--ui-blue-400, #7eaae6)}._select_1o6wc_3:active{border:1px solid var(--Stroke-Neutral-Primary, #94a3b8);box-shadow:0 0 0 3px var(--ui-blue-400, #7eaae6)}._select_1o6wc_3._btc_1o6wc_76:active,._select_1o6wc_3._btc_1o6wc_76:focus{border:1px solid #45c2d6;box-shadow:3px 3px 0 0 var(--Complementarios-Turquesa-Compl-2-Turquesa, #45c2d6)}._select_1o6wc_3._open_1o6wc_87{border:1px solid #94a3b8}._select_1o6wc_3._disabled_1o6wc_91{border-radius:16px;border:1px solid var(--Stroke-Disabled-Default, #cbd5e1);background:var(--Fill-Disabled-Default, #f8fafc);color:var(--content-disabled-default, #cbd5e1);cursor:not-allowed}._select_1o6wc_3._disabled_1o6wc_91 ._placeholder_1o6wc_99{color:var(--content-disabled-default, #cbd5e1)}._selectValue_1o6wc_103{flex:1;text-align:left}._placeholder_1o6wc_99{color:var(--Content-Neutral-Default-Default, #a3a3a3)}._chevron_1o6wc_112{transition:transform .2s ease;color:var(--Content-Neutral-Default, #475569)}._chevronOpen_1o6wc_117{transform:rotate(180deg)}._small_1o6wc_58{height:30px;padding-inline:8px;font-size:12px}._medium_1o6wc_57{height:36px;padding-inline:10px;font-size:14px}._large_1o6wc_134{padding-inline:12px;height:42px;font-size:15px}._extraLarge_1o6wc_140{padding-inline:14px;height:48px;font-size:16px}._error_1o6wc_147{border:1px solid var(--Stroke-Negative-Active, #dc2626);background:var(--Fill-Neutral-Primary, #fff);color:var(--Content-Negative-Default-Active, #dc2626);animation:_errorShake_1o6wc_1 .4s ease-in-out}._error_1o6wc_147 ._placeholder_1o6wc_99{color:var(--Content-Negative-Default-Active, #dc2626)}._error_1o6wc_147:hover{border:1px solid var(--Stroke-Negative-Active, #dc2626)}._error_1o6wc_147:active{border:1px solid transparent;box-shadow:0 0 0 3px var(--ui-red-400, #f87171)}._error_1o6wc_147:focus{border:1px solid transparent;box-shadow:0 0 0 3px var(--ui-red-400, #f87171)}._error_1o6wc_147._btc_1o6wc_76::placeholder{color:#dc2626}._error_1o6wc_147._btc_1o6wc_76:active,._error_1o6wc_147._btc_1o6wc_76:focus{border:1px solid #dc2626;box-shadow:3px 3px #dc2626}._error_1o6wc_147._open_1o6wc_87{border:1px solid #dc2626}._errorMessage_1o6wc_187{font-family:Poppins Medium;color:#e74c3c;margin-left:4px;animation:_errorMessageSlide_1o6wc_1 .3s ease-out;transform-origin:top}._errorMessage_medium_1o6wc_195,._errorMessage_small_1o6wc_196{font-size:11px}._errorMessage_large_1o6wc_200,._errorMessage_extraLarge_1o6wc_201{font-size:13px}._errorMessage_inverted_1o6wc_205{color:var(--Content-Negative-Default-Active, #f87171)!important}._helperText_1o6wc_209{font-family:Poppins Regular;color:#acacac;margin-left:4px}._helperText_medium_1o6wc_215,._helperText_small_1o6wc_216{font-size:11px}._helperText_large_1o6wc_220,._helperText_extraLarge_1o6wc_221{font-size:13px}._helperText_disabled_1o6wc_225{color:var(--content-disabled-default, #cbd5e1)}._iconLabel_1o6wc_229{display:flex;justify-content:center;align-items:center;gap:6px}._icon_1o6wc_229{color:var(--Content-Neutral-Default, #475569);pointer-events:none;display:flex;align-items:center;justify-content:center}._icon_disabled_1o6wc_245{color:var(--Content-Neutral-Disabled, #94a3b8)}._required_1o6wc_250{color:var(--Content-Negative-Default-Active, #dc2626);margin-left:2px}._required_inverted_1o6wc_255{color:var(--Content-Negative-Default-Active, #f87171)}._required_disabled_1o6wc_259{color:var(--content-disabled-default, #cbd5e1)}._required_inverted_disabled_1o6wc_263{color:var(--content-disabled-default, #4f88d9)}._dropdown_1o6wc_268{position:absolute;top:100%;left:0;right:0;z-index:1000;background:#fff;border:1px solid var(--Stroke-Neutral-Primary, #94a3b8);border-radius:16px;margin-top:10px;max-height:200px;overflow-y:auto}._option_1o6wc_282{padding:8px 12px;border-bottom:1px solid var(--Stroke-Neutral-Primary, #94a3b8);cursor:pointer;font-family:Poppins Regular;font-size:inherit;display:flex;align-items:center;gap:8px;transition:background-color .2s ease}._option_1o6wc_282:last-child{border-bottom:none}._dropdown_1o6wc_268 ._option_1o6wc_282{font-size:14px;padding:8px 12px}._small_1o6wc_58+._dropdown_1o6wc_268 ._option_1o6wc_282{font-size:12px;padding:8px 11px 8px 14px}._medium_1o6wc_57+._dropdown_1o6wc_268 ._option_1o6wc_282{font-size:14px;padding:8px 12px}._large_1o6wc_134+._dropdown_1o6wc_268 ._option_1o6wc_282{font-size:15px;padding:11px 12px}._extraLarge_1o6wc_140+._dropdown_1o6wc_268 ._option_1o6wc_282{font-size:16px;padding:11px 12px}._option_1o6wc_282:not(._optionSelected_1o6wc_326):hover{background-color:#f8f9fa}._option_1o6wc_282:first-child{border-top-left-radius:16px;border-top-right-radius:16px}._option_1o6wc_282:last-child{border-bottom-left-radius:16px;border-bottom-right-radius:16px}._optionSelected_1o6wc_326{background-color:var(--Fill-Brand-Inverted-Hover, #eef3fc);color:var(--Content-Brand-Inverted-Active, #2054a5)}._optionIcon_1o6wc_345{display:flex;align-items:center;justify-content:center}._inverted_1o6wc_352{border:1px solid var(--Stroke-Neutral-Secondary, #c9e1f6);background-color:transparent!important;color:#fff!important}._inverted_1o6wc_352:hover{border:1px solid white!important}._inverted_1o6wc_352 ._placeholder_1o6wc_99{color:#ffffffb3!important}._inverted_1o6wc_352 ._chevron_1o6wc_112,._label_inverted_1o6wc_370{color:#fff!important}._helperText_inverted_1o6wc_374{color:var(--Content-Neutral-Default-Default, #fafafa)}._icon_inverted_1o6wc_378{color:#fff!important}._dropdown_inverted_1o6wc_382{background:var(--Fill-Brand-Default-Active, #2054a5);border:1px solid var(--Stroke-Neutral-Primary, #e0e9f8)}._option_inverted_1o6wc_387{color:#fff!important;border-bottom-color:1px solid var(--Stroke-Neutral-Primary, #e0e9f8)}._option_inverted_1o6wc_387:hover{background-color:#ffffff1a!important}._option_inverted_1o6wc_387._optionSelected_1o6wc_326{background-color:#ffffff26!important;color:#fff!important}._inverted_1o6wc_352._error_1o6wc_147{border:1px solid var(--Stroke-Negative-Active, #ef4444)!important;color:var(--Content-Negative-Default-Active, #f87171)!important}._inverted_1o6wc_352._error_1o6wc_147 ._placeholder_1o6wc_99{color:var(--Content-Negative-Default-Active, #f87171)!important}._inverted_1o6wc_352._error_1o6wc_147:hover{border:1px solid var(--Stroke-Negative-Active, #ef4444)!important}._inverted_1o6wc_352._error_1o6wc_147:active{border:1px solid transparent!important;box-shadow:0 0 0 3px var(--ui-red-400, #f87171)!important}._inverted_1o6wc_352._error_1o6wc_147:focus{border:1px solid transparent!important;box-shadow:0 0 0 3px var(--ui-red-400, #f87171)!important}._inverted_1o6wc_352._error_1o6wc_147._open_1o6wc_87{border:1px solid transparent!important}@keyframes _errorShake_1o6wc_1{0%,to{transform:translate(0)}10%,30%,50%,70%,90%{transform:translate(-2px)}20%,40%,60%,80%{transform:translate(2px)}}@keyframes _errorMessageSlide_1o6wc_1{0%{opacity:0;transform:translateY(-5px) scaleY(0)}50%{opacity:.8;transform:translateY(-2px) scaleY(.7)}to{opacity:1;transform:translateY(0) scaleY(1)}}._inverted_1o6wc_352._disabled_1o6wc_91{border:1px solid var(--Stroke-Disabled-Default, #1b468a)!important;background-color:transparent!important;color:var(--content-disabled-default, #4f88d9)!important;cursor:not-allowed}._inverted_1o6wc_352._disabled_1o6wc_91 ._placeholder_1o6wc_99{color:var(--content-disabled-default, #4f88d9)!important}._label_inverted_disabled_1o6wc_477{color:var(--Content-Neutral-Default-Active, #fff)}._helperText_inverted_disabled_1o6wc_481{color:var(--Content-Neutral-Default-Default, #fafafa)}._icon_inverted_disabled_1o6wc_485,._inverted_1o6wc_352._disabled_1o6wc_91 ._chevron_1o6wc_112{color:var(--content-disabled-default, #4f88d9)!important}._inverted_1o6wc_352._disabled_1o6wc_91:focus,._inverted_1o6wc_352._disabled_1o6wc_91:active,._inverted_1o6wc_352._disabled_1o6wc_91._open_1o6wc_87{box-shadow:none!important}._inverted_1o6wc_352._disabled_1o6wc_91._error_1o6wc_147{border:1px solid var(--Stroke-Negative-Active, #ef4444)!important;color:var(--Content-Negative-Default-Active, #f87171)!important}._inverted_1o6wc_352._disabled_1o6wc_91._error_1o6wc_147:focus,._inverted_1o6wc_352._disabled_1o6wc_91._error_1o6wc_147:active,._inverted_1o6wc_352._disabled_1o6wc_91._error_1o6wc_147._open_1o6wc_87{box-shadow:0 0 0 3px var(--ui-red-400, #f87171)!important}._inverted_1o6wc_352._disabled_1o6wc_91._error_1o6wc_147 ._placeholder_1o6wc_99{color:var(--Content-Negative-Default-Active, #f87171)!important}
+._selectContainer_rm5cq_3{display:flex;flex-direction:column}._selectContainer_medium_rm5cq_9{gap:2px}._selectContainer_large_rm5cq_13,._selectContainer_extraLarge_rm5cq_14{gap:4px}._label_rm5cq_18{font-family:Poppins Regular;font-size:13px;color:var(--Content-Neutral-Default-Active, #000);font-weight:500;padding-left:4px}._label_large_rm5cq_26,._label_extraLarge_rm5cq_27{font-size:15px}._label_disabled_rm5cq_31{color:var(--content-disabled-default, #cbd5e1)}._selectWrapper_rm5cq_35{position:relative;display:flex;align-items:center}._select_rm5cq_3{border:1px solid #ddd;font-family:Poppins Regular;font-weight:100;outline:none;border-radius:16px;transition:all .2s ease;width:100%;background-color:#fff;cursor:pointer;display:flex;align-items:center;justify-content:space-between;padding-right:12px}._select_rm5cq_3._medium_rm5cq_57,._select_rm5cq_3._small_rm5cq_58{border-radius:14px}._select_rm5cq_3:hover{border:1px solid var(--Stroke-Neutral-Primary, #94a3b8)}._select_rm5cq_3:focus{box-shadow:0 0 0 3px var(--ui-blue-400, #7eaae6)}._select_rm5cq_3:active{border:1px solid var(--Stroke-Neutral-Primary, #94a3b8);box-shadow:0 0 0 3px var(--ui-blue-400, #7eaae6)}._select_rm5cq_3._btc_rm5cq_76:active,._select_rm5cq_3._btc_rm5cq_76:focus{border:1px solid #45c2d6;box-shadow:3px 3px 0 0 var(--Complementarios-Turquesa-Compl-2-Turquesa, #45c2d6)}._select_rm5cq_3._open_rm5cq_87{border:1px solid #94a3b8}._select_rm5cq_3._disabled_rm5cq_91{border-radius:16px;border:1px solid var(--Stroke-Disabled-Default, #cbd5e1);background:var(--Fill-Disabled-Default, #f8fafc);color:var(--content-disabled-default, #cbd5e1);cursor:not-allowed}._select_rm5cq_3._disabled_rm5cq_91 ._placeholder_rm5cq_99{color:var(--content-disabled-default, #cbd5e1)}._selectValue_rm5cq_103{flex:1;text-align:left}._placeholder_rm5cq_99{color:var(--Content-Neutral-Default-Default, #a3a3a3)}._chevron_rm5cq_112{transition:transform .2s ease;color:var(--Content-Neutral-Default, #475569)}._chevronOpen_rm5cq_117{transform:rotate(180deg)}._small_rm5cq_58{height:30px;padding-inline:8px;font-size:12px}._medium_rm5cq_57{height:36px;padding-inline:10px;font-size:14px}._large_rm5cq_134{padding-inline:12px;height:42px;font-size:15px}._extraLarge_rm5cq_140{padding-inline:14px;height:48px;font-size:16px}._error_rm5cq_147{border:1px solid var(--Stroke-Negative-Active, #dc2626);background:var(--Fill-Neutral-Primary, #fff);color:var(--Content-Negative-Default-Active, #dc2626);animation:_errorShake_rm5cq_1 .4s ease-in-out}._error_rm5cq_147 ._placeholder_rm5cq_99{color:var(--Content-Negative-Default-Active, #dc2626)}._error_rm5cq_147:hover{border:1px solid var(--Stroke-Negative-Active, #dc2626)}._error_rm5cq_147:active{border:1px solid transparent;box-shadow:0 0 0 3px var(--ui-red-400, #f87171)}._error_rm5cq_147:focus{border:1px solid transparent;box-shadow:0 0 0 3px var(--ui-red-400, #f87171)}._error_rm5cq_147._btc_rm5cq_76::placeholder{color:#dc2626}._error_rm5cq_147._btc_rm5cq_76:active,._error_rm5cq_147._btc_rm5cq_76:focus{border:1px solid #dc2626;box-shadow:3px 3px #dc2626}._error_rm5cq_147._open_rm5cq_87{border:1px solid #dc2626}._errorMessage_rm5cq_187{font-family:Poppins Medium;color:#e74c3c;margin-left:4px;animation:_errorMessageSlide_rm5cq_1 .3s ease-out;transform-origin:top}._errorMessage_medium_rm5cq_195,._errorMessage_small_rm5cq_196{font-size:11px}._errorMessage_large_rm5cq_200,._errorMessage_extraLarge_rm5cq_201{font-size:13px}._errorMessage_inverted_rm5cq_205{color:var(--Content-Negative-Default-Active, #f87171)!important}._helperText_rm5cq_209{font-family:Poppins Regular;color:#acacac;margin-left:4px}._helperText_medium_rm5cq_215,._helperText_small_rm5cq_216{font-size:11px}._helperText_large_rm5cq_220,._helperText_extraLarge_rm5cq_221{font-size:13px}._helperText_disabled_rm5cq_225{color:var(--content-disabled-default, #cbd5e1)}._iconLabel_rm5cq_229{display:flex;justify-content:center;align-items:center;gap:6px}._icon_rm5cq_229{color:var(--Content-Neutral-Default, #475569);pointer-events:none;display:flex;align-items:center;justify-content:center}._icon_disabled_rm5cq_245{color:var(--Content-Neutral-Disabled, #94a3b8)}._required_rm5cq_250{color:var(--Content-Negative-Default-Active, #dc2626);margin-left:2px}._required_inverted_rm5cq_255{color:var(--Content-Negative-Default-Active, #f87171)}._required_disabled_rm5cq_259{color:var(--content-disabled-default, #cbd5e1)}._required_inverted_disabled_rm5cq_263{color:var(--content-disabled-default, #4f88d9)}._dropdown_rm5cq_268{position:absolute;top:100%;left:0;right:0;z-index:1000;background:#fff;border:1px solid var(--Stroke-Neutral-Primary, #94a3b8);border-radius:16px;margin-top:10px;max-height:200px;overflow-y:auto}._dropdownPortal_rm5cq_282{position:fixed;top:0;left:0;right:auto;z-index:9999}._option_rm5cq_290{padding:8px 12px;border-bottom:1px solid var(--Stroke-Neutral-Primary, #94a3b8);cursor:pointer;font-family:Poppins Regular;font-size:inherit;display:flex;align-items:center;gap:8px;transition:background-color .2s ease}._option_rm5cq_290:last-child{border-bottom:none}._dropdown_rm5cq_268 ._option_rm5cq_290{font-size:14px;padding:8px 12px}._small_rm5cq_58+._dropdown_rm5cq_268 ._option_rm5cq_290{font-size:12px;padding:8px 11px 8px 14px}._medium_rm5cq_57+._dropdown_rm5cq_268 ._option_rm5cq_290{font-size:14px;padding:8px 12px}._large_rm5cq_134+._dropdown_rm5cq_268 ._option_rm5cq_290{font-size:15px;padding:11px 12px}._extraLarge_rm5cq_140+._dropdown_rm5cq_268 ._option_rm5cq_290{font-size:16px;padding:11px 12px}._option_rm5cq_290:not(._optionSelected_rm5cq_334):hover{background-color:#f8f9fa}._option_rm5cq_290:first-child{border-top-left-radius:16px;border-top-right-radius:16px}._option_rm5cq_290:last-child{border-bottom-left-radius:16px;border-bottom-right-radius:16px}._optionSelected_rm5cq_334{background-color:#f0f0f0;color:#000}._optionIcon_rm5cq_353{display:flex;align-items:center;justify-content:center}._inverted_rm5cq_360{border:1px solid var(--Stroke-Neutral-Secondary, #c9e1f6);background-color:transparent!important;color:#fff!important}._inverted_rm5cq_360:hover{border:1px solid white!important}._inverted_rm5cq_360 ._placeholder_rm5cq_99{color:#ffffffb3!important}._inverted_rm5cq_360 ._chevron_rm5cq_112,._label_inverted_rm5cq_378{color:#fff!important}._helperText_inverted_rm5cq_382{color:var(--Content-Neutral-Default-Default, #fafafa)}._icon_inverted_rm5cq_386{color:#fff!important}._dropdown_inverted_rm5cq_390{background:var(--Fill-Brand-Default-Active, #2054a5);border:1px solid var(--Stroke-Neutral-Primary, #e0e9f8)}._option_inverted_rm5cq_395{color:#fff!important;border-bottom-color:1px solid var(--Stroke-Neutral-Primary, #e0e9f8)}._option_inverted_rm5cq_395:hover{background-color:#ffffff1a!important}._option_inverted_rm5cq_395._optionSelected_rm5cq_334{background-color:#ffffff26!important;color:#fff!important}._inverted_rm5cq_360._error_rm5cq_147{border:1px solid var(--Stroke-Negative-Active, #ef4444)!important;color:var(--Content-Negative-Default-Active, #f87171)!important}._inverted_rm5cq_360._error_rm5cq_147 ._placeholder_rm5cq_99{color:var(--Content-Negative-Default-Active, #f87171)!important}._inverted_rm5cq_360._error_rm5cq_147:hover{border:1px solid var(--Stroke-Negative-Active, #ef4444)!important}._inverted_rm5cq_360._error_rm5cq_147:active{border:1px solid transparent!important;box-shadow:0 0 0 3px var(--ui-red-400, #f87171)!important}._inverted_rm5cq_360._error_rm5cq_147:focus{border:1px solid transparent!important;box-shadow:0 0 0 3px var(--ui-red-400, #f87171)!important}._inverted_rm5cq_360._error_rm5cq_147._open_rm5cq_87{border:1px solid transparent!important}._dropdownTable_rm5cq_438{max-height:400px;min-width:600px}._optionTable_rm5cq_443{display:flex;gap:16px;padding:12px 16px;align-items:flex-start;flex-direction:row}._tableColumn_rm5cq_451{flex:1;display:flex;flex-direction:column;gap:2px;min-width:0}._columnHeader_rm5cq_459{font-family:Poppins Regular;font-size:13px;opacity:.6;font-weight:400;text-transform:none;overflow:hidden;text-overflow:ellipsis;white-space:nowrap}._columnValue_rm5cq_470{font-family:Poppins Regular;font-size:15px;color:var(--Content-Neutral-Default-Active, #000);font-weight:400;overflow:hidden;text-overflow:ellipsis;white-space:nowrap}._optionTable_rm5cq_443._optionSelected_rm5cq_334 ._columnValue_rm5cq_470{color:#000}@keyframes _errorShake_rm5cq_1{0%,to{transform:translate(0)}10%,30%,50%,70%,90%{transform:translate(-2px)}20%,40%,60%,80%{transform:translate(2px)}}@keyframes _errorMessageSlide_rm5cq_1{0%{opacity:0;transform:translateY(-5px) scaleY(0)}50%{opacity:.8;transform:translateY(-2px) scaleY(.7)}to{opacity:1;transform:translateY(0) scaleY(1)}}._inverted_rm5cq_360._disabled_rm5cq_91{border:1px solid var(--Stroke-Disabled-Default, #1b468a)!important;background-color:transparent!important;color:var(--content-disabled-default, #4f88d9)!important;cursor:not-allowed}._inverted_rm5cq_360._disabled_rm5cq_91 ._placeholder_rm5cq_99{color:var(--content-disabled-default, #4f88d9)!important}._label_inverted_disabled_rm5cq_532{color:var(--Content-Neutral-Default-Active, #fff)}._helperText_inverted_disabled_rm5cq_536{color:var(--Content-Neutral-Default-Default, #fafafa)}._icon_inverted_disabled_rm5cq_540,._inverted_rm5cq_360._disabled_rm5cq_91 ._chevron_rm5cq_112{color:var(--content-disabled-default, #4f88d9)!important}._inverted_rm5cq_360._disabled_rm5cq_91:focus,._inverted_rm5cq_360._disabled_rm5cq_91:active,._inverted_rm5cq_360._disabled_rm5cq_91._open_rm5cq_87{box-shadow:none!important}._inverted_rm5cq_360._disabled_rm5cq_91._error_rm5cq_147{border:1px solid var(--Stroke-Negative-Active, #ef4444)!important;color:var(--Content-Negative-Default-Active, #f87171)!important}._inverted_rm5cq_360._disabled_rm5cq_91._error_rm5cq_147:focus,._inverted_rm5cq_360._disabled_rm5cq_91._error_rm5cq_147:active,._inverted_rm5cq_360._disabled_rm5cq_91._error_rm5cq_147._open_rm5cq_87{box-shadow:0 0 0 3px var(--ui-red-400, #f87171)!important}._inverted_rm5cq_360._disabled_rm5cq_91._error_rm5cq_147 ._placeholder_rm5cq_99{color:var(--Content-Negative-Default-Active, #f87171)!important}

package/dist/components/Select/Select.d.ts

@@ -6,6 +6,7 @@ export interface SelectOption {
     value: string;
     label: string;
     icon?: IconName;
+    columns?: Record<string, string | number>;
 }
 export interface SelectProps extends Omit<React.HTMLAttributes<HTMLDivElement>, "onChange" | "value"> {
     size?: SelectSize;
@@ -23,5 +24,6 @@ export interface SelectProps extends Omit<React.HTMLAttributes<HTMLDivElement>,
     showPlaceholderIcon?: boolean;
     required?: boolean;
     btc?: boolean;
+    columnHeaders?: Record<string, string>;
 }
 export declare const Select: React.FC<SelectProps>;

package/dist/components/Select/Select.js

@@ -1,193 +1,234 @@
-import { jsxs as n, jsx as t } from "react/jsx-runtime";
-import { useState as O, useRef as V, useEffect as W } from "react";
-import { Icon as g } from "../../icons/Icon.js";
-import '../../assets/Select.css';const j = "_selectContainer_1o6wc_3", E = "_selectContainer_medium_1o6wc_9", R = "_selectContainer_large_1o6wc_13", y = "_selectContainer_extraLarge_1o6wc_14", A = "_label_1o6wc_18", B = "_label_large_1o6wc_26", D = "_label_extraLarge_1o6wc_27", F = "_label_disabled_1o6wc_31", G = "_selectWrapper_1o6wc_35", H = "_select_1o6wc_3", J = "_medium_1o6wc_57", K = "_small_1o6wc_58", P = "_btc_1o6wc_76", Q = "_open_1o6wc_87", U = "_disabled_1o6wc_91", X = "_placeholder_1o6wc_99", Y = "_selectValue_1o6wc_103", Z = "_chevron_1o6wc_112", z = "_chevronOpen_1o6wc_117", ee = "_large_1o6wc_134", re = "_extraLarge_1o6wc_140", _e = "_error_1o6wc_147", oe = "_errorShake_1o6wc_1", le = "_errorMessage_1o6wc_187", te = "_errorMessageSlide_1o6wc_1", ce = "_errorMessage_medium_1o6wc_195", ne = "_errorMessage_small_1o6wc_196", ae = "_errorMessage_large_1o6wc_200", se = "_errorMessage_extraLarge_1o6wc_201", ie = "_errorMessage_inverted_1o6wc_205", de = "_helperText_1o6wc_209", pe = "_helperText_medium_1o6wc_215", we = "_helperText_small_1o6wc_216", ge = "_helperText_large_1o6wc_220", me = "_helperText_extraLarge_1o6wc_221", he = "_helperText_disabled_1o6wc_225", be = "_iconLabel_1o6wc_229", ve = "_icon_1o6wc_229", ue = "_icon_disabled_1o6wc_245", xe = "_required_1o6wc_250", $e = "_required_inverted_1o6wc_255", Te = "_required_disabled_1o6wc_259", Le = "_required_inverted_disabled_1o6wc_263", Me = "_dropdown_1o6wc_268", fe = "_option_1o6wc_282", Ce = "_optionSelected_1o6wc_326", qe = "_optionIcon_1o6wc_345", Ne = "_inverted_1o6wc_352", Se = "_label_inverted_1o6wc_370", ke = "_helperText_inverted_1o6wc_374", Ie = "_icon_inverted_1o6wc_378", Oe = "_dropdown_inverted_1o6wc_382", Ve = "_option_inverted_1o6wc_387", We = "_label_inverted_disabled_1o6wc_477", je = "_helperText_inverted_disabled_1o6wc_481", Ee = "_icon_inverted_disabled_1o6wc_485", e = {
-  selectContainer: j,
-  selectContainer_medium: E,
-  selectContainer_large: R,
-  selectContainer_extraLarge: y,
-  label: A,
-  label_large: B,
-  label_extraLarge: D,
-  label_disabled: F,
-  selectWrapper: G,
-  select: H,
-  medium: J,
-  small: K,
-  btc: P,
-  open: Q,
-  disabled: U,
-  placeholder: X,
-  selectValue: Y,
-  chevron: Z,
-  chevronOpen: z,
-  large: ee,
-  extraLarge: re,
-  error: _e,
-  errorShake: oe,
-  errorMessage: le,
-  errorMessageSlide: te,
-  errorMessage_medium: ce,
-  errorMessage_small: ne,
-  errorMessage_large: ae,
-  errorMessage_extraLarge: se,
-  errorMessage_inverted: ie,
-  helperText: de,
-  helperText_medium: pe,
+import { jsxs as s, jsx as l, Fragment as N } from "react/jsx-runtime";
+import { useState as S, useRef as x, useEffect as E } from "react";
+import { r as A } from "../../index-CGDUIzcq.js";
+import { Icon as $ } from "../../icons/Icon.js";
+import '../../assets/Select.css';const F = "_selectContainer_rm5cq_3", G = "_selectContainer_medium_rm5cq_9", J = "_selectContainer_large_rm5cq_13", K = "_selectContainer_extraLarge_rm5cq_14", Q = "_label_rm5cq_18", U = "_label_large_rm5cq_26", X = "_label_extraLarge_rm5cq_27", Y = "_label_disabled_rm5cq_31", Z = "_selectWrapper_rm5cq_35", z = "_select_rm5cq_3", ee = "_medium_rm5cq_57", re = "_small_rm5cq_58", ne = "_btc_rm5cq_76", te = "_open_rm5cq_87", le = "_disabled_rm5cq_91", _e = "_placeholder_rm5cq_99", oe = "_selectValue_rm5cq_103", ce = "_chevron_rm5cq_112", ae = "_chevronOpen_rm5cq_117", se = "_large_rm5cq_134", de = "_extraLarge_rm5cq_140", ie = "_error_rm5cq_147", me = "_errorShake_rm5cq_1", pe = "_errorMessage_rm5cq_187", ue = "_errorMessageSlide_rm5cq_1", he = "_errorMessage_medium_rm5cq_195", qe = "_errorMessage_small_rm5cq_196", ge = "_errorMessage_large_rm5cq_200", be = "_errorMessage_extraLarge_rm5cq_201", ve = "_errorMessage_inverted_rm5cq_205", xe = "_helperText_rm5cq_209", $e = "_helperText_medium_rm5cq_215", we = "_helperText_small_rm5cq_216", Te = "_helperText_large_rm5cq_220", fe = "_helperText_extraLarge_rm5cq_221", Le = "_helperText_disabled_rm5cq_225", Ce = "_iconLabel_rm5cq_229", Me = "_icon_rm5cq_229", Ne = "_icon_disabled_rm5cq_245", Se = "_required_rm5cq_250", Ee = "_required_inverted_rm5cq_255", Oe = "_required_disabled_rm5cq_259", Pe = "_required_inverted_disabled_rm5cq_263", Ve = "_dropdown_rm5cq_268", Ie = "_dropdownPortal_rm5cq_282", ke = "_option_rm5cq_290", Re = "_optionSelected_rm5cq_334", We = "_optionIcon_rm5cq_353", je = "_inverted_rm5cq_360", De = "_label_inverted_rm5cq_378", ye = "_helperText_inverted_rm5cq_382", Be = "_icon_inverted_rm5cq_386", He = "_dropdown_inverted_rm5cq_390", Ae = "_option_inverted_rm5cq_395", Fe = "_dropdownTable_rm5cq_438", Ge = "_optionTable_rm5cq_443", Je = "_tableColumn_rm5cq_451", Ke = "_columnHeader_rm5cq_459", Qe = "_columnValue_rm5cq_470", Ue = "_label_inverted_disabled_rm5cq_532", Xe = "_helperText_inverted_disabled_rm5cq_536", Ye = "_icon_inverted_disabled_rm5cq_540", e = {
+  selectContainer: F,
+  selectContainer_medium: G,
+  selectContainer_large: J,
+  selectContainer_extraLarge: K,
+  label: Q,
+  label_large: U,
+  label_extraLarge: X,
+  label_disabled: Y,
+  selectWrapper: Z,
+  select: z,
+  medium: ee,
+  small: re,
+  btc: ne,
+  open: te,
+  disabled: le,
+  placeholder: _e,
+  selectValue: oe,
+  chevron: ce,
+  chevronOpen: ae,
+  large: se,
+  extraLarge: de,
+  error: ie,
+  errorShake: me,
+  errorMessage: pe,
+  errorMessageSlide: ue,
+  errorMessage_medium: he,
+  errorMessage_small: qe,
+  errorMessage_large: ge,
+  errorMessage_extraLarge: be,
+  errorMessage_inverted: ve,
+  helperText: xe,
+  helperText_medium: $e,
   helperText_small: we,
-  helperText_large: ge,
-  helperText_extraLarge: me,
-  helperText_disabled: he,
-  iconLabel: be,
-  icon: ve,
-  icon_disabled: ue,
-  required: xe,
-  required_inverted: $e,
-  required_disabled: Te,
-  required_inverted_disabled: Le,
-  dropdown: Me,
-  option: fe,
-  optionSelected: Ce,
-  optionIcon: qe,
-  inverted: Ne,
-  label_inverted: Se,
-  helperText_inverted: ke,
-  icon_inverted: Ie,
-  dropdown_inverted: Oe,
-  option_inverted: Ve,
-  label_inverted_disabled: We,
-  helperText_inverted_disabled: je,
-  icon_inverted_disabled: Ee
-}, Be = ({
-  size: l = "medium",
-  label: m,
-  error: a,
-  helperText: h,
-  icon: d,
-  className: $,
-  required: T,
-  placeholder: L = "Seleccionar...",
-  options: b = [],
-  value: v,
-  onChange: u,
-  disabled: _ = !1,
-  inverted: r = !1,
-  dynamicIcon: M = !1,
-  showPlaceholderIcon: f = !1,
-  btc: C = !1,
-  ...q
+  helperText_large: Te,
+  helperText_extraLarge: fe,
+  helperText_disabled: Le,
+  iconLabel: Ce,
+  icon: Me,
+  icon_disabled: Ne,
+  required: Se,
+  required_inverted: Ee,
+  required_disabled: Oe,
+  required_inverted_disabled: Pe,
+  dropdown: Ve,
+  dropdownPortal: Ie,
+  option: ke,
+  optionSelected: Re,
+  optionIcon: We,
+  inverted: je,
+  label_inverted: De,
+  helperText_inverted: ye,
+  icon_inverted: Be,
+  dropdown_inverted: He,
+  option_inverted: Ae,
+  dropdownTable: Fe,
+  optionTable: Ge,
+  tableColumn: Je,
+  columnHeader: Ke,
+  columnValue: Qe,
+  label_inverted_disabled: Ue,
+  helperText_inverted_disabled: Xe,
+  icon_inverted_disabled: Ye
+}, nr = ({
+  size: _ = "medium",
+  label: w,
+  error: d,
+  helperText: T,
+  icon: p,
+  className: O,
+  required: P,
+  placeholder: V = "Seleccionar...",
+  options: f = [],
+  value: L,
+  onChange: C,
+  disabled: t = !1,
+  inverted: n = !1,
+  dynamicIcon: I = !1,
+  showPlaceholderIcon: k = !1,
+  btc: R = !1,
+  columnHeaders: u,
+  ...W
 }) => {
-  const [s, p] = O(!1), w = V(null), c = b.find((o) => o.value === v);
-  W(() => {
-    const o = (I) => {
-      w.current && !w.current.contains(I.target) && p(!1);
+  const [o, h] = S(!1), [i, j] = S(null), q = x(null), g = x(null), b = x(null), a = f.find((r) => r.value === L), v = () => {
+    if (g.current) {
+      const r = g.current.getBoundingClientRect();
+      j({
+        top: r.bottom + 10,
+        left: r.left,
+        width: r.width
+      });
+    }
+  };
+  E(() => {
+    const r = (c) => {
+      q.current && !q.current.contains(c.target) && b.current && !b.current.contains(c.target) && h(!1);
     };
-    return document.addEventListener("mousedown", o), () => {
-      document.removeEventListener("mousedown", o);
+    return document.addEventListener("mousedown", r), () => {
+      document.removeEventListener("mousedown", r);
     };
-  }, []);
-  const N = [
+  }, []), E(() => {
+    if (o) {
+      v();
+      const r = () => {
+        o && v();
+      }, c = () => {
+        o && v();
+      };
+      return window.addEventListener("scroll", r, !0), window.addEventListener("resize", c), () => {
+        window.removeEventListener("scroll", r, !0), window.removeEventListener("resize", c);
+      };
+    }
+  }, [o]);
+  const D = [
     e.select,
-    C && e.btc,
-    e[l],
-    a ? e.error : "",
-    _ ? e.disabled : "",
-    s ? e.open : "",
-    r ? e.inverted : "",
-    $
-  ].filter(Boolean).join(" "), i = l === "small" ? 16 : l === "large" ? 20 : l === "extraLarge" ? 24 : 18, x = M && (c != null && c.icon) ? c.icon : d, S = () => {
-    _ || p(!s);
-  }, k = (o) => {
-    u && u(o), p(!1);
+    R && e.btc,
+    e[_],
+    d ? e.error : "",
+    t ? e.disabled : "",
+    o ? e.open : "",
+    n ? e.inverted : "",
+    O
+  ].filter(Boolean).join(" "), m = _ === "small" ? 16 : _ === "large" ? 20 : _ === "extraLarge" ? 24 : 18, M = I && (a != null && a.icon) ? a.icon : p, y = () => {
+    t || h(!o);
+  }, B = (r) => {
+    C && C(r), h(!1);
   };
-  return /* @__PURE__ */ n(
+  return /* @__PURE__ */ s(
     "div",
     {
-      className: `${e.selectContainer} ${l === "medium" ? e.selectContainer_medium : l === "large" ? e.selectContainer_large : l === "extraLarge" ? e.selectContainer_extraLarge : ""}`,
-      ...q,
+      className: `${e.selectContainer} ${_ === "medium" ? e.selectContainer_medium : _ === "large" ? e.selectContainer_large : _ === "extraLarge" ? e.selectContainer_extraLarge : ""}`,
+      ...W,
       children: [
-        m && /* @__PURE__ */ n(
+        w && /* @__PURE__ */ s(
           "label",
           {
-            className: `${e.label} ${l === "large" ? e.label_large : ""} ${l === "extraLarge" ? e.label_extraLarge : ""} ${_ && !r ? e.label_disabled : ""} ${r && !_ ? e.label_inverted : ""} ${r && _ ? e.label_inverted_disabled : ""}`,
+            className: `${e.label} ${_ === "large" ? e.label_large : ""} ${_ === "extraLarge" ? e.label_extraLarge : ""} ${t && !n ? e.label_disabled : ""} ${n && !t ? e.label_inverted : ""} ${n && t ? e.label_inverted_disabled : ""}`,
             children: [
-              m,
-              /* @__PURE__ */ t(
+              w,
+              /* @__PURE__ */ l(
                 "span",
                 {
-                  className: `${e.required} ${_ && !r ? e.required_disabled : ""} ${r && !_ ? e.required_inverted : ""} ${r && _ ? e.required_inverted_disabled : ""}`,
-                  children: T && "*"
+                  className: `${e.required} ${t && !n ? e.required_disabled : ""} ${n && !t ? e.required_inverted : ""} ${n && t ? e.required_inverted_disabled : ""}`,
+                  children: P && "*"
                 }
               )
             ]
           }
         ),
-        /* @__PURE__ */ n("div", { className: e.selectWrapper, ref: w, children: [
-          /* @__PURE__ */ n("div", { className: N, onClick: S, children: [
-            /* @__PURE__ */ n("div", { className: e.iconLabel, children: [
-              x && f && /* @__PURE__ */ t(
+        /* @__PURE__ */ s("div", { className: e.selectWrapper, ref: g, children: [
+          /* @__PURE__ */ s("div", { className: D, onClick: y, ref: q, children: [
+            /* @__PURE__ */ s("div", { className: e.iconLabel, children: [
+              M && k && /* @__PURE__ */ l(
                 "div",
                 {
-                  className: `${e.icon} ${_ && !r ? e.icon_disabled : ""} ${r && !_ ? e.icon_inverted : ""} ${r && _ ? e.icon_inverted_disabled : ""}`,
-                  children: /* @__PURE__ */ t(g, { name: x, width: i, height: i })
+                  className: `${e.icon} ${t && !n ? e.icon_disabled : ""} ${n && !t ? e.icon_inverted : ""} ${n && t ? e.icon_inverted_disabled : ""}`,
+                  children: /* @__PURE__ */ l($, { name: M, width: m, height: m })
                 }
               ),
-              /* @__PURE__ */ t(
+              /* @__PURE__ */ l(
                 "span",
                 {
-                  className: `${e.selectValue} ${c ? "" : e.placeholder}`,
-                  children: c ? c.label : L
+                  className: `${e.selectValue} ${a ? "" : e.placeholder}`,
+                  children: a ? a.label : V
                 }
               )
             ] }),
-            /* @__PURE__ */ t(
-              g,
+            /* @__PURE__ */ l(
+              $,
               {
                 name: "ArrowDown",
                 width: 16,
                 height: 16,
-                className: `${e.chevron} ${s ? e.chevronOpen : ""}`
+                className: `${e.chevron} ${o ? e.chevronOpen : ""}`
               }
             )
           ] }),
-          s && !_ && /* @__PURE__ */ t(
-            "div",
-            {
-              className: `${e.dropdown} ${r ? e.dropdown_inverted : ""}`,
-              children: b.map((o) => /* @__PURE__ */ n(
-                "div",
-                {
-                  className: `${e.option} ${v === o.value ? e.optionSelected : ""} ${r ? e.option_inverted : ""}`,
-                  onClick: () => k(o.value),
-                  children: [
-                    (o.icon || d) && /* @__PURE__ */ t("div", { className: e.optionIcon, children: /* @__PURE__ */ t(
-                      g,
-                      {
-                        name: o.icon || d,
-                        width: i,
-                        height: i
-                      }
-                    ) }),
-                    o.label
-                  ]
+          o && !t && i && A.createPortal(
+            /* @__PURE__ */ l(
+              "div",
+              {
+                ref: b,
+                className: `${e.dropdown} ${e.dropdownPortal} ${n ? e.dropdown_inverted : ""} ${u ? e.dropdownTable : ""}`,
+                style: {
+                  top: `${i.top}px`,
+                  left: `${i.left}px`,
+                  width: `${i.width}px`
                 },
-                o.value
-              ))
-            }
+                children: f.map((r) => /* @__PURE__ */ l(
+                  "div",
+                  {
+                    className: `${e.option} ${L === r.value ? e.optionSelected : ""} ${n ? e.option_inverted : ""} ${r.columns ? e.optionTable : ""}`,
+                    onClick: () => B(r.value),
+                    children: r.columns ? /* @__PURE__ */ l(N, { children: u && Object.entries(u).map(([c, H]) => /* @__PURE__ */ s("div", { className: e.tableColumn, children: [
+                      /* @__PURE__ */ l("div", { className: e.columnHeader, children: H }),
+                      /* @__PURE__ */ l("div", { className: e.columnValue, children: r.columns[c] || "" })
+                    ] }, c)) }) : /* @__PURE__ */ s(N, { children: [
+                      (r.icon || p) && /* @__PURE__ */ l("div", { className: e.optionIcon, children: /* @__PURE__ */ l(
+                        $,
+                        {
+                          name: r.icon || p,
+                          width: m,
+                          height: m
+                        }
+                      ) }),
+                      r.label
+                    ] })
+                  },
+                  r.value
+                ))
+              }
+            ),
+            document.body
           )
         ] }),
-        a && /* @__PURE__ */ t(
+        d && /* @__PURE__ */ l(
           "span",
           {
-            className: `${e.errorMessage} ${e[`errorMessage_${l}`]} ${r ? e.errorMessage_inverted : ""}`,
-            children: a
+            className: `${e.errorMessage} ${e[`errorMessage_${_}`]} ${n ? e.errorMessage_inverted : ""}`,
+            children: d
           }
         ),
-        h && !a && /* @__PURE__ */ t(
+        T && !d && /* @__PURE__ */ l(
           "span",
           {
-            className: `${e.helperText} ${e[`helperText_${l}`]} ${_ && !r ? e.helperText_disabled : ""} ${r && !_ ? e.helperText_inverted : ""} ${r && _ ? e.helperText_inverted_disabled : ""}`,
-            children: h
+            className: `${e.helperText} ${e[`helperText_${_}`]} ${t && !n ? e.helperText_disabled : ""} ${n && !t ? e.helperText_inverted : ""} ${n && t ? e.helperText_inverted_disabled : ""}`,
+            children: T
           }
         )
       ]
@@ -195,5 +236,5 @@ import '../../assets/Select.css';const j = "_selectContainer_1o6wc_3", E = "_sel
   );
 };
 export {
-  Be as Select
+  nr as Select
 };

package/package.json

@@ -1,7 +1,7 @@
 {
   "name": "bmi-next-brokers",
   "description": "Componentes de UI para proyecto BMI Next Brokers",
-  "version": "1.3.1",
+  "version": "1.3.3",
   "author": "BMI Ahorro España",
   "contributors": [
     "José Ramón Jiménez <jrjimenez@bmicos.com>",