dhre-component-lib 0.8.31 → 0.8.32

This diff represents the content of publicly available package versions that have been released to one of the supported registries. The information contained in this diff is provided for informational purposes only and reflects changes between package versions as they appear in their respective public registries.
package/dist/index.esm.js CHANGED
@@ -22126,7 +22126,7 @@ const Tabs = ({ tabs, onTabChange, selectedTabValue, dot, wrapperClassName }) =>
22126
22126
  React__default.createElement("div", { className: "counts" }, tab?.count))))))));
22127
22127
  };
22128
22128
 
22129
- var css$9 = ".dropdown {\n width: 100%;\n border: 0.0625rem solid #686868;\n height: 3.5rem;\n border-radius: var(--border-radius-small);\n display: flex;\n flex-direction: row;\n justify-content: space-between;\n align-items: center;\n padding: 1rem;\n position: relative;\n cursor: pointer;\n z-index: 1;\n}\n\n.astreik {\n color: #eb0542;\n}\n\n.dropdownLabel {\n position: absolute;\n z-index: 2;\n top: -10px;\n inset-inline-start: 11px;\n background: #ffffff;\n padding: 0 6px;\n transition: all 0.3s ease-out;\n color: var(--content-primary);\n}\n\n.placeholder {\n color: #686868;\n}\n\n.dropPosition {\n position: relative;\n}\n\n.zIndexProp {\n z-index: 0;\n}\n\n.dropdownValues {\n border: 0.0625rem solid #e1e1e1;\n box-shadow: 0px 0.25rem 0.5rem 0px rgba(0, 0, 0, 0.2509803922);\n border-radius: var(--border-radius);\n margin-top: 0.3125rem;\n position: absolute;\n width: 100%;\n z-index: 9;\n max-height: 30vh;\n overflow-y: auto;\n}\n\n.dropdownSearchContainer {\n background: #ffffff;\n padding: 0.75rem;\n border-bottom: 0.0625rem solid #e1e1e1;\n display: flex;\n align-items: center;\n gap: 0.5rem;\n}\n\n.dropdownSearchClear {\n cursor: pointer;\n display: flex;\n align-items: center;\n flex-shrink: 0;\n color: #686868;\n}\n\n.dropdownSearchInput {\n width: 100%;\n border: 0.0625rem solid #a7a7a7;\n border-radius: var(--border-radius-small);\n height: 2.5rem;\n padding: 0.5rem 0.75rem;\n outline: none;\n font-size: 1rem;\n font-family: var(--brand-font-family);\n color: var(--content-primary);\n background: #ffffff;\n box-sizing: border-box;\n}\n\n.dropdownSearchInput::placeholder {\n color: #686868;\n}\n\n.dropdownSearchInput:focus {\n border-color: var(--content-primary);\n}\n\n.noDropdownResult {\n display: block;\n background: #ffffff;\n min-height: 3.24rem;\n padding: 1rem;\n color: #686868;\n}\n\n.unselectedText {\n background: #ffffff;\n min-height: 3.24rem;\n padding: 1rem;\n color: #686868;\n cursor: pointer;\n}\n\n.value {\n color: var(--content-primary);\n}\n\n.unselectedText:hover {\n background: #e1e1e1;\n color: #000000;\n font-weight: 700 !important;\n}\n\n.backdropDropdown {\n position: fixed;\n width: 100%;\n height: 100%;\n top: 0;\n left: 0;\n z-index: 4;\n}\n\n.dropdown select {\n background: transparent;\n width: 10.625rem;\n padding: 0.5rem;\n border: 0;\n border-radius: 0;\n height: 2.1875rem;\n}\n\n.bold {\n font-weight: 700;\n}";
22129
+ var css$9 = ".dropdown {\n width: 100%;\n border: 0.0625rem solid #686868;\n height: 3.5rem;\n border-radius: var(--border-radius-small);\n display: flex;\n flex-direction: row;\n justify-content: space-between;\n align-items: center;\n padding: 1rem;\n position: relative;\n cursor: pointer;\n z-index: 1;\n}\n\n.astreik {\n color: #eb0542;\n}\n\n.dropdownLabel {\n position: absolute;\n z-index: 2;\n top: -10px;\n inset-inline-start: 11px;\n background: #ffffff;\n padding: 0 6px;\n transition: all 0.3s ease-out;\n color: var(--content-primary);\n}\n\n.placeholder {\n color: #686868;\n}\n\n.dropPosition {\n position: relative;\n}\n\n.zIndexProp {\n z-index: 0;\n}\n\n.dropdownValues {\n border: 0.0625rem solid #e1e1e1;\n box-shadow: 0px 0.25rem 0.5rem 0px rgba(0, 0, 0, 0.2509803922);\n border-radius: var(--border-radius);\n margin-top: 0.3125rem;\n position: absolute;\n width: 100%;\n z-index: 9;\n max-height: 30vh;\n overflow-y: auto;\n}\n\n.dropdownSearchContainer {\n background: #ffffff;\n padding: 0.75rem;\n border-bottom: 0.0625rem solid #e1e1e1;\n}\n\n.dropdownSearchField {\n position: relative;\n width: 100%;\n}\n\n.dropdownSearchClear {\n position: absolute;\n inset-inline-end: 0.75rem;\n top: 50%;\n transform: translateY(-50%);\n cursor: pointer;\n display: flex;\n align-items: center;\n color: #686868;\n}\n\n.dropdownSearchInput {\n width: 100%;\n border: 0.0625rem solid #a7a7a7;\n border-radius: var(--border-radius-small);\n height: 2.5rem;\n padding: 0.5rem 2.5rem 0.5rem 0.75rem;\n outline: none;\n font-size: 1rem;\n font-family: var(--brand-font-family);\n color: var(--content-primary);\n background: #ffffff;\n box-sizing: border-box;\n}\n\n.dropdownSearchInput::placeholder {\n color: #686868;\n}\n\n.dropdownSearchInput:focus {\n border-color: var(--content-primary);\n}\n\n.noDropdownResult {\n display: block;\n background: #ffffff;\n min-height: 3.24rem;\n padding: 1rem;\n color: #686868;\n}\n\n.unselectedText {\n background: #ffffff;\n min-height: 3.24rem;\n padding: 1rem;\n color: #686868;\n cursor: pointer;\n}\n\n.value {\n color: var(--content-primary);\n}\n\n.unselectedText:hover {\n background: #e1e1e1;\n color: #000000;\n font-weight: 700 !important;\n}\n\n.backdropDropdown {\n position: fixed;\n width: 100%;\n height: 100%;\n top: 0;\n left: 0;\n z-index: 4;\n}\n\n.dropdown select {\n background: transparent;\n width: 10.625rem;\n padding: 0.5rem;\n border: 0;\n border-radius: 0;\n height: 2.1875rem;\n}\n\n.bold {\n font-weight: 700;\n}";
22130
22130
  n(css$9,{});
22131
22131
 
22132
22132
  function Dropdown(props) {
@@ -22184,8 +22184,9 @@ function Dropdown(props) {
22184
22184
  openDropdown && React__default.createElement("div", null, arrowUp)),
22185
22185
  openDropdown && (React__default.createElement("div", { className: "dropdownValues" },
22186
22186
  isSearchable && (React__default.createElement("div", { className: "dropdownSearchContainer", onClick: (e) => e.stopPropagation() },
22187
- React__default.createElement("input", { type: "text", value: searchQuery, onChange: (e) => setSearchQuery(e.target.value), onClick: (e) => e.stopPropagation(), placeholder: searchPlaceholder, className: "dropdownSearchInput", autoFocus: true }),
22188
- searchQuery.length > 0 && (React__default.createElement("span", { className: "dropdownSearchClear", onClick: (e) => { e.stopPropagation(); setSearchQuery(""); } }, searchClearIcon ?? React__default.createElement("span", null, "\u2715"))))),
22187
+ React__default.createElement("div", { className: "dropdownSearchField" },
22188
+ React__default.createElement("input", { type: "text", value: searchQuery, onChange: (e) => setSearchQuery(e.target.value), onClick: (e) => e.stopPropagation(), placeholder: searchPlaceholder, className: "dropdownSearchInput", autoFocus: true }),
22189
+ searchQuery.length > 0 && (React__default.createElement("span", { className: "dropdownSearchClear", onClick: (e) => { e.stopPropagation(); setSearchQuery(""); } }, searchClearIcon ?? React__default.createElement("span", null, "\u2715")))))),
22189
22190
  filteredDropdownList.length === 0 && (React__default.createElement(Typography, { className: "noDropdownResult", variant: "B3", weight: "SEMI_BOLD" }, noResultsText)),
22190
22191
  filteredDropdownList?.map((val, index) => {
22191
22192
  const isSelected = selectedValue?.value === val?.value;