@ssa-ui-kit/core 1.1.5 → 1.1.6

package/package.json

@@ -1,6 +1,6 @@
 {
   "name": "@ssa-ui-kit/core",
-  "version": "1.1.5",
+  "version": "1.1.6",
   "main": "dist/index.js",
   "types": "dist/index.d.ts",
   "private": false,

package/src/components/PieChart/PieChart.tsx

@@ -42,7 +42,6 @@ const PieChartComponent = ({
   return (
     <WithWidgetCard
       features={features}
-      width={`calc(${width} + ${internalOffset}px)`}
       cardProps={{
         headerContent: <PieChartHeader features={features} />,
         ...cardProps,
@@ -50,7 +49,7 @@ const PieChartComponent = ({
       <PieChartBase
         as={as}
         className={className}
-        width={`calc(${width} + ${internalOffset}px)`}
+        width={width}
         isFullscreenMode={isFullscreenMode}>
         <div className="pie-chart-wrapper">
           <ResponsivePie

package/src/components/WidgetCard/WidgetCard.tsx

@@ -12,7 +12,6 @@ export const WidgetCard = ({
   headerClassName,
   headerContent,
   link,
-  width,
   children,
   onClick,
 }: WidgetCardProps) => {
@@ -22,8 +21,7 @@ export const WidgetCard = ({
       <WidgetCardBase
         className={className}
         onClick={link ? undefined : onClick}
-        isFullscreenMode={isFullscreenMode}
-        width={width}>
+        isFullscreenMode={isFullscreenMode}>
         <Header title={title} className={headerClassName}>
           {headerContent}
         </Header>

package/src/components/WidgetCard/WidgetCardBase.tsx

@@ -3,18 +3,18 @@ import Card from '@components/Card';
 
 export const WidgetCardBase = styled(Card)<{
   isFullscreenMode?: boolean;
-  width?: string;
 }>`
   border-radius: 20px;
   padding: 5px 10px;
-  width: ${({ isFullscreenMode, width }) =>
-    isFullscreenMode ? '100%' : width};
+  width: 100%;
   height: 100%;
   position: ${({ isFullscreenMode }) =>
     isFullscreenMode ? 'absolute' : 'static'};
   top: ${({ isFullscreenMode }) => isFullscreenMode && 0};
   left: ${({ isFullscreenMode }) => isFullscreenMode && 0};
 
+  z-index: 1;
+
   ${({ theme }) => theme.mediaQueries.md} {
     padding: 10px;
   }

package/src/components/WidgetCard/WithWidgetCard.tsx

@@ -5,14 +5,11 @@ export const WithWidgetCard = ({
   children,
   features = [],
   cardProps = {},
-  width,
 }: {
   children: React.ReactNode;
-} & Pick<PieChartProps, 'features' | 'cardProps' | 'width'>) =>
+} & Pick<PieChartProps, 'features' | 'cardProps'>) =>
   features && features.includes('header') ? (
-    <WidgetCard {...cardProps} width={width}>
-      {children}
-    </WidgetCard>
+    <WidgetCard {...cardProps}>{children}</WidgetCard>
   ) : (
     children
   );

package/src/components/WidgetCard/types.ts

@@ -9,6 +9,5 @@ export type WidgetCardProps = {
   headerContent?: React.ReactNode;
   link?: To;
   children?: React.ReactNode;
-  width?: string;
   onClick?: () => void;
 };