Merge branch 'develop' of https://github.com/leemonade/bubbles into d…

…evelop * 'develop' of https://github.com/leemonade/bubbles: chore: version bump feat: fix totallayoutheader height + modify texteditor to add it as a portal add small document icon for card type and empty cover.
leemonade · Dec 20, 2023 · 9b15dce · 9b15dce
2 parents 0a76f01 + cfe6f1e
commit 9b15dce
Show file tree

Hide file tree

Showing 24 changed files with 145 additions and 38 deletions.
diff --git a/packages/calendars/CHANGELOG.md b/packages/calendars/CHANGELOG.md
@@ -1,5 +1,14 @@
 # @bubbles-ui/calendars
 
+## 1.2.72
+
+### Patch Changes
+
+- Versions bump
+- Updated dependencies
+  - @bubbles-ui/components@1.2.72
+  - @bubbles-ui/icons@1.2.72
+
 ## 1.2.71
 
 ### Patch Changes

diff --git a/packages/calendars/package.json b/packages/calendars/package.json
@@ -1,6 +1,6 @@
 {
   "name": "@bubbles-ui/calendars",
-  "version": "1.2.71",
+  "version": "1.2.72",
   "description": "The Bubbles Design System is Leemonade's open-source design system for products and experiences.",
   "main": "lib/index.js",
   "module": "es/index.js",
@@ -59,8 +59,8 @@
     "rrule": "^2.6.8"
   },
   "peerDependencies": {
-    "@bubbles-ui/components": "^1.2.71",
-    "@bubbles-ui/icons": "^1.2.71",
+    "@bubbles-ui/components": "^1.2.72",
+    "@bubbles-ui/icons": "^1.2.72",
     "react": "^17.0.1",
     "react-dom": "^17.0.1",
     "webpack": "*"

diff --git a/packages/components/CHANGELOG.md b/packages/components/CHANGELOG.md
@@ -1,5 +1,13 @@
 # @bubbles-ui/components
 
+## 1.2.72
+
+### Patch Changes
+
+- Versions bump
+- Updated dependencies
+  - @bubbles-ui/icons@1.2.72
+
 ## 1.2.71
 
 ### Patch Changes

diff --git a/packages/components/package.json b/packages/components/package.json
@@ -1,6 +1,6 @@
 {
   "name": "@bubbles-ui/components",
-  "version": "1.2.71",
+  "version": "1.2.72",
   "description": "The Bubbles Design System is Leemonade's open-source design system for products and experiences.",
   "main": "lib/index.js",
   "module": "es/index.js",
@@ -61,7 +61,7 @@
     "chromatic": "npx chromatic --project-token=7b10302a7b6b --build-script-name=build:storybook:raw"
   },
   "dependencies": {
-    "@bubbles-ui/icons": "^1.2.71",
+    "@bubbles-ui/icons": "^1.2.72",
     "@emotion/react": "^11.10.0",
     "@heroicons/react": "^1.0.5",
     "@hookform/resolvers": "^3.3.2",

diff --git a/packages/components/src/layout/TotalLayout/TotalLayoutHeader/TotalLayoutHeader.js b/packages/components/src/layout/TotalLayout/TotalLayoutHeader/TotalLayoutHeader.js
@@ -71,9 +71,7 @@ const TotalLayoutHeader = ({
 
       {/* CHILDREN */}
       {!!children && direction === 'column' && (
-        <Stack style={{ maxHeight: '40px', minHeight: '40px', marginTop: '12px' }}>
-          {children}
-        </Stack>
+        <Stack style={{ marginTop: '12px' }}>{children}</Stack>
       )}
     </Stack>
   );

diff --git a/packages/components/src/layout/TotalLayout/TotalLayoutHeader/TotalLayoutHeader.styles.js b/packages/components/src/layout/TotalLayout/TotalLayoutHeader/TotalLayoutHeader.styles.js
@@ -6,12 +6,10 @@ const TotalLayoutHeaderStyles = createStyles((theme, { children, direction, comp
     root: {},
     headerContainer: {
       padding: `${!expandedHeader ? '16px' : '12px'} 24px`,
-      minHeight: !expandedHeader ? '72px' : '120px',
-      maxHeight: !expandedHeader ? '72px' : '120px',
       backgroundColor: 'white',
     },
-    header: { height: '40px', maxHeight: '40px' },
-    headerTools: { maxHeight: '40px', minHeight: '40px', marginTop: '12px' },
+    header: { height: '40px' },
+    headerTools: { marginTop: '12px' },
     iconContainer: {
       display: 'flex',
       alignItems: 'center',

diff --git a/packages/components/src/misc/CardEmptyCover/CardEmptyCover.js b/packages/components/src/misc/CardEmptyCover/CardEmptyCover.js
@@ -17,7 +17,7 @@ import { AssetExpressTaskIcon } from '../FileIcon/AssetExpressTaskIcon';
 import { AssetModuleIcon } from '../FileIcon/AssetModuleIcon';
 import { AssetFeedbackIcon } from '../FileIcon/AssetFeedbackIcon';
 import { FileItemDisplay } from '../../informative/FileItemDisplay';
-import { AssetDocumentIcon } from '../FileIcon/AssetDocumentIcon';
+import { AssetDocumentIconSmall } from '../FileIcon/AssetDocumentIcon';
 
 const CardEmptyCover = memo(({ icon, fileType }) => {
   const pairColumnRef = useRef(null);
@@ -28,7 +28,7 @@ const CardEmptyCover = memo(({ icon, fileType }) => {
     { key: 'image', value: <AssetImageIcon height={24} width={24} color={'#878D96'} /> },
     { key: 'bookmark', value: <AssetBookmarkIcon height={24} width={24} color={'#878D96'} /> },
     { key: 'feedback', value: <AssetFeedbackIcon height={24} width={24} color={'#878D96'} /> },
-    { key: 'document', value: <AssetDocumentIcon height={24} width={24} color={'#878D96'} /> },
+    { key: 'document', value: <AssetDocumentIconSmall height={18} width={18} color={'#878D96'} /> },
     { key: 'task', value: <AssetTaskIcon height={24} width={24} color={'#878D96'} /> },
     {
       key: 'taskexpress',

diff --git a/packages/components/src/misc/FileIcon/AssetDocumentIcon/AssetDocumentIcon.constants.js b/packages/components/src/misc/FileIcon/AssetDocumentIcon/AssetDocumentIcon.constants.js
@@ -10,3 +10,14 @@ export const DOCUMENT_ICON_PROP_TYPES = {
   height: PropTypes.number,
   color: PropTypes.string,
 };
+
+export const DOCUMENT_ICON_SMALL_DEFAULT_PROPS = {
+  width: 18,
+  height: 18,
+  color: '#7E8795',
+};
+export const DOCUMENT_ICON_SMALL_PROP_TYPES = {
+  width: PropTypes.number,
+  height: PropTypes.number,
+  color: PropTypes.string,
+};
diff --git a/packages/components/src/misc/FileIcon/AssetDocumentIcon/AssetDocumentIcon.js b/packages/components/src/misc/FileIcon/AssetDocumentIcon/AssetDocumentIcon.js