@nulogy/components 9.0.3 → 10.0.1

package/dist/main.js

@@ -8246,97 +8246,87 @@
       prop: 'colors'
     });
 
-    layout.width;
-        layout.height;
-        layout.minWidth;
-        layout.minHeight;
-        layout.maxWidth;
-        layout.maxHeight;
-        layout.size;
-        layout.verticalAlign;
-        var display = layout.display,
+    var width = layout.width,
+        height = layout.height,
+        minWidth = layout.minWidth,
+        minHeight = layout.minHeight,
+        maxWidth = layout.maxWidth,
+        maxHeight = layout.maxHeight,
+        size = layout.size,
+        verticalAlign = layout.verticalAlign,
+        display = layout.display,
         overflow = layout.overflow;
         layout.overflowX;
         layout.overflowY;
-    color.opacity;
-    var fontSize = typography.fontSize;
-        typography.fontFamily;
-        typography.fontWeight;
-        var lineHeight = typography.lineHeight,
-        textAlign = typography.textAlign;
-        typography.fontStyle;
-        typography.letterSpacing;
-    flexbox.alignItems;
-        flexbox.alignContent;
-        flexbox.justifyItems;
-        flexbox.justifyContent;
-        flexbox.flexWrap;
-        flexbox.flexDirection;
-        flexbox.flex;
-        var flexGrow = flexbox.flexGrow;
+    var opacity = color.opacity;
+    var fontSize = typography.fontSize,
+        fontFamily = typography.fontFamily,
+        fontWeight = typography.fontWeight,
+        lineHeight = typography.lineHeight,
+        textAlign = typography.textAlign,
+        fontStyle = typography.fontStyle,
+        letterSpacing = typography.letterSpacing;
+    var alignItems = flexbox.alignItems,
+        alignContent = flexbox.alignContent,
+        justifyItems = flexbox.justifyItems,
+        justifyContent = flexbox.justifyContent,
+        flexWrap = flexbox.flexWrap,
+        flexDirection = flexbox.flexDirection,
+        flex = flexbox.flex,
+        flexGrow = flexbox.flexGrow;
         flexbox.flexShrink;
-        flexbox.flexBasis;
-        flexbox.justifySelf;
-        flexbox.alignSelf;
-        var order$1 = flexbox.order;
-    grid.gridGap;
-        grid.gridColumnGap;
-        grid.gridRowGap;
-        grid.gridColumn;
-        grid.gridRow;
-        grid.gridAutoFlow;
-        grid.gridAutoColumns;
-        grid.gridAutoRows;
-        grid.gridTemplateColumns;
-        grid.gridTemplateRows;
-        grid.gridTemplateAreas;
-        grid.gridArea;
+        var flexBasis = flexbox.flexBasis,
+        justifySelf = flexbox.justifySelf,
+        alignSelf = flexbox.alignSelf,
+        order$1 = flexbox.order;
+    var gridGap = grid.gridGap,
+        gridColumnGap = grid.gridColumnGap,
+        gridRowGap = grid.gridRowGap,
+        gridColumn = grid.gridColumn,
+        gridRow = grid.gridRow,
+        gridAutoFlow = grid.gridAutoFlow,
+        gridAutoColumns = grid.gridAutoColumns,
+        gridAutoRows = grid.gridAutoRows,
+        gridTemplateColumns = grid.gridTemplateColumns,
+        gridTemplateRows = grid.gridTemplateRows,
+        gridTemplateAreas = grid.gridTemplateAreas,
+        gridArea = grid.gridArea;
     border.borderWidth;
         border.borderStyle;
-        border.borderColor;
-        border.borderTop;
-        border.borderRight;
-        border.borderBottom;
-        border.borderLeft;
-        border.borderRadius;
-    background.backgroundImage;
-        background.backgroundSize;
-        background.backgroundPosition;
-        background.backgroundRepeat;
-    position.zIndex;
-        position.top;
-        position.right;
-        position.bottom;
-        position.left;
-
-    var transition = system({
+        var borderColor = border.borderColor,
+        borderTop = border.borderTop,
+        borderRight = border.borderRight,
+        borderBottom = border.borderBottom,
+        borderLeft = border.borderLeft,
+        borderRadius$1 = border.borderRadius;
+    var backgroundImage = background.backgroundImage,
+        backgroundSize = background.backgroundSize,
+        backgroundPosition = background.backgroundPosition,
+        backgroundRepeat = background.backgroundRepeat;
+    var zIndex = position.zIndex,
+        top$1 = position.top,
+        right$1 = position.right,
+        bottom$1 = position.bottom,
+        left$1 = position.left;
+
+    var addStyledProps = compose( // After
+    space, margin, padding, width, fontSize, color, fontFamily, textAlign, lineHeight, fontWeight, fontStyle, letterSpacing, display, maxWidth, minWidth, height, maxHeight, minHeight, size, verticalAlign, alignItems, alignContent, justifyItems, justifyContent, flexWrap, flexBasis, flexDirection, flex, flexbox, justifySelf, alignSelf, order$1, grid, gridGap, gridColumnGap, gridRowGap, gridColumn, gridRow, gridAutoFlow, gridAutoColumns, gridAutoRows, gridTemplateColumns, gridTemplateRows, gridTemplateAreas, gridArea, border, borderTop, borderRight, borderBottom, borderLeft, border, borderColor, borderRadius$1, shadow, opacity, overflow, position, zIndex, top$1, right$1, bottom$1, left$1, textStyle, colorStyle, buttonStyle, background, backgroundSize, backgroundRepeat, backgroundPosition, backgroundImage, layout, flexGrow, typography, system({
+      visibility: true,
       transition: true,
-      transitionProperty: true,
-      transitionDuration: true,
-      transitionTimingFunction: true,
-      transitionDelay: true
-    });
-
-    var transform = system({
-      transform: true
-    });
-
-    var cursor$1 = system({
+      transform: true,
+      whiteSpace: true,
+      textOverflow: true,
       cursor: true
-    });
-
-    var visibility = system({
-      visibility: true
-    });
+    }));
 
     var Box = styled__default["default"].div.withConfig({
       displayName: "Box",
       componentId: "sc-xda4ls-0"
-    })(color, space, layout, border, shadow, textAlign, order$1, flexbox, flexGrow, position, background, transform, cursor$1, overflow, transition, visibility, typography);
+    })(addStyledProps);
     var AnimatedBox = styled__default["default"](motion.div).withConfig({
       displayName: "Box__AnimatedBox",
       componentId: "sc-xda4ls-1"
-    })(color, space, layout, border, shadow, textAlign, order$1, flexbox, flexGrow, position, background, transform, cursor$1, overflow, visibility, typography);
+    })(addStyledProps);
 
     /**
      * Do not edit directly
@@ -8732,14 +8722,7 @@
         property: "columnGap",
         scale: "space"
       }
-    }), flexbox);
-
-    var textOverflow = system({
-      whiteSpace: true,
-      textOverflow: true
-    });
-
-    var addStyledProps = compose(border, shadow, color, cursor$1, layout, overflow, space, textOverflow, transform, transition, typography, visibility, flexbox);
+    }));
 
     var getAttrs = function getAttrs(inline) {
       return inline ? {
@@ -10197,6 +10180,13 @@
       })));
     };
 
+    var NotificationTypes = {
+      danger: "danger",
+      informative: "informative",
+      success: "success",
+      warning: "warning"
+    };
+
     var styles = function styles(_ref) {
       var theme = _ref.theme;
       return {
@@ -17598,11 +17588,11 @@
             }
           });
         },
-        dropdownIndicator: function dropdownIndicator(provided, state) {
+        dropdownIndicator: function dropdownIndicator(provided) {
           return Object.assign(Object.assign(Object.assign({}, provided), !hasDefaultOptions && {
             display: "none"
           }), {
-            color: state.isHovered ? theme.colors.blackBlue : theme.colors.grey
+            color: theme.colors.grey
           });
         },
         indicatorsContainer: function indicatorsContainer(provided) {
@@ -17619,9 +17609,6 @@
             transform: "translateY(-50%)"
           });
         },
-        input: function input() {
-          return {};
-        },
         valueContainer: function valueContainer(provided, state) {
           return Object.assign(Object.assign(Object.assign({}, provided), {
             display: "flex",
@@ -17647,14 +17634,13 @@
             marginBottom: 0,
             position: "absolute",
             overflowX: "auto",
-            zIndex: "100",
+            zIndex: 100,
             width: "100%",
             background: theme.colors.white,
             borderWidth: "1px",
             borderColor: getBorderColor({
               errored: error,
               isOpen: true,
-              disabled: state.isDisabled,
               isFocused: false,
               theme: theme
             }),
@@ -18679,7 +18665,7 @@
       };
     }, function (_ref2) {
       var theme = _ref2.theme,
-          selectProps = _ref2.selectProps;
+          size = _ref2.size;
       return stylesForSize({
         large: {
           div: {
@@ -18691,14 +18677,16 @@
             padding: subPx(theme.space.x1)
           }
         }
-      }, selectProps.size);
+      }, size);
     });
-    var SelectOption = function SelectOption(props) {
-      return /*#__PURE__*/React__default["default"].createElement(StyledOption, Object.assign({}, props, {
-        cx: null,
+    function SelectOption(props) {
+      return /*#__PURE__*/React__default["default"].createElement(StyledOption, {
+        isSelected: props.isSelected,
+        isFocused: props.isFocused,
+        size: props.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)));
+    }
 
     var getSubset = function getSubset(o, propObj) {
       var fields = Object.keys(propObj);
@@ -18805,7 +18793,8 @@
           defaultOptions = _a.defaultOptions,
           loadOptions = _a.loadOptions,
           isClearable = _a.isClearable,
-          props = __rest(_a, ["autocomplete", "labelText", "required", "requirementText", "helpText", "noOptionsMessage", "disabled", "errorMessage", "errorList", "id", "initialIsOpen", "maxHeight", "menuPosition", "multiselect", "name", "onChange", "placeholder", "value", "defaultValue", "className", "classNamePrefix", "onBlur", "menuIsOpen", "onMenuOpen", "onMenuClose", "onInputChange", "components", "aria-label", "cacheOptions", "defaultOptions", "loadOptions", "isClearable"]);
+          size = _a.size,
+          props = __rest(_a, ["autocomplete", "labelText", "required", "requirementText", "helpText", "noOptionsMessage", "disabled", "errorMessage", "errorList", "id", "initialIsOpen", "maxHeight", "menuPosition", "multiselect", "name", "onChange", "placeholder", "value", "defaultValue", "className", "classNamePrefix", "onBlur", "menuIsOpen", "onMenuOpen", "onMenuClose", "onInputChange", "components", "aria-label", "cacheOptions", "defaultOptions", "loadOptions", "isClearable", "size"]);
 
       var _useTranslation = useTranslation(),
           t = _useTranslation.t;
@@ -18813,6 +18802,7 @@
       var theme = styled.useTheme();
       var spaceProps = getSubset(props, propTypes.space);
       var error = !!(errorMessage || errorList);
+      var componentSize = useComponentSize(size);
       return /*#__PURE__*/React__default["default"].createElement(Field, Object.assign({}, spaceProps), /*#__PURE__*/React__default["default"].createElement(MaybeFieldLabel, {
         labelText: labelText,
         requirementText: requirementText,
@@ -18850,7 +18840,11 @@
         onInputChange: onInputChange,
         theme: theme,
         components: Object.assign({
-          Option: SelectOption,
+          Option: function Option(props) {
+            return /*#__PURE__*/React__default["default"].createElement(SelectOption, Object.assign({
+              size: componentSize
+            }, props));
+          },
           Control: SelectControl$1,
           MultiValue: SelectMultiValue$1,
           ClearIndicator: SelectClearIndicator$1,
@@ -49109,7 +49103,7 @@
           initialIsOpen = _a.initialIsOpen,
           maxHeight = _a.maxHeight,
           multiselect = _a.multiselect,
-          onChange = _a.onChange,
+          _onChange = _a.onChange,
           placeholder = _a.placeholder,
           value = _a.value,
           defaultValue = _a.defaultValue,
@@ -49131,9 +49125,6 @@
         checkOptionsAreValid(options);
         optionsRef.current = options;
       }, [options]);
-      var handleChange = React__default["default"].useCallback(function (option) {
-        onChange && onChange(extractValue(option, multiselect));
-      }, [multiselect, onChange]);
       React__default["default"].useEffect(function () {
         if (ref) {
           // eslint-disable-next-line @typescript-eslint/ban-ts-comment
@@ -49146,7 +49137,6 @@
         requirementText: requirementText,
         helpText: helpText
       }, /*#__PURE__*/React__default["default"].createElement(WindowedSelect__default["default"], Object.assign({
-        size: componentSize,
         ref: reactSelectRef,
         placeholder: placeholder || t("select"),
         windowThreshold: windowThreshold,
@@ -49163,13 +49153,21 @@
         "aria-invalid": error,
         defaultMenuIsOpen: initialIsOpen,
         inputId: id,
-        onChange: handleChange,
+        onChange: function onChange(option) {
+          if (!_onChange) return;
+          var value = extractValue(option, multiselect);
+
+          _onChange(value);
+        },
         defaultValue: getReactSelectValue(options, defaultValue),
         value: getReactSelectValue(options, value),
         isMulti: multiselect,
-        theme: themeContext,
         components: Object.assign({
-          Option: SelectOption,
+          Option: function Option(props) {
+            return /*#__PURE__*/React__default["default"].createElement(SelectOption, Object.assign({
+              size: componentSize
+            }, props));
+          },
           Control: SelectControl,
           MultiValue: SelectMultiValue,
           ClearIndicator: SelectClearIndicator,
@@ -49179,8 +49177,7 @@
           Input: SelectInput
         }, components),
         "aria-label": ariaLabel,
-        options: options,
-        labelText: labelText
+        options: options
       }, props)), /*#__PURE__*/React__default["default"].createElement(InlineValidation, {
         mt: "x1",
         errorMessage: errorMessage,
@@ -49227,19 +49224,23 @@
       return getOption(options, input);
     };
 
-    var extractValue = function extractValue(options, isMulti) {
-      if (isMulti) {
-        return options && options.length ? options.map(function (o) {
-          return o.value;
-        }) : [];
+    function extractValue(options, isMulti) {
+      if (Array.isArray(options)) {
+        if (isMulti) {
+          return options && options.length ? options.map(function (o) {
+            return o.value;
+          }) : [];
+        } else {
+          throw new Error("UNEXPECTED ERROR: don't forget to enable isMulti");
+        }
       }
 
-      if (options == null) {
+      if (options === null) {
         return options;
       } else {
         return options.value;
       }
-    };
+    }
 
     ReactSelect.defaultProps = Object.assign(Object.assign({}, SelectDefaultProps), {
       windowThreshold: 300,
@@ -52367,6 +52368,7 @@
     exports.NDSProvider = NDSProvider;
     exports.NavBar = NavBar;
     exports.NavBarBackground = NavBarBackground$1;
+    exports.NotificationTypes = NotificationTypes;
     exports.Overlay = Overlay;
     exports.Page = Page;
     exports.Pagination = Pagination;