@invoicebox/ui 0.1.0-alpha.276 → 0.1.0-alpha.277

package/dist/components/common/Drawer/index.d.ts

@@ -7,5 +7,6 @@ export type TProps = {
     isOpen: boolean;
     isPadding?: boolean;
     borderColor?: string;
+    overflow?: string;
 };
 export declare const Drawer: FC<TProps>;

package/dist/components/common/Drawer/index.js

@@ -26,7 +26,8 @@ var Drawer = exports.Drawer = function Drawer(_ref) {
     onClose = _ref.onClose,
     _ref$isPadding = _ref.isPadding,
     isPadding = _ref$isPadding === void 0 ? true : _ref$isPadding,
-    borderColor = _ref.borderColor;
+    borderColor = _ref.borderColor,
+    overflow = _ref.overflow;
   var palette = (0, _palette.useComponentPalette)('drawer');
   var _useState = (0, _react.useState)(false),
     _useState2 = _slicedToArray(_useState, 2),
@@ -54,12 +55,14 @@ var Drawer = exports.Drawer = function Drawer(_ref) {
   }, /*#__PURE__*/_react["default"].createElement(S.StyledSheetContainer, {
     $isErrorBorder: isErrorBorder,
     $errorColor: palette.error,
-    $borderColor: borderColor
+    $borderColor: borderColor,
+    $overflow: overflow
   }, /*#__PURE__*/_react["default"].createElement(_reactModalSheet.Sheet.Content, null, /*#__PURE__*/_react["default"].createElement(S.DragIndicatorWrapper, null, /*#__PURE__*/_react["default"].createElement(_reactModalSheet.Sheet.DragIndicator, null)), title && /*#__PURE__*/_react["default"].createElement(S.Title, {
     $bg: palette.titleBg
   }, /*#__PURE__*/_react["default"].createElement(_Typography.Typography, {
     variant: "headline4"
   }, title)), /*#__PURE__*/_react["default"].createElement(S.ChildrenWrapper, {
+    $isBorderRadius: !title,
     $bgColor: palette.bg,
     $isPadding: isPadding
   }, children))), /*#__PURE__*/_react["default"].createElement(S.StyledSheetBackdrop, {

package/dist/components/common/Drawer/index.stories.js

@@ -64,7 +64,8 @@ var commonArgs = {
   isErrorBorder: false,
   onClose: (0, _addonActions.action)('close'),
   isPadding: false,
-  borderColor: undefined
+  borderColor: undefined,
+  overflow: 'hidden'
 };
 var Default = exports.Default = {
   args: commonArgs,

package/dist/components/common/Drawer/styles.d.ts

@@ -8,6 +8,7 @@ export declare const DragIndicatorWrapper: import("styled-components/dist/types"
 export declare const ChildrenWrapper: import("styled-components/dist/types").IStyledComponentBase<"web", import("styled-components/dist/types").Substitute<import("react").DetailedHTMLProps<import("react").HTMLAttributes<HTMLDivElement>, HTMLDivElement>, {
     $isPadding: boolean;
     $bgColor: string;
+    $isBorderRadius?: boolean | undefined;
 }>> & string;
 export declare const StyledSheetContainer: import("styled-components/dist/types").IStyledComponentBase<"web", import("styled-components/dist/types").Substitute<Omit<{
     values?: {
@@ -351,6 +352,7 @@ export declare const StyledSheetContainer: import("styled-components/dist/types"
     $isErrorBorder?: boolean | undefined;
     $errorColor: string;
     $borderColor?: string | undefined;
+    $overflow?: string | undefined;
 }>> & string & Omit<import("react").ForwardRefExoticComponent<{
     values?: {
         [key: string]: import("motion-dom").MotionValue<number> | import("motion-dom").MotionValue<string>;

package/dist/components/common/Drawer/styles.js

@@ -23,26 +23,32 @@ var DragIndicatorWrapper = exports.DragIndicatorWrapper = _styledComponents["def
 var ChildrenWrapper = exports.ChildrenWrapper = _styledComponents["default"].div.withConfig({
   displayName: "styles__ChildrenWrapper",
   componentId: "sc-1kysg49-2"
-})(["", ";background-color:", ";"], function (_ref2) {
+})(["", ";background-color:", ";", ""], function (_ref2) {
   var $isPadding = _ref2.$isPadding;
   return $isPadding && 'padding: 32px 16px 36px';
 }, function (_ref3) {
   var $bgColor = _ref3.$bgColor;
   return $bgColor;
+}, function (_ref4) {
+  var $isBorderRadius = _ref4.$isBorderRadius;
+  return $isBorderRadius && (0, _styledComponents.css)(["border-radius:10px 10px 0 0;"]);
 });
 var StyledSheetContainer = exports.StyledSheetContainer = (0, _styledComponents["default"])(_reactModalSheet.Sheet.Container).withConfig({
   displayName: "styles__StyledSheetContainer",
   componentId: "sc-1kysg49-3"
-})(["overflow:hidden;box-shadow:none;border-radius:10px 10px 0 0;", ""], function (_ref4) {
-  var $isErrorBorder = _ref4.$isErrorBorder,
-    $errorColor = _ref4.$errorColor,
-    $borderColor = _ref4.$borderColor;
+})(["box-shadow:none;border-radius:10px 10px 0 0;", " ", ""], function (_ref5) {
+  var $isErrorBorder = _ref5.$isErrorBorder,
+    $errorColor = _ref5.$errorColor,
+    $borderColor = _ref5.$borderColor;
   return ($isErrorBorder || $borderColor) && (0, _styledComponents.css)(["border-top:2px solid ", ";"], $borderColor || $errorColor);
+}, function (_ref6) {
+  var $overflow = _ref6.$overflow;
+  return $overflow === 'visible' && (0, _styledComponents.css)(["overflow:visible;.react-modal-sheet-content-scroller{overflow-y:visible !important;}"]);
 });
 var StyledSheetBackdrop = exports.StyledSheetBackdrop = (0, _styledComponents["default"])(_reactModalSheet.Sheet.Backdrop).withConfig({
   displayName: "styles__StyledSheetBackdrop",
   componentId: "sc-1kysg49-4"
-})(["background-color:", " !important;"], function (_ref5) {
-  var $bgColor = _ref5.$bgColor;
+})(["background-color:", " !important;"], function (_ref7) {
+  var $bgColor = _ref7.$bgColor;
   return $bgColor;
 });

package/package.json

@@ -1,6 +1,6 @@
 {
     "name": "@invoicebox/ui",
-    "version": "0.1.0-alpha.276",
+    "version": "0.1.0-alpha.277",
     "description": "Invoicebox UI",
     "license": "Apache License 2.0",
     "scripts": {