@nulogy/components 10.2.1 → 10.2.2

package/dist/main.js

@@ -21970,6 +21970,32 @@
       };
     };
 
+    var getSubset = function getSubset(o, propObj) {
+      var fields = Object.keys(propObj);
+      return pick.apply(void 0, [o].concat(fields));
+    };
+    var omitSubset = function omitSubset(o, propObj) {
+      var fields = Object.keys(propObj);
+      var objectProps = Object.keys(o);
+      return objectProps.reduce(function (a, x) {
+        if (!fields.includes(x)) a[x] = o[x];
+        return a;
+      }, {});
+    };
+
+    var pick = function pick(o) {
+      var objectProps = Object.keys(o);
+
+      for (var _len = arguments.length, fields = new Array(_len > 1 ? _len - 1 : 0), _key = 1; _key < _len; _key++) {
+        fields[_key - 1] = arguments[_key];
+      }
+
+      return fields.reduce(function (a, x) {
+        if (objectProps.includes(x)) a[x] = o[x];
+        return a;
+      }, {});
+    };
+
     var StyledOption = styled__default["default"].div.withConfig({
       displayName: "SelectOption__StyledOption",
       componentId: "sc-i7ae6z-0"
@@ -22012,41 +22038,16 @@
         }
       }, size);
     });
-    function SelectOption(props) {
+    function SelectOption$1(props) {
+      var size = useComponentSize(props.size);
       return /*#__PURE__*/React__default["default"].createElement(StyledOption, {
         isSelected: props.isSelected,
         isFocused: props.isFocused,
-        size: props.size,
+        size: size,
         "data-testid": "select-option"
-      }, /*#__PURE__*/React__default["default"].createElement(WindowedSelect.components.Option, Object.assign({}, props)));
+      }, /*#__PURE__*/React__default["default"].createElement(WindowedSelect.components.Option, Object.assign({}, props), props.children));
     }
 
-    var getSubset = function getSubset(o, propObj) {
-      var fields = Object.keys(propObj);
-      return pick.apply(void 0, [o].concat(fields));
-    };
-    var omitSubset = function omitSubset(o, propObj) {
-      var fields = Object.keys(propObj);
-      var objectProps = Object.keys(o);
-      return objectProps.reduce(function (a, x) {
-        if (!fields.includes(x)) a[x] = o[x];
-        return a;
-      }, {});
-    };
-
-    var pick = function pick(o) {
-      var objectProps = Object.keys(o);
-
-      for (var _len = arguments.length, fields = new Array(_len > 1 ? _len - 1 : 0), _key = 1; _key < _len; _key++) {
-        fields[_key - 1] = arguments[_key];
-      }
-
-      return fields.reduce(function (a, x) {
-        if (objectProps.includes(x)) a[x] = o[x];
-        return a;
-      }, {});
-    };
-
     var SelectControl$1 = function SelectControl(props) {
       // eslint-disable-next-line react/prop-types
       var isFocused = props.isFocused;
@@ -22055,32 +22056,32 @@
       }, /*#__PURE__*/React__default["default"].createElement(components.Control, Object.assign({
         className: isFocused ? "nds-select--is-focused" : null,
         isFocused: isFocused
-      }, props)));
+      }, props), props.children));
     };
     var SelectMultiValue$1 = function SelectMultiValue(props) {
       return /*#__PURE__*/React__default["default"].createElement("div", {
         "data-testid": "select-multivalue"
-      }, /*#__PURE__*/React__default["default"].createElement(components.MultiValue, Object.assign({}, props)));
+      }, /*#__PURE__*/React__default["default"].createElement(components.MultiValue, Object.assign({}, props), props.children));
     };
     var SelectClearIndicator$1 = function SelectClearIndicator(props) {
       return /*#__PURE__*/React__default["default"].createElement("div", {
         "data-testid": "select-clear"
-      }, /*#__PURE__*/React__default["default"].createElement(components.ClearIndicator, Object.assign({}, props)));
+      }, /*#__PURE__*/React__default["default"].createElement(components.ClearIndicator, Object.assign({}, props), props.children));
     };
     var SelectDropdownIndicator$1 = function SelectDropdownIndicator(props) {
       return /*#__PURE__*/React__default["default"].createElement("div", {
         "data-testid": "select-arrow"
-      }, /*#__PURE__*/React__default["default"].createElement(components.DropdownIndicator, Object.assign({}, props)));
+      }, /*#__PURE__*/React__default["default"].createElement(components.DropdownIndicator, Object.assign({}, props), props.children));
     };
     var SelectContainer$1 = function SelectContainer(props) {
       return /*#__PURE__*/React__default["default"].createElement("div", {
         "data-testid": "select-container"
-      }, /*#__PURE__*/React__default["default"].createElement(components.SelectContainer, Object.assign({}, props)));
+      }, /*#__PURE__*/React__default["default"].createElement(components.SelectContainer, Object.assign({}, props), props.children));
     };
     var SelectInput$1 = function SelectInput(props) {
       return /*#__PURE__*/React__default["default"].createElement("div", {
         "data-testid": "select-input"
-      }, /*#__PURE__*/React__default["default"].createElement(components.Input, Object.assign({}, props)));
+      }, /*#__PURE__*/React__default["default"].createElement(components.Input, Object.assign({}, props), props.children));
     };
     var SelectMenu$1 = function SelectMenu(props) {
       if (!props.selectProps.inputValue && props.options.length === 0) {
@@ -22089,8 +22090,17 @@
 
       return /*#__PURE__*/React__default["default"].createElement("div", {
         "data-testid": "select-dropdown"
-      }, /*#__PURE__*/React__default["default"].createElement(components.Menu, Object.assign({}, props)));
+      }, /*#__PURE__*/React__default["default"].createElement(components.Menu, Object.assign({}, props), props.children));
     };
+    function SelectOption(props) {
+      var size = useComponentSize(props.size);
+      return /*#__PURE__*/React__default["default"].createElement(StyledOption, {
+        isSelected: props.isSelected,
+        isFocused: props.isFocused,
+        size: size,
+        "data-testid": "select-option"
+      }, /*#__PURE__*/React__default["default"].createElement(components.Option, Object.assign({}, props), props.children));
+    }
 
     var AsyncSelect = /*#__PURE__*/React.forwardRef(function (_a, ref) {
       var autocomplete = _a.autocomplete,
@@ -22176,7 +22186,7 @@
           Option: function Option(props) {
             return /*#__PURE__*/React__default["default"].createElement(SelectOption, Object.assign({
               size: componentSize
-            }, props));
+            }, props), props.children);
           },
           Control: SelectControl$1,
           MultiValue: SelectMultiValue$1,
@@ -49303,7 +49313,7 @@
         isMulti: multiselect,
         components: Object.assign({
           Option: function Option(props) {
-            return /*#__PURE__*/React__default["default"].createElement(SelectOption, Object.assign({
+            return /*#__PURE__*/React__default["default"].createElement(SelectOption$1, Object.assign({
               size: componentSize
             }, props));
           },
@@ -52432,7 +52442,7 @@
     exports.SelectInput = SelectInput;
     exports.SelectMenu = SelectMenu;
     exports.SelectMultiValue = SelectMultiValue;
-    exports.SelectOption = SelectOption;
+    exports.SelectOption = SelectOption$1;
     exports.Sidebar = Sidebar;
     exports.SmallNavBar = SmallNavBar$1;
     exports.SortingTable = SortingTable;

package/dist/main.module.js

@@ -21953,6 +21953,32 @@ var customStyles = function customStyles(_ref6) {
   };
 };
 
+var getSubset = function getSubset(o, propObj) {
+  var fields = Object.keys(propObj);
+  return pick.apply(void 0, [o].concat(fields));
+};
+var omitSubset = function omitSubset(o, propObj) {
+  var fields = Object.keys(propObj);
+  var objectProps = Object.keys(o);
+  return objectProps.reduce(function (a, x) {
+    if (!fields.includes(x)) a[x] = o[x];
+    return a;
+  }, {});
+};
+
+var pick = function pick(o) {
+  var objectProps = Object.keys(o);
+
+  for (var _len = arguments.length, fields = new Array(_len > 1 ? _len - 1 : 0), _key = 1; _key < _len; _key++) {
+    fields[_key - 1] = arguments[_key];
+  }
+
+  return fields.reduce(function (a, x) {
+    if (objectProps.includes(x)) a[x] = o[x];
+    return a;
+  }, {});
+};
+
 var StyledOption = styled.div.withConfig({
   displayName: "SelectOption__StyledOption",
   componentId: "sc-i7ae6z-0"
@@ -21995,41 +22021,16 @@ var StyledOption = styled.div.withConfig({
     }
   }, size);
 });
-function SelectOption(props) {
+function SelectOption$1(props) {
+  var size = useComponentSize(props.size);
   return /*#__PURE__*/React__default.createElement(StyledOption, {
     isSelected: props.isSelected,
     isFocused: props.isFocused,
-    size: props.size,
+    size: size,
     "data-testid": "select-option"
-  }, /*#__PURE__*/React__default.createElement(components$1.Option, Object.assign({}, props)));
+  }, /*#__PURE__*/React__default.createElement(components$1.Option, Object.assign({}, props), props.children));
 }
 
-var getSubset = function getSubset(o, propObj) {
-  var fields = Object.keys(propObj);
-  return pick.apply(void 0, [o].concat(fields));
-};
-var omitSubset = function omitSubset(o, propObj) {
-  var fields = Object.keys(propObj);
-  var objectProps = Object.keys(o);
-  return objectProps.reduce(function (a, x) {
-    if (!fields.includes(x)) a[x] = o[x];
-    return a;
-  }, {});
-};
-
-var pick = function pick(o) {
-  var objectProps = Object.keys(o);
-
-  for (var _len = arguments.length, fields = new Array(_len > 1 ? _len - 1 : 0), _key = 1; _key < _len; _key++) {
-    fields[_key - 1] = arguments[_key];
-  }
-
-  return fields.reduce(function (a, x) {
-    if (objectProps.includes(x)) a[x] = o[x];
-    return a;
-  }, {});
-};
-
 var SelectControl$1 = function SelectControl(props) {
   // eslint-disable-next-line react/prop-types
   var isFocused = props.isFocused;
@@ -22038,32 +22039,32 @@ var SelectControl$1 = function SelectControl(props) {
   }, /*#__PURE__*/React__default.createElement(components.Control, Object.assign({
     className: isFocused ? "nds-select--is-focused" : null,
     isFocused: isFocused
-  }, props)));
+  }, props), props.children));
 };
 var SelectMultiValue$1 = function SelectMultiValue(props) {
   return /*#__PURE__*/React__default.createElement("div", {
     "data-testid": "select-multivalue"
-  }, /*#__PURE__*/React__default.createElement(components.MultiValue, Object.assign({}, props)));
+  }, /*#__PURE__*/React__default.createElement(components.MultiValue, Object.assign({}, props), props.children));
 };
 var SelectClearIndicator$1 = function SelectClearIndicator(props) {
   return /*#__PURE__*/React__default.createElement("div", {
     "data-testid": "select-clear"
-  }, /*#__PURE__*/React__default.createElement(components.ClearIndicator, Object.assign({}, props)));
+  }, /*#__PURE__*/React__default.createElement(components.ClearIndicator, Object.assign({}, props), props.children));
 };
 var SelectDropdownIndicator$1 = function SelectDropdownIndicator(props) {
   return /*#__PURE__*/React__default.createElement("div", {
     "data-testid": "select-arrow"
-  }, /*#__PURE__*/React__default.createElement(components.DropdownIndicator, Object.assign({}, props)));
+  }, /*#__PURE__*/React__default.createElement(components.DropdownIndicator, Object.assign({}, props), props.children));
 };
 var SelectContainer$1 = function SelectContainer(props) {
   return /*#__PURE__*/React__default.createElement("div", {
     "data-testid": "select-container"
-  }, /*#__PURE__*/React__default.createElement(components.SelectContainer, Object.assign({}, props)));
+  }, /*#__PURE__*/React__default.createElement(components.SelectContainer, Object.assign({}, props), props.children));
 };
 var SelectInput$1 = function SelectInput(props) {
   return /*#__PURE__*/React__default.createElement("div", {
     "data-testid": "select-input"
-  }, /*#__PURE__*/React__default.createElement(components.Input, Object.assign({}, props)));
+  }, /*#__PURE__*/React__default.createElement(components.Input, Object.assign({}, props), props.children));
 };
 var SelectMenu$1 = function SelectMenu(props) {
   if (!props.selectProps.inputValue && props.options.length === 0) {
@@ -22072,8 +22073,17 @@ var SelectMenu$1 = function SelectMenu(props) {
 
   return /*#__PURE__*/React__default.createElement("div", {
     "data-testid": "select-dropdown"
-  }, /*#__PURE__*/React__default.createElement(components.Menu, Object.assign({}, props)));
+  }, /*#__PURE__*/React__default.createElement(components.Menu, Object.assign({}, props), props.children));
 };
+function SelectOption(props) {
+  var size = useComponentSize(props.size);
+  return /*#__PURE__*/React__default.createElement(StyledOption, {
+    isSelected: props.isSelected,
+    isFocused: props.isFocused,
+    size: size,
+    "data-testid": "select-option"
+  }, /*#__PURE__*/React__default.createElement(components.Option, Object.assign({}, props), props.children));
+}
 
 var AsyncSelect = /*#__PURE__*/forwardRef(function (_a, ref) {
   var autocomplete = _a.autocomplete,
@@ -22159,7 +22169,7 @@ var AsyncSelect = /*#__PURE__*/forwardRef(function (_a, ref) {
       Option: function Option(props) {
         return /*#__PURE__*/React__default.createElement(SelectOption, Object.assign({
           size: componentSize
-        }, props));
+        }, props), props.children);
       },
       Control: SelectControl$1,
       MultiValue: SelectMultiValue$1,
@@ -49286,7 +49296,7 @@ var ReactSelect = /*#__PURE__*/React__default.forwardRef(function (_a, ref) {
     isMulti: multiselect,
     components: Object.assign({
       Option: function Option(props) {
-        return /*#__PURE__*/React__default.createElement(SelectOption, Object.assign({
+        return /*#__PURE__*/React__default.createElement(SelectOption$1, Object.assign({
           size: componentSize
         }, props));
       },
@@ -52342,4 +52352,4 @@ TruncatedText.defaultProps = {
   tooltipProps: undefined
 };
 
-export { ALL_NDS_LOCALES, Alert$1 as Alert, AnimatedBox, ApplicationFrame, AsyncSelect, Banner, Box, BrandLogoContainer, NavBar$1 as BrandedNavBar, Branding, Breadcrumbs, Button, ButtonGroup, Card, CardSet, Checkbox, CheckboxGroup, ControlIcon, DangerButton, DatePicker, DateRange, DesktopMenu$1 as DesktopMenu, Divider$1 as Divider, DropdownButton, DropdownItem, DropdownLink, DropdownMenu, DropdownText, EnvironmentBanner, Field, FieldLabel, Fieldset, Flex, Form, FormSection, Header, Heading1, Heading2, Heading3, Heading4, HelpText, Icon, IconicButton, InlineIcon, InlineValidation, Input, Link, List, ListItem, LoadingAnimation, MenuTrigger$1 as MenuTrigger, Modal, NDSProvider, NavBar, NavBarBackground$1 as NavBarBackground, NotificationTypes, Overlay, Page, Pagination, PrimaryButton, QuietButton, Radio, RadioGroup, RangeContainer, RequirementText, ReactSelect as Select, SelectClearIndicator, SelectContainer, SelectControl, SelectDropdownIndicator, SelectInput, SelectMenu, SelectMultiValue, SelectOption, Sidebar, SmallNavBar$1 as SmallNavBar, SortingTable, StatusIndicator, StatusIndicatorValues, Summary, SummaryDivider, SummaryItem, Switch$1 as Switch, Switcher, Tab, Table, Tabs, Text, Textarea, TimePicker, TimeRange, Toast, ToastContainer, ToggleComponent as Toggle, Tooltip, TruncatedText, addStyledProps, Theme as theme, toast, useWindowDimensions };
+export { ALL_NDS_LOCALES, Alert$1 as Alert, AnimatedBox, ApplicationFrame, AsyncSelect, Banner, Box, BrandLogoContainer, NavBar$1 as BrandedNavBar, Branding, Breadcrumbs, Button, ButtonGroup, Card, CardSet, Checkbox, CheckboxGroup, ControlIcon, DangerButton, DatePicker, DateRange, DesktopMenu$1 as DesktopMenu, Divider$1 as Divider, DropdownButton, DropdownItem, DropdownLink, DropdownMenu, DropdownText, EnvironmentBanner, Field, FieldLabel, Fieldset, Flex, Form, FormSection, Header, Heading1, Heading2, Heading3, Heading4, HelpText, Icon, IconicButton, InlineIcon, InlineValidation, Input, Link, List, ListItem, LoadingAnimation, MenuTrigger$1 as MenuTrigger, Modal, NDSProvider, NavBar, NavBarBackground$1 as NavBarBackground, NotificationTypes, Overlay, Page, Pagination, PrimaryButton, QuietButton, Radio, RadioGroup, RangeContainer, RequirementText, ReactSelect as Select, SelectClearIndicator, SelectContainer, SelectControl, SelectDropdownIndicator, SelectInput, SelectMenu, SelectMultiValue, SelectOption$1 as SelectOption, Sidebar, SmallNavBar$1 as SmallNavBar, SortingTable, StatusIndicator, StatusIndicatorValues, Summary, SummaryDivider, SummaryItem, Switch$1 as Switch, Switcher, Tab, Table, Tabs, Text, Textarea, TimePicker, TimeRange, Toast, ToastContainer, ToggleComponent as Toggle, Tooltip, TruncatedText, addStyledProps, Theme as theme, toast, useWindowDimensions };

package/dist/src/AsyncSelect/AsyncSelectComponents.d.ts

@@ -1,6 +1,8 @@
 import React from "react";
 import { ClearIndicatorProps, ContainerProps, ControlProps, DropdownIndicatorProps, InputProps, MenuProps, MultiValueProps } from "react-select";
 import { GroupBase } from "react-select";
+import { OptionProps } from "react-windowed-select";
+import { ComponentSize } from "../NDSProvider/ComponentSizeContext";
 export declare const SelectControl: <Option, IsMulti extends boolean, Group extends GroupBase<Option>>(props: ControlProps<Option, IsMulti, Group>) => React.JSX.Element;
 export declare const SelectMultiValue: <Option, IsMulti extends boolean, Group extends GroupBase<Option>>(props: MultiValueProps<Option, IsMulti, Group>) => React.JSX.Element;
 export declare const SelectClearIndicator: <Option, IsMulti extends boolean, Group extends GroupBase<Option>>(props: ClearIndicatorProps<Option, IsMulti, Group>) => React.JSX.Element;
@@ -8,3 +10,6 @@ export declare const SelectDropdownIndicator: <Option, IsMulti extends boolean,
 export declare const SelectContainer: <Option, IsMulti extends boolean, Group extends GroupBase<Option>>(props: ContainerProps<Option, IsMulti, Group>) => React.JSX.Element;
 export declare const SelectInput: <Option, IsMulti extends boolean, Group extends GroupBase<Option>>(props: InputProps<Option, IsMulti, Group>) => React.JSX.Element;
 export declare const SelectMenu: <Option, IsMulti extends boolean, Group extends GroupBase<Option>>(props: MenuProps<Option, IsMulti, Group>) => React.JSX.Element;
+export declare function SelectOption<Option, IsMulti extends boolean, Group extends GroupBase<Option>>(props: OptionProps<Option, IsMulti, Group> & {
+    size?: ComponentSize;
+}): React.JSX.Element;

package/dist/src/Select/SelectOption.d.ts

@@ -1,7 +1,14 @@
 import React from "react";
 import { OptionProps } from "react-windowed-select";
-import { GroupBase } from "react-select";
 import { ComponentSize } from "../NDSProvider/ComponentSizeContext";
-export declare function SelectOption<Option, IsMulti extends boolean, Group extends GroupBase<Option>>(props: OptionProps<Option, IsMulti, Group> & {
+type SelectOptionProps = {
+    isSelected: boolean;
+    isFocused: boolean;
     size: ComponentSize;
-}): React.JSX.Element;
+};
+export declare const StyledOption: import("styled-components").StyledComponent<"div", import("styled-components").DefaultTheme, SelectOptionProps, never>;
+interface CustomOptionProps extends OptionProps {
+    size?: ComponentSize;
+}
+export declare function SelectOption(props: CustomOptionProps): React.JSX.Element;
+export {};

package/package.json

@@ -1,6 +1,6 @@
 {
   "name": "@nulogy/components",
-  "version": "10.2.1",
+  "version": "10.2.2",
   "description": "Component library for the Nulogy Design System - http://nulogy.design",
   "private": false,
   "publishConfig": {