@ftdata/ui 0.0.19 → 0.0.21

package/dist/components/Modal/styles.js

@@ -1,9 +1,9 @@
 import styled_components, { css, keyframes } from "styled-components";
 import { COLOR_NEUTRAL_DARKER, COLOR_NEUTRAL_DAY, COLOR_NEUTRAL_DUSK } from "@ftdata/f-tokens";
 const SIZES = {
-    small: '31.5rem',
-    medium: '42.5rem',
-    large: '53.5rem'
+    small: "31.5rem",
+    medium: "42.5rem",
+    large: "53.5rem"
 };
 const slideIn = keyframes`
   from {
@@ -25,7 +25,7 @@ const fadeOut = keyframes`
 `;
 const getSize = (size)=>{
     if (!size) return;
-    if ('object' == typeof size) return css`
+    if ("object" == typeof size) return css`
       height: ${size.height};
       width: ${size.width};
     `;
@@ -34,10 +34,9 @@ const getSize = (size)=>{
     `;
 };
 const ModalOverlay = styled_components.div`
-  background-color: ${COLOR_NEUTRAL_DUSK};
+  background-color: ${COLOR_NEUTRAL_DUSK + 52};
   position: fixed;
   height: 100vh;
-  opacity: 0.32;
   right: 0;
   top: 0;
   width: 100vw;

package/dist/components/MultiSelect/components/Badge/styles.js

@@ -30,6 +30,7 @@ const BadgeContainer = styled_components.div`
   transform: scale(0.8);
   animation: ${popIn} 0.15s forwards;
   cursor: default;
+  width: 100%;
 
   &.remove {
     animation: ${popOut} 0.15s forwards;
@@ -39,10 +40,11 @@ const BadgeContainer = styled_components.div`
     color: ${COLOR_NEUTRAL_DUSK};
     font-size: 0.875rem;
     line-height: 1rem;
-    max-width: 7.75rem;
     white-space: nowrap;
-    overflow: hidden;
     font-weight: 500;
+    min-width: 0;
+    flex: 1;
+    overflow: hidden;
     text-overflow: ellipsis;
   }
 

package/dist/components/MultiSelect/index.js

@@ -156,7 +156,8 @@ function MultiSelect({ label, sublabel, helpText, helpIcon, feedback, disabled,
                     }),
                     "alt" === variant && /*#__PURE__*/ jsx(RotateButton, {
                         rotate: showList,
-                        onClick: toggleList
+                        onClick: toggleList,
+                        disabled: disabled
                     }),
                     maxItems && /*#__PURE__*/ jsx(MaxItemsIndicator, {
                         children: /*#__PURE__*/ jsxs("span", {

package/dist/index.d.ts

@@ -25,4 +25,6 @@ export { Input } from "./components/Input";
 export { default as IconButton } from "./components/IconButton";
 export { default as Modal } from "./components/Modal";
 export { ModalOverlay } from "./components/Modal/styles";
-export type { ModalAction, ModalActions, ModalProps, ModalSizeCustom, ModalSizes, } from "./components/Modal";
+export type { ModalActions, ModalProps, ModalSizeCustom, ModalSizes, } from "./components/Modal";
+export { default as DateRangePicker } from "./components/DateRangePicker";
+export type { DateRange, DateRangePickerProps, } from "./components/DateRangePicker";

package/dist/index.js

@@ -19,6 +19,7 @@ import { Input } from "./components/Input/index.js";
 import IconButton from "./components/IconButton/index.js";
 import Modal from "./components/Modal/index.js";
 import { ModalOverlay } from "./components/Modal/styles.js";
+import DateRangePicker from "./components/DateRangePicker/index.js";
 export * from "./components/Grid/index.js";
 export * from "./components/Text/index.js";
-export { Avatar, Breadcrumb, Button, Checkbox, Collapse, DoubleList, EmptyState, IconButton, Input, Loading, Menu, Modal, ModalOverlay, MultiSelect, Radio, Select, StateAlert, Switch, TextArea, Tooltips, UserMenu, useLoading };
+export { Avatar, Breadcrumb, Button, Checkbox, Collapse, DateRangePicker, DoubleList, EmptyState, IconButton, Input, Loading, Menu, Modal, ModalOverlay, MultiSelect, Radio, Select, StateAlert, Switch, TextArea, Tooltips, UserMenu, useLoading };