@toptal/picasso-page 5.2.3 → 5.3.0

package/dist-package/src/SidebarLogo/SidebarLogo.d.ts.map

@@ -1 +1 @@
-{"version":3,"file":"SidebarLogo.d.ts","sourceRoot":"","sources":["../../../src/SidebarLogo/SidebarLogo.tsx"],"names":[],"mappings":"AAAA,OAAO,KAAK,EAAE,SAAS,EAAE,cAAc,EAAE,MAAM,OAAO,CAAA;AACtD,OAAO,KAAqB,MAAM,OAAO,CAAA;AACzC,OAAO,KAAK,EAAE,SAAS,EAAE,MAAM,wBAAwB,CAAA;AASvD,MAAM,WAAW,KACf,SAAQ,SAAS,EACf,cAAc,CAAC,cAAc,GAAG,eAAe,CAAC;IAClD,QAAQ,CAAC,EAAE,SAAS,CAAA;IACpB,yDAAyD;IACzD,aAAa,CAAC,EAAE,SAAS,CAAA;IACzB,uDAAuD;IACvD,QAAQ,CAAC,EAAE,SAAS,CAAA;CACrB;AAMD,eAAO,MAAM,WAAW,8EAwBvB,CAAA;AAMD,eAAe,WAAW,CAAA"}
+{"version":3,"file":"SidebarLogo.d.ts","sourceRoot":"","sources":["../../../src/SidebarLogo/SidebarLogo.tsx"],"names":[],"mappings":"AAAA,OAAO,KAAK,EAAE,SAAS,EAAE,cAAc,EAAE,MAAM,OAAO,CAAA;AACtD,OAAO,KAAqB,MAAM,OAAO,CAAA;AACzC,OAAO,KAAK,EAAE,SAAS,EAAE,MAAM,wBAAwB,CAAA;AAMvD,MAAM,WAAW,KACf,SAAQ,SAAS,EACf,cAAc,CAAC,cAAc,GAAG,eAAe,CAAC;IAClD,QAAQ,CAAC,EAAE,SAAS,CAAA;IACpB,yDAAyD;IACzD,aAAa,CAAC,EAAE,SAAS,CAAA;IACzB,uDAAuD;IACvD,QAAQ,CAAC,EAAE,SAAS,CAAA;CACrB;AAED,eAAO,MAAM,WAAW,8EAsBvB,CAAA;AAMD,eAAe,WAAW,CAAA"}

package/dist-package/src/SidebarLogo/SidebarLogo.js

@@ -10,20 +10,14 @@ var __rest = (this && this.__rest) || function (s, e) {
     return t;
 };
 import React, { forwardRef } from 'react';
-import { makeStyles } from '@material-ui/core';
-import cx from 'classnames';
+import { twMerge } from '@toptal/picasso-tailwind-merge';
 import { Container } from '@toptal/picasso-container';
-import styles from './styles';
 import { useSidebarContext } from '../PageSidebar/SidebarContextProvider';
-const useStyles = makeStyles(styles, {
-    name: 'PicassoSidebarLogo',
-});
 export const SidebarLogo = forwardRef(function SidebarLogo(_a, ref) {
     var { children, collapsedLogo, fullLogo, className } = _a, rest = __rest(_a, ["children", "collapsedLogo", "fullLogo", "className"]);
-    const classes = useStyles();
     const { isCollapsed: isSidebarCollapsed } = useSidebarContext();
     const logo = isSidebarCollapsed ? collapsedLogo : fullLogo;
-    return (React.createElement(Container, Object.assign({}, rest, { className: cx(classes.root, className), ref: ref, bottom: 'xsmall', left: 'large' }),
+    return (React.createElement(Container, Object.assign({}, rest, { className: twMerge('flex-shrink-0 block overflow-hidden', className), ref: ref, bottom: 'xsmall', left: 'large' }),
         logo,
         children));
 });

package/dist-package/src/SidebarLogo/SidebarLogo.js.map

@@ -1 +1 @@
-{"version":3,"file":"SidebarLogo.js","sourceRoot":"","sources":["../../../src/SidebarLogo/SidebarLogo.tsx"],"names":[],"mappings":";;;;;;;;;;;AACA,OAAO,KAAK,EAAE,EAAE,UAAU,EAAE,MAAM,OAAO,CAAA;AAGzC,OAAO,EAAE,UAAU,EAAE,MAAM,mBAAmB,CAAA;AAC9C,OAAO,EAAE,MAAM,YAAY,CAAA;AAC3B,OAAO,EAAE,SAAS,EAAE,MAAM,2BAA2B,CAAA;AAErD,OAAO,MAAM,MAAM,UAAU,CAAA;AAC7B,OAAO,EAAE,iBAAiB,EAAE,MAAM,uCAAuC,CAAA;AAYzE,MAAM,SAAS,GAAG,UAAU,CAAQ,MAAM,EAAE;IAC1C,IAAI,EAAE,oBAAoB;CAC3B,CAAC,CAAA;AAEF,MAAM,CAAC,MAAM,WAAW,GAAG,UAAU,CACnC,SAAS,WAAW,CAClB,EAAyD,EACzD,GAAG;QADH,EAAE,QAAQ,EAAE,aAAa,EAAE,QAAQ,EAAE,SAAS,OAAW,EAAN,IAAI,cAAvD,sDAAyD,CAAF;IAGvD,MAAM,OAAO,GAAG,SAAS,EAAE,CAAA;IAE3B,MAAM,EAAE,WAAW,EAAE,kBAAkB,EAAE,GAAG,iBAAiB,EAAE,CAAA;IAE/D,MAAM,IAAI,GAAG,kBAAkB,CAAC,CAAC,CAAC,aAAa,CAAC,CAAC,CAAC,QAAQ,CAAA;IAE1D,OAAO,CACL,oBAAC,SAAS,oBACJ,IAAI,IACR,SAAS,EAAE,EAAE,CAAC,OAAO,CAAC,IAAI,EAAE,SAAS,CAAC,EACtC,GAAG,EAAE,GAAG,EACR,MAAM,EAAC,QAAQ,EACf,IAAI,EAAC,OAAO;QAEX,IAAI;QACJ,QAAQ,CACC,CACb,CAAA;AACH,CAAC,CACF,CAAA;AAED,WAAW,CAAC,YAAY,GAAG,EAAE,CAAA;AAE7B,WAAW,CAAC,WAAW,GAAG,aAAa,CAAA;AAEvC,eAAe,WAAW,CAAA"}
+{"version":3,"file":"SidebarLogo.js","sourceRoot":"","sources":["../../../src/SidebarLogo/SidebarLogo.tsx"],"names":[],"mappings":";;;;;;;;;;;AACA,OAAO,KAAK,EAAE,EAAE,UAAU,EAAE,MAAM,OAAO,CAAA;AAEzC,OAAO,EAAE,OAAO,EAAE,MAAM,gCAAgC,CAAA;AACxD,OAAO,EAAE,SAAS,EAAE,MAAM,2BAA2B,CAAA;AAErD,OAAO,EAAE,iBAAiB,EAAE,MAAM,uCAAuC,CAAA;AAYzE,MAAM,CAAC,MAAM,WAAW,GAAG,UAAU,CACnC,SAAS,WAAW,CAClB,EAAyD,EACzD,GAAG;QADH,EAAE,QAAQ,EAAE,aAAa,EAAE,QAAQ,EAAE,SAAS,OAAW,EAAN,IAAI,cAAvD,sDAAyD,CAAF;IAGvD,MAAM,EAAE,WAAW,EAAE,kBAAkB,EAAE,GAAG,iBAAiB,EAAE,CAAA;IAE/D,MAAM,IAAI,GAAG,kBAAkB,CAAC,CAAC,CAAC,aAAa,CAAC,CAAC,CAAC,QAAQ,CAAA;IAE1D,OAAO,CACL,oBAAC,SAAS,oBACJ,IAAI,IACR,SAAS,EAAE,OAAO,CAAC,qCAAqC,EAAE,SAAS,CAAC,EACpE,GAAG,EAAE,GAAG,EACR,MAAM,EAAC,QAAQ,EACf,IAAI,EAAC,OAAO;QAEX,IAAI;QACJ,QAAQ,CACC,CACb,CAAA;AACH,CAAC,CACF,CAAA;AAED,WAAW,CAAC,YAAY,GAAG,EAAE,CAAA;AAE7B,WAAW,CAAC,WAAW,GAAG,aAAa,CAAA;AAEvC,eAAe,WAAW,CAAA"}

package/package.json

@@ -1,6 +1,6 @@
 {
   "name": "@toptal/picasso-page",
-  "version": "5.2.3",
+  "version": "5.3.0",
   "description": "Toptal UI components library - Page",
   "publishConfig": {
     "access": "public"

package/src/SidebarLogo/SidebarLogo.tsx

@@ -1,12 +1,9 @@
 import type { ReactNode, HTMLAttributes } from 'react'
 import React, { forwardRef } from 'react'
 import type { BaseProps } from '@toptal/picasso-shared'
-import type { Theme } from '@material-ui/core'
-import { makeStyles } from '@material-ui/core'
-import cx from 'classnames'
+import { twMerge } from '@toptal/picasso-tailwind-merge'
 import { Container } from '@toptal/picasso-container'
 
-import styles from './styles'
 import { useSidebarContext } from '../PageSidebar/SidebarContextProvider'
 
 export interface Props
@@ -19,17 +16,11 @@ export interface Props
   fullLogo?: ReactNode
 }
 
-const useStyles = makeStyles<Theme>(styles, {
-  name: 'PicassoSidebarLogo',
-})
-
 export const SidebarLogo = forwardRef<HTMLDivElement, Props>(
   function SidebarLogo(
     { children, collapsedLogo, fullLogo, className, ...rest },
     ref
   ) {
-    const classes = useStyles()
-
     const { isCollapsed: isSidebarCollapsed } = useSidebarContext()
 
     const logo = isSidebarCollapsed ? collapsedLogo : fullLogo
@@ -37,7 +28,7 @@ export const SidebarLogo = forwardRef<HTMLDivElement, Props>(
     return (
       <Container
         {...rest}
-        className={cx(classes.root, className)}
+        className={twMerge('flex-shrink-0 block overflow-hidden', className)}
         ref={ref}
         bottom='xsmall'
         left='large'

package/src/SidebarLogo/__snapshots__/test.tsx.snap

@@ -6,7 +6,7 @@ exports[`SidebarLogo renders 1`] = `
     class="Picasso-root"
   >
     <div
-      class="mb-2 ml-8 PicassoSidebarLogo-root"
+      class="mb-2 ml-8 flex-shrink block overflow-hidden"
     >
       <svg
         class="PicassoSvgLogo-root text-[1.875rem] align-baseline text-blue [--logo-text [--logo-emblem"

package/dist-package/src/SidebarLogo/styles.d.ts

@@ -1,3 +0,0 @@
-declare const _default: () => import("@material-ui/styles").StyleRules<{}, "root">;
-export default _default;
-//# sourceMappingURL=styles.d.ts.map

package/dist-package/src/SidebarLogo/styles.d.ts.map

@@ -1 +0,0 @@
-{"version":3,"file":"styles.d.ts","sourceRoot":"","sources":["../../../src/SidebarLogo/styles.ts"],"names":[],"mappings":";AAEA,wBAOI"}

package/dist-package/src/SidebarLogo/styles.js

@@ -1,9 +0,0 @@
-import { createStyles } from '@material-ui/core/styles';
-export default () => createStyles({
-    root: {
-        flexShrink: 0,
-        display: 'block',
-        overflow: 'hidden',
-    },
-});
-//# sourceMappingURL=styles.js.map

package/dist-package/src/SidebarLogo/styles.js.map

@@ -1 +0,0 @@
-{"version":3,"file":"styles.js","sourceRoot":"","sources":["../../../src/SidebarLogo/styles.ts"],"names":[],"mappings":"AAAA,OAAO,EAAE,YAAY,EAAE,MAAM,0BAA0B,CAAA;AAEvD,eAAe,GAAG,EAAE,CAClB,YAAY,CAAC;IACX,IAAI,EAAE;QACJ,UAAU,EAAE,CAAC;QACb,OAAO,EAAE,OAAO;QAChB,QAAQ,EAAE,QAAQ;KACnB;CACF,CAAC,CAAA"}

package/src/SidebarLogo/styles.ts

@@ -1,10 +0,0 @@
-import { createStyles } from '@material-ui/core/styles'
-
-export default () =>
-  createStyles({
-    root: {
-      flexShrink: 0,
-      display: 'block',
-      overflow: 'hidden',
-    },
-  })