@mailstep/design-system 0.8.16-beta.19 → 0.8.16-beta.20

package/package.json

@@ -1,6 +1,6 @@
 {
   "name": "@mailstep/design-system",
-  "version": "0.8.16-beta.19",
+  "version": "0.8.16-beta.20",
   "license": "ISC",
   "type": "module",
   "main": "./ui/index.js",

package/ui/Elements/Select/stories/Select.stories.d.ts

@@ -6,4 +6,5 @@ declare const meta: {
     argTypes: {};
 };
 export default meta;
-export declare const Primary: FC;
+export declare const Default: FC;
+export declare const MultiSelect: FC;

package/ui/Elements/Select/stories/Select.stories.js

@@ -11,4 +11,5 @@ var options = [
     { value: '2', label: 'Option 2' },
     { value: '3', label: 'Option 3' }
 ];
-export var Primary = function () { return (_jsx(Select, { label: "Primary Input", onChange: console.log, options: options, isMulti: true, value: ['1', '2'] })); };
+export var Default = function () { return (_jsx(Select, { label: "Primary Select", onChange: console.log, options: options })); };
+export var MultiSelect = function () { return (_jsx(Select, { label: "Multi Select Input", onChange: console.log, options: options, isMulti: true, value: ['1', '2'] })); };

package/ui/Elements/Select/themes/selectStyles.js

@@ -93,11 +93,11 @@ export var CustomStyles = {
     },
     menu: function (styles, state) {
         var theme = state.theme;
-        return __assign(__assign({}, styles), { boxShadow: '0 2px 20px 0 rgba(0, 0, 0, 0.10);', marginTop: '4px', paddingTop: '0', borderRadius: '10px', zIndex: 3, minWidth: 'max-content', backgroundColor: theme.colors.menuBackgroundColor });
+        return __assign(__assign({}, styles), { boxShadow: '0 2px 20px 0 rgba(0, 0, 0, 0.10);', marginTop: '4px', paddingTop: '0', borderRadius: '10px', zIndex: 3, minWidth: 'max-content', color: theme.colors.textPrimary, backgroundColor: theme.colors.menuBackgroundColor });
     },
     menuList: function (styles, _a) {
         var theme = _a.theme;
-        return __assign(__assign({}, styles), { margin: '8px 4px 8px 8px', '::-webkit-scrollbar-thumb': {
+        return __assign(__assign({}, styles), { margin: '8px 4px 8px 8px', color: theme.colors.textPrimary, '::-webkit-scrollbar-thumb': {
                 border: 'none',
                 borderRadius: '4px',
                 height: '47px',
@@ -125,6 +125,7 @@ export var CustomStyles = {
 };
 export var getCustomTheme = function (theme, optionVariant, useFilterSubvariant) {
     var customColors = {
+        textPrimary: th.color('textPrimary')({ theme: theme }),
         primary: th.color('red1')({ theme: theme }),
         inputTextColor: th.color('blue1')({ theme: theme }),
         backgroundColor: th.color('white')({ theme: theme }),

package/ui/Elements/Select/types.d.ts

@@ -57,6 +57,7 @@ export type SelectProps = {
     onIconClick?: (event: React.MouseEvent<HTMLDivElement>) => void;
 };
 export type BaseColors = {
+    textPrimary: string;
     primary: string;
     optionTextColor: string;
     inputDisabledColor: string;