@paubox/ui 0.15.0 → 0.15.2

package/index.esm.js

@@ -22327,6 +22327,9 @@ var FilterRow = function(param) {
                             /*#__PURE__*/ jsx(Select, {
                                 name: "filters.".concat(filterKey, ".").concat(rowIndex, ".field"),
                                 placeholder: "Field",
+                                style: {
+                                    flex: 1
+                                },
                                 value: currentFilter.field,
                                 setValue: function(value) {
                                     return onChange("filters.".concat(filterKey, ".").concat(rowIndex, ".field"), value);
@@ -22342,6 +22345,9 @@ var FilterRow = function(param) {
                                 name: "filters.".concat(filterKey, ".").concat(rowIndex, ".op"),
                                 placeholder: "Operator",
                                 value: currentFilter.op,
+                                style: {
+                                    flex: 1
+                                },
                                 onChange: function(value) {
                                     return onChange("filters.".concat(filterKey, ".").concat(rowIndex, ".op"), value);
                                 },
@@ -24056,7 +24062,7 @@ function _templateObject1$a() {
 }
 function _templateObject2$8() {
     var data = _tagged_template_literal$f([
-        "\n  flex: 1;\n  cursor: pointer;\n  border: none;\n  background-color: transparent;\n\n  -webkit-appearance: none;\n  -moz-appearance: none;\n  &::-ms-expand {\n    display: none;\n  }\n  &::placeholder {\n    color: ",
+        "\n  flex: 1;\n  cursor: pointer;\n  border: none;\n  background-color: transparent;\n  z-index: 1;\n  -webkit-appearance: none;\n  -moz-appearance: none;\n  &::-ms-expand {\n    display: none;\n  }\n  &::placeholder {\n    color: ",
         ";\n  }\n  color: ",
         ";\n  padding: ",
         ";\n  padding-right: 2rem;\n  outline: none;\n  &::placeholder {\n    color: ",
@@ -24124,7 +24130,7 @@ var IconWrapper$1 = styled.div(_templateObject3$6(), function(param) {
 });
 var SelectOption = styled.option(_templateObject4$4(), $paragraph100Semibold, textSecondary);
 var Select = function(_param) {
-    var _param_sz = _param.sz, sz = _param_sz === void 0 ? 'sm' : _param_sz, _param_error = _param.error, error = _param_error === void 0 ? false : _param_error, _param_options = _param.options, options = _param_options === void 0 ? [] : _param_options; _param.checkbox; var placeholder = _param.placeholder, value = _param.value, setValue = _param.setValue; _param.initialValue; var _param_type = _param.type, type = _param_type === void 0 ? 'primary' : _param_type, _param_disabled = _param.disabled, disabled = _param_disabled === void 0 ? false : _param_disabled, props = _object_without_properties$a(_param, [
+    var _param_sz = _param.sz, sz = _param_sz === void 0 ? 'sm' : _param_sz, _param_error = _param.error, error = _param_error === void 0 ? false : _param_error, _param_options = _param.options, options = _param_options === void 0 ? [] : _param_options; _param.checkbox; var placeholder = _param.placeholder, value = _param.value, setValue = _param.setValue; _param.initialValue; var _param_type = _param.type, type = _param_type === void 0 ? 'primary' : _param_type, style = _param.style, _param_maxHeight = _param.maxHeight, maxHeight = _param_maxHeight === void 0 ? '14rem' : _param_maxHeight, _param_disabled = _param.disabled, disabled = _param_disabled === void 0 ? false : _param_disabled, props = _object_without_properties$a(_param, [
         "sz",
         "error",
         "options",
@@ -24134,6 +24140,8 @@ var Select = function(_param) {
         "setValue",
         "initialValue",
         "type",
+        "style",
+        "maxHeight",
         "disabled"
     ]);
     var _options_find;
@@ -24148,6 +24156,7 @@ var Select = function(_param) {
         type: type,
         error: error,
         open: open,
+        style: style,
         children: [
             /*#__PURE__*/ jsxs(InputWrapper, {
                 children: [
@@ -24195,7 +24204,9 @@ var Select = function(_param) {
                 offset: 4,
                 detectEdges: false,
                 style: {
-                    padding: "".concat(spacing(1), "px 0")
+                    padding: "".concat(spacing(1), "px 0"),
+                    maxHeight: maxHeight,
+                    overflowY: 'scroll'
                 },
                 children: options.map(function(option) {
                     return /*#__PURE__*/ jsx(MenuItem, _object_spread_props$h(_object_spread$k({

package/package.json

@@ -2,7 +2,7 @@
   "name": "@paubox/ui",
   "author": "Paubox, Inc.",
   "description": "Paubox Component Library",
-  "version": "0.15.0",
+  "version": "0.15.2",
   "type": "module",
   "private": false,
   "publishConfig": {

package/src/lib/Inputs/Select.d.ts

@@ -8,6 +8,7 @@ export interface BaseSelectProps extends React.InputHTMLAttributes<HTMLSelectEle
     leftIcon?: React.ElementType;
     rightIcon?: React.ElementType;
     options?: SelectOption[];
+    maxHeight?: string;
     checkbox?: boolean;
     initialValue?: SelectOption;
     type?: 'primary' | 'secondary';
@@ -16,4 +17,4 @@ export interface SelectProps extends BaseSelectProps {
     value: any;
     setValue: (value: string) => void;
 }
-export declare const Select: ({ sz, error, options, checkbox, placeholder, value, setValue, initialValue, type, disabled, ...props }: SelectProps) => import("@emotion/react/jsx-runtime").JSX.Element;
+export declare const Select: ({ sz, error, options, checkbox, placeholder, value, setValue, initialValue, type, style, maxHeight, disabled, ...props }: SelectProps) => import("@emotion/react/jsx-runtime").JSX.Element;