@scality/core-ui 0.165.0 → 0.167.0

package/stories/linetimeseriechart.stories.tsx

@@ -1,42 +1,41 @@
 import React from 'react';
 import { Meta, StoryObj } from '@storybook/react';
-import { MetricsTimeSpanProvider } from '../src/lib/components/linetemporalchart/MetricTimespanProvider';
 import { LineTimeSerieChart } from '../src/lib/components/linetimeseriechart/linetimeseriechart.component';
 import { ChartLegendWrapper } from '../src/lib/components/chartlegend/ChartLegendWrapper';
 import { lineTimeSeriesColorRange } from '../src/lib/style/theme';
 import { ChartLegend } from '../src/lib/components/chartlegend/ChartLegend';
+import {
+  SAMPLE_DURATION_LAST_TWENTY_FOUR_HOURS,
+  SAMPLE_FREQUENCY_LAST_TWENTY_FOUR_HOURS,
+} from '../src/lib/components/constants';
 
 const ChartWithProviders = (props) => {
   return (
-    <MetricsTimeSpanProvider>
-      <ChartLegendWrapper
-        colorSet={{
-          'ip-10-160-122-207.eu-north-1.compute.internal':
-            lineTimeSeriesColorRange[0],
-        }}
-      >
-        <LineTimeSerieChart {...props} />
-        <ChartLegend shape="line" />
-      </ChartLegendWrapper>
-    </MetricsTimeSpanProvider>
+    <ChartLegendWrapper
+      colorSet={{
+        'ip-10-160-122-207.eu-north-1.compute.internal':
+          lineTimeSeriesColorRange[0],
+      }}
+    >
+      <LineTimeSerieChart {...props} />
+      <ChartLegend shape="line" />
+    </ChartLegendWrapper>
   );
 };
 
 const ChartWithProviders2 = (props) => {
   return (
-    <MetricsTimeSpanProvider>
-      <ChartLegendWrapper
-        colorSet={{
-          'ip-10-160-122-207.eu-north-1.compute.internal':
-            lineTimeSeriesColorRange[0],
-          'ip-10-160-122-207.eu-north-2.compute.internal':
-            lineTimeSeriesColorRange[1],
-        }}
-      >
-        <LineTimeSerieChart {...props} />
-        <ChartLegend shape="line" direction="vertical" />
-      </ChartLegendWrapper>
-    </MetricsTimeSpanProvider>
+    <ChartLegendWrapper
+      colorSet={{
+        'ip-10-160-122-207.eu-north-1.compute.internal':
+          lineTimeSeriesColorRange[0],
+        'ip-10-160-122-207.eu-north-2.compute.internal':
+          lineTimeSeriesColorRange[1],
+      }}
+    >
+      <LineTimeSerieChart {...props} />
+      <ChartLegend shape="line" direction="vertical" />
+    </ChartLegendWrapper>
   );
 };
 const meta: Meta<typeof LineTimeSerieChart> = {
@@ -381,6 +380,31 @@ const prometheusData5 = [
   [1740492000, '19859.90'],
 ];
 
+// Data with irregular intervals but gaps under 2 intervals (less than 24 minutes)
+// Sample frequency is 720 seconds (12 minutes), so 2 intervals = 1440 seconds (24 minutes)
+const irregularIntervalData = [
+  [1740405600, '47.55'], // Base timestamp
+  [1740406200, '53.01'], // +600 seconds (10 minutes) - under 2 intervals
+  [1740407100, '40.19'], // +900 seconds (15 minutes) - under 2 intervals
+  [1740408000, '59.19'], // +900 seconds (15 minutes) - under 2 intervals
+  [1740409100, '62.50'], // +1100 seconds (18.3 minutes) - under 2 intervals
+  [1740410300, '57.45'], // +1200 seconds (20 minutes) - under 2 intervals
+  [1740411000, '45.19'], // +700 seconds (11.7 minutes) - under 2 intervals
+  [1740412200, '58.62'], // +1200 seconds (20 minutes) - under 2 intervals
+  [1740413000, '53.08'], // +800 seconds (13.3 minutes) - under 2 intervals
+  [1740414300, '64.91'], // +1300 seconds (21.7 minutes) - under 2 intervals
+  [1740415100, '81.23'], // +800 seconds (13.3 minutes) - under 2 intervals
+  [1740416400, '64.82'], // +1300 seconds (21.7 minutes) - under 2 intervals
+  [1740417200, '67.17'], // +800 seconds (13.3 minutes) - under 2 intervals
+  [1740418500, '55.23'], // +1300 seconds (21.7 minutes) - under 2 intervals
+  [1740419400, '47.92'], // +900 seconds (15 minutes) - under 2 intervals
+  [1740420600, '72.11'], // +1200 seconds (20 minutes) - under 2 intervals
+  [1740421500, '61.91'], // +900 seconds (15 minutes) - under 2 intervals
+  [1740422700, '51.07'], // +1200 seconds (20 minutes) - under 2 intervals
+  [1740423800, '39.50'], // +1100 seconds (18.3 minutes) - under 2 intervals
+  [1740424900, '46.92'], // +1100 seconds (18.3 minutes) - under 2 intervals
+];
+
 export const PercentageChartExample: Story = {
   args: {
     series: [
@@ -399,6 +423,8 @@ export const PercentageChartExample: Story = {
     helpText: 'This is the help text',
     yAxisType: 'percentage',
     yAxisTitle: '',
+    interval: SAMPLE_FREQUENCY_LAST_TWENTY_FOUR_HOURS,
+    duration: SAMPLE_DURATION_LAST_TWENTY_FOUR_HOURS,
   },
 };
 const UNIT_RANGE_BS = [
@@ -464,6 +490,8 @@ export const SymmetricalAxisExample: Story = {
     isLegendHidden: false,
     yAxisType: 'symmetrical',
     yAxisTitle: 'in(+)/out(-)',
+    interval: SAMPLE_FREQUENCY_LAST_TWENTY_FOUR_HOURS,
+    duration: SAMPLE_DURATION_LAST_TWENTY_FOUR_HOURS,
   },
 };
 export const AutoUnitChartExample: Story = {
@@ -481,5 +509,31 @@ export const AutoUnitChartExample: Story = {
     height: 200,
     unitRange: UNIT_RANGE_BS,
     yAxisType: 'default',
+    interval: SAMPLE_FREQUENCY_LAST_TWENTY_FOUR_HOURS,
+    duration: SAMPLE_DURATION_LAST_TWENTY_FOUR_HOURS,
+  },
+};
+
+export const IrregularIntervalsExample: Story = {
+  args: {
+    series: [
+      {
+        data: irregularIntervalData,
+        resource: 'ip-10-160-122-207.eu-north-1.compute.internal',
+        metricPrefix: 'instance:10.160.122.207:9100',
+        getTooltipLabel: (prefix, resource) => `${resource}`,
+      },
+    ],
+    title: 'Irregular intervals data',
+    height: 200,
+    startingTimeStamp: irregularIntervalData[0][0],
+    isLoading: false,
+    isLegendHidden: false,
+    helpText:
+      'Data points with irregular timestamps, but all gaps are less than 2 intervals (24 minutes). No missing data points are added.',
+    yAxisType: 'percentage',
+    yAxisTitle: '',
+    interval: SAMPLE_FREQUENCY_LAST_TWENTY_FOUR_HOURS,
+    duration: SAMPLE_DURATION_LAST_TWENTY_FOUR_HOURS,
   },
 };

package/stories/navbar.stories.tsx

@@ -11,6 +11,7 @@ const tabs = [
     render: (
       <InlineInput
         id="instanceName"
+        // @ts-ignore
         changeMutation={{
           isLoading: false,
           mutate: () => {},
@@ -174,3 +175,105 @@ export const NavbarWithOnlyLinkTabs = {
     tabs: linkTabs,
   },
 };
+
+export const NavbarDropdownShowcase = {
+  args: {
+    rightActions: [
+      {
+        type: 'dropdown',
+        text: 'Language',
+        variant: 'secondary',
+        size: 'default',
+        items: [
+          {
+            label: 'English',
+            name: 'EN',
+            onClick: action('English selected'),
+          },
+          {
+            label: 'Français',
+            name: 'FR',
+            onClick: action('French selected'),
+          },
+          {
+            label: 'Español',
+            name: 'ES',
+            onClick: action('Spanish selected'),
+          },
+        ],
+      },
+      {
+        type: 'dropdown',
+        text: 'Help',
+        icon: <i className="fas fa-question-circle" />,
+        variant: 'outline',
+        size: 'default',
+        items: [
+          {
+            label: 'Documentation',
+            onClick: action('Documentation clicked'),
+          },
+          {
+            label: 'Tutorials',
+            onClick: action('Tutorials clicked'),
+          },
+          {
+            label: 'Contact Support',
+            onClick: action('Contact Support clicked'),
+          },
+          {
+            label: 'Release Notes',
+            onClick: action('Release Notes clicked'),
+          },
+        ],
+      },
+      {
+        type: 'dropdown',
+        icon: <i className="fas fa-user" />,
+        variant: 'primary',
+        size: 'default',
+        caret: false,
+        items: [
+          {
+            label: 'Profile Settings',
+            onClick: action('Profile clicked'),
+          },
+          {
+            label: 'Preferences',
+            onClick: action('Preferences clicked'),
+          },
+          {
+            label: 'API Keys',
+            onClick: action('API Keys clicked'),
+          },
+          {
+            label: 'Log out',
+            onClick: action('Logout clicked'),
+          },
+        ],
+      },
+    ],
+    tabs: [
+      {
+        selected: true,
+        title: 'Dashboard',
+        link: <a href="/dashboard">Dashboard</a>,
+        onClick: action('Dashboard clicked'),
+      },
+      {
+        selected: false,
+        title: 'Analytics',
+        link: <a href="/analytics">Analytics</a>,
+        onClick: action('Analytics clicked'),
+      },
+    ],
+  },
+  parameters: {
+    docs: {
+      description: {
+        story:
+          'This story showcases different dropdown variants within the navbar. The dropdowns use the new ButtonV2 styling with variants: secondary, outline, and primary. Notice how the different variants provide visual hierarchy and the icon-only dropdown uses caret: false for a cleaner look.',
+      },
+    },
+  },
+};

package/stories/tabsv2.stories.tsx

@@ -3,12 +3,13 @@ import { TextBadge } from '../src/lib/components/textbadge/TextBadge.component';
 import { Tabs, Tab } from '../src/lib/components/tabsv2/Tabsv2.component';
 import { Wrapper, Title } from './common';
 import { BrowserRouter } from 'react-router-dom';
-import { brand, spacing } from '../src/lib/style/theme';
+import { coreUIAvailableThemes } from '../src/lib/style/theme';
 import styled from 'styled-components';
-import { MemoryRouter, Route, useLocation } from 'react-router';
+import { useLocation } from 'react-router';
+import { spacing } from '../src/lib';
 
 const Content = styled.div`
-  padding: ${spacing.sp24};
+  padding: ${spacing.r24};
   color: ${(props) => props.theme.textPrimary};
   height: 100%;
 `;
@@ -55,13 +56,13 @@ const generateTab = (n = 10, selectedIndex = 0) => {
 };
 
 const customTabStyle = {
-  activeTabColor: brand.selectedActive,
-  activeTabSeparator: brand.statusHealthy,
-  tabLineColor: brand.backgroundLevel3,
-  inactiveTabColor: brand.highlight,
-  tabContentColor: brand.buttonPrimary,
-  separatorColor: brand.statusCritical,
-  tabHoverColor: brand.statusHealthy,
+  activeTabColor: coreUIAvailableThemes.darkRebrand.selectedActive,
+  activeTabSeparator: coreUIAvailableThemes.darkRebrand.statusHealthy,
+  tabLineColor: coreUIAvailableThemes.darkRebrand.backgroundLevel3,
+  inactiveTabColor: coreUIAvailableThemes.darkRebrand.highlight,
+  tabContentColor: coreUIAvailableThemes.darkRebrand.buttonPrimary,
+  separatorColor: coreUIAvailableThemes.darkRebrand.statusCritical,
+  tabHoverColor: coreUIAvailableThemes.darkRebrand.statusHealthy,
 };
 
 const DefaultTabsDetails = (props) => {
@@ -87,52 +88,46 @@ const DefaultTabsDetails = (props) => {
       <Title>
         {location.pathname} / {location.search}
       </Title>
-      <MemoryRouter initialEntries={['/path?tab=group']} initialIndex={0}>
-        <Route
-          path="/:path?"
-          render={() => (
-            <Tabs {...props}>
-              <Tab path="/path" label="Users" withoutPadding>
-                <Content>Users Content</Content>
-              </Tab>
-              <Tab
-                path="/path1"
-                query={{
-                  tab: 'group',
-                }}
-                label="Groups"
-              >
-                {details()}
-              </Tab>
-              <Tab
-                path="/path1"
-                query={{
-                  tab: 'role',
-                }}
-                label="Roles"
-                withoutPadding
-              >
-                <Content>Roles content</Content>
-              </Tab>
-              <Tab
-                path="/path1"
-                query={{
-                  tab: 'policies',
-                }}
-                label="Policies"
-              >
-                <Content>Policies content</Content>
-              </Tab>
-              <Tab path="/path4" label="Storage Location">
-                <Content>Storage Location Content</Content>
-              </Tab>
-              <Tab path="/path5" label="Properties">
-                <Content>Properties Content</Content>
-              </Tab>
-            </Tabs>
-          )}
-        />
-      </MemoryRouter>
+
+      <Tabs {...props}>
+        <Tab path="/path" label="Users" withoutPadding>
+          <Content>Users Content</Content>
+        </Tab>
+        <Tab
+          path="/path1"
+          query={{
+            tab: 'group',
+          }}
+          label="Groups"
+        >
+          {details()}
+        </Tab>
+        <Tab
+          path="/path1"
+          query={{
+            tab: 'role',
+          }}
+          label="Roles"
+          withoutPadding
+        >
+          <Content>Roles content</Content>
+        </Tab>
+        <Tab
+          path="/path1"
+          query={{
+            tab: 'policies',
+          }}
+          label="Policies"
+        >
+          <Content>Policies content</Content>
+        </Tab>
+        <Tab path="/path4" label="Storage Location">
+          <Content>Storage Location Content</Content>
+        </Tab>
+        <Tab path="/path5" label="Properties">
+          <Content>Properties Content</Content>
+        </Tab>
+      </Tabs>
     </>
   );
 };

package/dist/components/areachart/AreaChart.component.d.ts

@@ -1,13 +0,0 @@
-type Props = {
-    id: string;
-    data: Array<Record<string, any>>;
-    xAxis: Record<string, any>;
-    yAxis: Array<Record<string, any>>;
-    color?: Record<string, any>;
-    areas: Array<Record<string, any>>;
-    width?: number;
-    height?: number;
-};
-declare function AreaChart({ id, data, xAxis, yAxis, color, height, width, areas, ...rest }: Props): import("react/jsx-runtime").JSX.Element;
-export { AreaChart };
-//# sourceMappingURL=AreaChart.component.d.ts.map

package/dist/components/areachart/AreaChart.component.d.ts.map

@@ -1 +0,0 @@
-{"version":3,"file":"AreaChart.component.d.ts","sourceRoot":"","sources":["../../../src/lib/components/areachart/AreaChart.component.tsx"],"names":[],"mappings":"AAEA,KAAK,KAAK,GAAG;IACX,EAAE,EAAE,MAAM,CAAC;IACX,IAAI,EAAE,KAAK,CAAC,MAAM,CAAC,MAAM,EAAE,GAAG,CAAC,CAAC,CAAC;IACjC,KAAK,EAAE,MAAM,CAAC,MAAM,EAAE,GAAG,CAAC,CAAC;IAC3B,KAAK,EAAE,KAAK,CAAC,MAAM,CAAC,MAAM,EAAE,GAAG,CAAC,CAAC,CAAC;IAClC,KAAK,CAAC,EAAE,MAAM,CAAC,MAAM,EAAE,GAAG,CAAC,CAAC;IAC5B,KAAK,EAAE,KAAK,CAAC,MAAM,CAAC,MAAM,EAAE,GAAG,CAAC,CAAC,CAAC;IAClC,KAAK,CAAC,EAAE,MAAM,CAAC;IACf,MAAM,CAAC,EAAE,MAAM,CAAC;CACjB,CAAC;AAEF,iBAAS,SAAS,CAAC,EACjB,EAAE,EACF,IAAI,EACJ,KAAK,EACL,KAAK,EACL,KAAK,EACL,MAAY,EACZ,KAAY,EACZ,KAAU,EACV,GAAG,IAAI,EACR,EAAE,KAAK,2CAuBP;AAED,OAAO,EAAE,SAAS,EAAE,CAAC"}

package/dist/components/areachart/AreaChart.component.js

@@ -1,27 +0,0 @@
-import { jsx as _jsx } from "react/jsx-runtime";
-import { VegaChart } from '../vegachart/VegaChart.component';
-function AreaChart({ id, data, xAxis, yAxis, color, height = 300, width = 1000, areas = [], ...rest }) {
-    const lines = yAxis.map((y) => ({
-        mark: {
-            type: 'line',
-        },
-        encoding: {
-            y,
-        },
-    }));
-    const spec = {
-        data: {
-            values: data,
-        },
-        encoding: {
-            x: xAxis,
-            color,
-        },
-        layer: [...lines, ...areas],
-        height,
-        width,
-        ...rest,
-    };
-    return _jsx(VegaChart, { className: "sc-areachart", id: id, spec: spec });
-}
-export { AreaChart };

package/dist/components/chips/Chips.component.d.ts

@@ -1,21 +0,0 @@
-import { Size } from '../constants';
-type Props = {
-    text: string;
-    variant?: 'statusHealthy' | 'statusWarning' | 'statusCritical' | 'infoPrimary' | 'infoSecondary';
-    icon?: JSX.Element;
-    onClick?: (arg0: any) => void;
-    onRemove?: (arg0: any) => void;
-    size?: Size;
-};
-export declare const ChipsIcon: import("styled-components").StyledComponent<"span", import("styled-components").DefaultTheme, {
-    variant: any;
-    text: string;
-    size: Size;
-}, never>;
-export declare const ChipsText: import("styled-components").StyledComponent<"span", import("styled-components").DefaultTheme, {
-    icon: any;
-    isRemovable: boolean;
-}, never>;
-declare const Chips: ({ text, variant, icon, onClick, onRemove, size, }: Props) => import("react/jsx-runtime").JSX.Element;
-export { Chips };
-//# sourceMappingURL=Chips.component.d.ts.map

package/dist/components/chips/Chips.component.d.ts.map

@@ -1 +0,0 @@
-{"version":3,"file":"Chips.component.d.ts","sourceRoot":"","sources":["../../../src/lib/components/chips/Chips.component.tsx"],"names":[],"mappings":"AAIA,OAAO,EAAE,IAAI,EAAE,MAAM,cAAc,CAAC;AAGpC,KAAK,KAAK,GAAG;IACX,IAAI,EAAE,MAAM,CAAC;IACb,OAAO,CAAC,EACJ,eAAe,GACf,eAAe,GACf,gBAAgB,GAChB,aAAa,GACb,eAAe,CAAC;IACpB,IAAI,CAAC,EAAE,GAAG,CAAC,OAAO,CAAC;IACnB,OAAO,CAAC,EAAE,CAAC,IAAI,EAAE,GAAG,KAAK,IAAI,CAAC;IAC9B,QAAQ,CAAC,EAAE,CAAC,IAAI,EAAE,GAAG,KAAK,IAAI,CAAC;IAC/B,IAAI,CAAC,EAAE,IAAI,CAAC;CACb,CAAC;AA0FF,eAAO,MAAM,SAAS;aACX,GAAG;UACN,MAAM;UACN,IAAI;SAOX,CAAC;AACF,eAAO,MAAM,SAAS;UAAuB,GAAG;iBAAe,OAAO;SAKrE,CAAC;AAEF,QAAA,MAAM,KAAK,sDAOR,KAAK,4CAgCP,CAAC;AAEF,OAAO,EAAE,KAAK,EAAE,CAAC"}

package/dist/components/chips/Chips.component.js

@@ -1,105 +0,0 @@
-import { jsx as _jsx, jsxs as _jsxs } from "react/jsx-runtime";
-import { lighten } from 'polished';
-import styled, { css } from 'styled-components';
-import { fontSize, grayLight, white } from '../../style/theme';
-import { Button } from '../button/Button.component';
-import { Icon } from '../icon/Icon.component';
-const ChipsContainer = styled.div `
-  display: inline-flex;
-  .sc-chips-remove {
-    padding-right: 10px;
-    color: ${white};
-    &:hover {
-      color: ${grayLight};
-    }
-  }
-  ${(props) => {
-    switch (props.size) {
-        case 'smaller':
-            return css `
-          border-radius: 10px;
-          .sc-chips-icon {
-            border-radius: 10px;
-            padding: 5px;
-          }
-        `;
-        case 'small':
-            return css `
-          border-radius: 12px;
-          .sc-chips-icon {
-            border-radius: 12px;
-            padding: 6px;
-          }
-        `;
-        case 'large':
-            return css `
-          border-radius: 14px;
-          .sc-chips-icon {
-            border-radius: 14px;
-            padding: 6px;
-          }
-        `;
-        case 'larger':
-            return css `
-          border-radius: 17px;
-          .sc-chips-icon {
-            border-radius: 17px;
-            padding: 7px;
-          }
-        `;
-        default:
-            return css `
-          border-radius: 12px;
-          .sc-chips-icon {
-            border-radius: 12px;
-            padding: 6px;
-          }
-        `;
-    }
-}}
-  ${(props) => {
-    const brand = props.theme;
-    return css `
-      color: ${brand.textReverse};
-    `;
-}}
-
-  ${(props) => {
-    const brand = props.theme;
-    const brandLight = lighten(0.1, brand[props.variant]).toString();
-    return props.onClick
-        ? css `
-          background-color: ${brand[props.variant]};
-          font-size: ${fontSize[props.size || 'base']};
-          &:hover {
-            cursor: pointer;
-            background-color: ${brandLight};
-          }
-          &:active {
-            background-color: ${brand[props.variant]};
-          }
-        `
-        : css `
-          background-color: ${brand[props.variant]};
-          font-size: ${fontSize[props.size || 'base']};
-        `;
-}}
-`;
-export const ChipsIcon = styled.span `
-  display: inline-flex;
-  justify-content: center;
-  align-items: center;
-  background-color: ${(props) => lighten(0.15, props.theme[props.variant]).toString()};
-`;
-export const ChipsText = styled.span `
-  display: inline-flex;
-  justify-content: center;
-  align-items: center;
-  padding: ${(props) => (props.icon || props.isRemovable ? '5px' : '5px 10px')};
-`;
-const Chips = ({ text = '', variant = 'infoPrimary', icon = undefined, onClick, onRemove, size = 'base', }) => (_jsxs(ChipsContainer, { className: "sc-chips", onClick: onClick, variant: variant, icon: icon, size: size, children: [icon && (_jsx(ChipsIcon, { className: "sc-chips-icon", text: text, variant: variant, size: size, children: icon })), _jsx(ChipsText, { className: "sc-chips-text", icon: icon, isRemovable: !!onRemove, children: text }), onRemove && (_jsx(Button
-        // @ts-ignore
-        , { 
-            // @ts-ignore
-            className: "sc-chips-remove", size: size, inverted: true, icon: _jsx(Icon, { name: "Close" }), onClick: onRemove }))] }));
-export { Chips };

package/dist/components/cloudprogressbar/CloudProgressBar.component.d.ts

@@ -1,10 +0,0 @@
-export type CloudProgressBarProps = {
-    percentage: number;
-    borderSize: string;
-    cloudColor?: string;
-    progressCloudColor?: string;
-    children: JSX.Element;
-};
-declare const CloudProgressBar: ({ percentage, borderSize, cloudColor, progressCloudColor, children, }: CloudProgressBarProps) => import("react/jsx-runtime").JSX.Element;
-export { CloudProgressBar };
-//# sourceMappingURL=CloudProgressBar.component.d.ts.map

package/dist/components/cloudprogressbar/CloudProgressBar.component.d.ts.map

@@ -1 +0,0 @@
-{"version":3,"file":"CloudProgressBar.component.d.ts","sourceRoot":"","sources":["../../../src/lib/components/cloudprogressbar/CloudProgressBar.component.tsx"],"names":[],"mappings":"AAEA,MAAM,MAAM,qBAAqB,GAAG;IAClC,UAAU,EAAE,MAAM,CAAC;IACnB,UAAU,EAAE,MAAM,CAAC;IACnB,UAAU,CAAC,EAAE,MAAM,CAAC;IACpB,kBAAkB,CAAC,EAAE,MAAM,CAAC;IAC5B,QAAQ,EAAE,GAAG,CAAC,OAAO,CAAC;CACvB,CAAC;AA6EF,QAAA,MAAM,gBAAgB,0EAMnB,qBAAqB,4CAWvB,CAAC;AAEF,OAAO,EAAE,gBAAgB,EAAE,CAAC"}

package/dist/components/cloudprogressbar/CloudProgressBar.component.js

@@ -1,38 +0,0 @@
-import { jsx as _jsx, jsxs as _jsxs } from "react/jsx-runtime";
-import styled, { css, keyframes } from 'styled-components';
-import { coreUIAvailableThemes } from '../../style/theme';
-const keyFrameCloud = (props) => {
-    return keyframes `
-    from {
-      height:100%
-    } 
-    to {
-      height:${100 - props.percentage}%
-    }`;
-};
-const Container = styled.div `
-  ${(props) => {
-    return css `
-      text-align: center;
-      position: relative;
-    `;
-}}
-`;
-const ContainerProgress = styled.div `
-  ${(props) => {
-    return css `
-      animation-duration: 1s;
-      animation-fill-mode: both;
-      animation-name: ${keyFrameCloud};
-      position: absolute;
-      top: 0;
-      left: 0;
-      width: 100%;
-      overflow: hidden;
-    `;
-}}
-`;
-const Cloud = ({ strokeColor, borderSize }) => (_jsx("svg", { xmlns: "http://www.w3.org/2000/svg", viewBox: "0 15 72 42", enableBackground: "new 0 0 72 72", children: _jsx("g", { children: _jsx("path", { fill: "none", stroke: strokeColor, strokeWidth: borderSize, strokeLinecap: "round", strokeLinejoin: "round", strokeMiterlimit: "10", d: "M15.9,30.3c0,0.4-0.4,0.8-0.8,0.8C10,31.6,6,36.7,6,42.9c0,6.6,4.5,11.9,10.2,11.9h38.7C61,54.8,66,49.1,66,42.2c0-6.6-4.6-12.1-10.4-12.5c-0.4,0-0.8-0.3-0.9-0.8c-1.3-6.7-7.3-11.7-14.3-11.7c-4.6,0-8.7,2.1-11.3,5.4C28.8,23,28.3,23.1,28,23c-1-0.4-2.1-0.6-3.3-0.6C20.1,22.3,16.3,25.8,15.9,30.3z" }) }) }));
-const CloudProgress = ({ strokeColor, percentage, borderSize }) => (_jsx(ContainerProgress, { percentage: percentage, children: _jsx("svg", { xmlns: "http://www.w3.org/2000/svg", viewBox: "0 15 72 42", enableBackground: "new 0 0 72 72", children: _jsx("g", { children: _jsx("path", { fill: "none", stroke: strokeColor, strokeWidth: borderSize, strokeLinecap: "round", strokeLinejoin: "round", strokeMiterlimit: "10", d: "M15.9,30.3c0,0.4-0.4,0.8-0.8,0.8C10,31.6,6,36.7,6,42.9c0,6.6,4.5,11.9,10.2,11.9h38.7C61,54.8,66,49.1,66,42.2c0-6.6-4.6-12.1-10.4-12.5c-0.4,0-0.8-0.3-0.9-0.8c-1.3-6.7-7.3-11.7-14.3-11.7c-4.6,0-8.7,2.1-11.3,5.4C28.8,23,28.3,23.1,28,23c-1-0.4-2.1-0.6-3.3-0.6C20.1,22.3,16.3,25.8,15.9,30.3z" }) }) }) }));
-const CloudProgressBar = ({ percentage = 0, borderSize = '2px', cloudColor = coreUIAvailableThemes.darkRebrand.statusHealthy, progressCloudColor = coreUIAvailableThemes.darkRebrand.backgroundLevel1, children, }) => (_jsxs(Container, { className: "sc-cloudprogressbar", children: [_jsx(Cloud, { strokeColor: progressCloudColor, borderSize: borderSize }), _jsx(CloudProgress, { strokeColor: cloudColor, percentage: percentage, borderSize: borderSize }), children] }));
-export { CloudProgressBar };

package/dist/components/collapsiblepanel/CollapsiblePanel.component.d.ts

@@ -1,9 +0,0 @@
-type Props = {
-    expanded: boolean;
-    onHeaderClick: (arg0: any) => void;
-    children: React.ReactNode;
-    headerItems: Array<JSX.Element>;
-};
-declare function CollapsiblePanel({ expanded, onHeaderClick, children, headerItems, }: Props): import("react/jsx-runtime").JSX.Element;
-export { CollapsiblePanel };
-//# sourceMappingURL=CollapsiblePanel.component.d.ts.map

package/dist/components/collapsiblepanel/CollapsiblePanel.component.d.ts.map

@@ -1 +0,0 @@
-{"version":3,"file":"CollapsiblePanel.component.d.ts","sourceRoot":"","sources":["../../../src/lib/components/collapsiblepanel/CollapsiblePanel.component.tsx"],"names":[],"mappings":"AAIA,KAAK,KAAK,GAAG;IACX,QAAQ,EAAE,OAAO,CAAC;IAClB,aAAa,EAAE,CAAC,IAAI,EAAE,GAAG,KAAK,IAAI,CAAC;IACnC,QAAQ,EAAE,KAAK,CAAC,SAAS,CAAC;IAC1B,WAAW,EAAE,KAAK,CAAC,GAAG,CAAC,OAAO,CAAC,CAAC;CACjC,CAAC;AAqCF,iBAAS,gBAAgB,CAAC,EACxB,QAAgB,EAChB,aAAa,EACb,QAAQ,EACR,WAAgB,GACjB,EAAE,KAAK,2CAuBP;AAED,OAAO,EAAE,gBAAgB,EAAE,CAAC"}