@scality/core-ui 0.166.0 → 0.167.0

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"}

package/dist/components/collapsiblepanel/CollapsiblePanel.component.js

@@ -1,44 +0,0 @@
-import { jsx as _jsx, jsxs as _jsxs } from "react/jsx-runtime";
-import styled from 'styled-components';
-import { spacing } from '../../spacing';
-import { fontSize } from '../../style/theme';
-import { Icon } from '../icon/Icon.component';
-const ARROW = {
-    colapsed: 'fas fa-angle-down',
-    expanded: 'fas fa-angle-up',
-};
-const HeaderText = styled.div `
-  display: flex;
-  align-items: center;
-  flex-grow: 1;
-`;
-const HeaderItem = styled.div `
-  margin-right: ${spacing.r16};
-  display: flex;
-  flex-grow: 1;
-`;
-const HeaderIcon = styled.div `
-  font-size: ${fontSize.larger};
-  margin: 0 ${spacing.r16};
-`;
-const CollapsiblePanelContainer = styled.div `
-  display: flex;
-  flex-direction: column;
-  border-radius: 4px;
-  background-color: ${(props) => props.theme.backgroundLevel1};
-  color: ${(props) => props.theme.textPrimary};
-`;
-const HeaderContainer = styled.div `
-  display: flex;
-  cursor: pointer;
-  padding: ${spacing.r16};
-`;
-const ExpandedContainer = styled.div `
-  padding: ${spacing.r16};
-  color: ${(props) => props.theme.textPrimary};
-  background-color: ${(props) => props.theme.backgroundLevel1};
-`;
-function CollapsiblePanel({ expanded = false, onHeaderClick, children, headerItems = [], }) {
-    return (_jsxs(CollapsiblePanelContainer, { className: "sc-collapsiblepanel", children: [_jsxs(HeaderContainer, { onClick: onHeaderClick, className: "sc-collapsiblepanel-header", children: [_jsx(HeaderText, { children: headerItems.map((item, index) => (_jsx(HeaderItem, { children: item }, index))) }), _jsx(HeaderIcon, { children: _jsx(Icon, { name: expanded ? 'Dropdown-up' : 'Dropdown-down' }) })] }), expanded && (_jsx(ExpandedContainer, { className: "sc-collapsiblepanel-content", children: children }))] }));
-}
-export { CollapsiblePanel };

package/dist/components/linechart/LineChart.component.d.ts

@@ -1,21 +0,0 @@
-import { $PropertyType } from 'utility-types';
-import type { Encoding, Field } from 'vega-lite';
-type Props = {
-    id: string;
-    data: Array<Record<string, any>>;
-    xAxis: Record<string, any>;
-    yAxis: Array<Record<string, any>>;
-    color?: Record<string, any>;
-    tooltip?: boolean;
-    lineConfig?: Record<string, any>;
-    width?: number;
-    height?: number;
-    displayTrendLine?: boolean;
-    strokeDashEncodingConfig?: $PropertyType<Encoding<Field>, 'strokeDash'>;
-    opacityEncodingConfig?: $PropertyType<Encoding<Field>, 'opacity'>;
-    tooltipConfig?: $PropertyType<Encoding<Field>, 'tooltip'>;
-    tooltipTheme?: 'light' | 'dark' | 'custom';
-};
-declare function LineChart({ id, data, xAxis, yAxis, color, tooltip, lineConfig, height, width, displayTrendLine, strokeDashEncodingConfig, opacityEncodingConfig, tooltipConfig, tooltipTheme, ...rest }: Props): import("react/jsx-runtime").JSX.Element;
-export { LineChart };
-//# sourceMappingURL=LineChart.component.d.ts.map

package/dist/components/linechart/LineChart.component.d.ts.map

@@ -1 +0,0 @@
-{"version":3,"file":"LineChart.component.d.ts","sourceRoot":"","sources":["../../../src/lib/components/linechart/LineChart.component.tsx"],"names":[],"mappings":"AACA,OAAO,EAAE,aAAa,EAAE,MAAM,eAAe,CAAC;AAE9C,OAAO,KAAK,EAAE,QAAQ,EAAE,KAAK,EAAE,MAAM,WAAW,CAAC;AACjD,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,OAAO,CAAC,EAAE,OAAO,CAAC;IAClB,UAAU,CAAC,EAAE,MAAM,CAAC,MAAM,EAAE,GAAG,CAAC,CAAC;IACjC,KAAK,CAAC,EAAE,MAAM,CAAC;IACf,MAAM,CAAC,EAAE,MAAM,CAAC;IAChB,gBAAgB,CAAC,EAAE,OAAO,CAAC;IAC3B,wBAAwB,CAAC,EAAE,aAAa,CAAC,QAAQ,CAAC,KAAK,CAAC,EAAE,YAAY,CAAC,CAAC;IACxE,qBAAqB,CAAC,EAAE,aAAa,CAAC,QAAQ,CAAC,KAAK,CAAC,EAAE,SAAS,CAAC,CAAC;IAClE,aAAa,CAAC,EAAE,aAAa,CAAC,QAAQ,CAAC,KAAK,CAAC,EAAE,SAAS,CAAC,CAAC;IAC1D,YAAY,CAAC,EAAE,OAAO,GAAG,MAAM,GAAG,QAAQ,CAAC;CAC5C,CAAC;AAEF,iBAAS,SAAS,CAAC,EACjB,EAAE,EACF,IAAI,EACJ,KAAK,EACL,KAAK,EACL,KAAK,EACL,OAAe,EACf,UAAU,EACV,MAAY,EACZ,KAAY,EACZ,gBAAwB,EACxB,wBAAwB,EACxB,qBAAqB,EACrB,aAAa,EACb,YAAY,EACZ,GAAG,IAAI,EACR,EAAE,KAAK,2CAgHP;AAED,OAAO,EAAE,SAAS,EAAE,CAAC"}

package/dist/components/linechart/LineChart.component.js

@@ -1,109 +0,0 @@
-import { jsx as _jsx } from "react/jsx-runtime";
-import { VegaChart } from '../vegachart/VegaChart.component';
-function LineChart({ id, data, xAxis, yAxis, color, tooltip = false, lineConfig, height = 300, width = 1000, displayTrendLine = false, strokeDashEncodingConfig, opacityEncodingConfig, tooltipConfig, tooltipTheme, ...rest }) {
-    // hardcode the trendline configuration for tooltip
-    const trendline = {
-        mark: 'rule',
-        selection: {
-            index: {
-                type: 'single',
-                on: 'mousemove',
-                encodings: ['x'],
-                nearest: true,
-            },
-        },
-        encoding: {
-            color: {
-                condition: {
-                    selection: {
-                        not: 'index',
-                    },
-                    value: 'transparent',
-                },
-            },
-        },
-    };
-    /*
-     ** strokeDash encoding allows to define a field in data items that defines the line stroke dash property
-     ** this would allow to get same color lines but having some dashed and some plains
-     ** https://vega.github.io/vega-lite/docs/line.html#multi-series-line-chart-with-varying-dashes
-     */
-    /*
-     ** opacity Encoding allows to define rules for each line's opacity
-     */
-    const lines = yAxis.map((y) => ({
-        mark: {
-            type: 'line',
-            ...lineConfig,
-        },
-        encoding: {
-            y,
-            strokeDash: strokeDashEncodingConfig,
-            opacity: opacityEncodingConfig,
-        },
-    }));
-    const currentTimeTrendline = {
-        mark: {
-            type: 'rule',
-            style: 'ruleCurrentTime',
-            color: 'white',
-            opacity: 0.2,
-        },
-        encoding: {
-            x: {
-                value: width / 2,
-            },
-            y: {
-                value: height,
-            },
-            y2: {
-                value: 0,
-            },
-        },
-    };
-    const topTrendline = {
-        mark: {
-            type: 'rule',
-            style: 'ruleTop',
-            color: 'orange',
-            opacity: 0.2,
-        },
-        encoding: {
-            y: {
-                aggregate: 'max',
-                field: 'capacity',
-                type: 'quantitative',
-            },
-            x: {
-                value: 0,
-            },
-            x2: {
-                value: width,
-            },
-        },
-    };
-    const spec = {
-        data: {
-            values: data,
-        },
-        encoding: {
-            x: xAxis,
-            color,
-            // To disable tooltips for a particular single view specification, you can set the "tooltip" property of a mark definition block to null.
-            tooltip: tooltip ? [xAxis, ...yAxis] : null,
-        },
-        height,
-        width,
-        layer: [...lines],
-        ...rest,
-    };
-    if (tooltip) {
-        spec.layer.push(tooltipConfig || trendline);
-    }
-    if (displayTrendLine) {
-        spec.layer.push(currentTimeTrendline);
-        spec.layer.push(topTrendline);
-    }
-    return (_jsx(VegaChart, { id: id, spec: spec, theme: tooltipTheme || 'light' }));
-}
-export { LineChart };

package/dist/components/multiselect/MultiSelect.component.d.ts

@@ -1,28 +0,0 @@
-export type ItemProps = {
-    selected?: boolean;
-    label: string;
-    description?: string;
-    onSelect?: (arg0: any, arg1: any) => void;
-    onItemRemove?: (arg0: any, arg1: any) => void;
-};
-export type OptionProps = {
-    label: string;
-    value: string | number;
-};
-export type SearchProps = {
-    placeholder?: string;
-    options: Array<OptionProps>;
-    onSelect: (arg0: any) => void;
-    onAdd?: (arg0: any) => void;
-    selectedOption: any;
-};
-type MultiSelectProps = {
-    title?: string;
-    items: Array<ItemProps>;
-    search?: SearchProps;
-    onItemRemove?: (arg0: any, arg1: any) => void;
-};
-declare function MultiSelectList({ title, items, search, onItemRemove, }: MultiSelectProps): import("react/jsx-runtime").JSX.Element;
-export declare const MultiSelect: typeof MultiSelectList;
-export {};
-//# sourceMappingURL=MultiSelect.component.d.ts.map

package/dist/components/multiselect/MultiSelect.component.d.ts.map

@@ -1 +0,0 @@
-{"version":3,"file":"MultiSelect.component.d.ts","sourceRoot":"","sources":["../../../src/lib/components/multiselect/MultiSelect.component.tsx"],"names":[],"mappings":"AASA,MAAM,MAAM,SAAS,GAAG;IACtB,QAAQ,CAAC,EAAE,OAAO,CAAC;IACnB,KAAK,EAAE,MAAM,CAAC;IACd,WAAW,CAAC,EAAE,MAAM,CAAC;IACrB,QAAQ,CAAC,EAAE,CAAC,IAAI,EAAE,GAAG,EAAE,IAAI,EAAE,GAAG,KAAK,IAAI,CAAC;IAE1C,YAAY,CAAC,EAAE,CAAC,IAAI,EAAE,GAAG,EAAE,IAAI,EAAE,GAAG,KAAK,IAAI,CAAC;CAC/C,CAAC;AACF,MAAM,MAAM,WAAW,GAAG;IACxB,KAAK,EAAE,MAAM,CAAC;IACd,KAAK,EAAE,MAAM,GAAG,MAAM,CAAC;CACxB,CAAC;AACF,MAAM,MAAM,WAAW,GAAG;IACxB,WAAW,CAAC,EAAE,MAAM,CAAC;IACrB,OAAO,EAAE,KAAK,CAAC,WAAW,CAAC,CAAC;IAE5B,QAAQ,EAAE,CAAC,IAAI,EAAE,GAAG,KAAK,IAAI,CAAC;IAE9B,KAAK,CAAC,EAAE,CAAC,IAAI,EAAE,GAAG,KAAK,IAAI,CAAC;IAC5B,cAAc,EAAE,GAAG,CAAC;CACrB,CAAC;AACF,KAAK,gBAAgB,GAAG;IACtB,KAAK,CAAC,EAAE,MAAM,CAAC;IACf,KAAK,EAAE,KAAK,CAAC,SAAS,CAAC,CAAC;IACxB,MAAM,CAAC,EAAE,WAAW,CAAC;IACrB,YAAY,CAAC,EAAE,CAAC,IAAI,EAAE,GAAG,EAAE,IAAI,EAAE,GAAG,KAAK,IAAI,CAAC;CAC/C,CAAC;AAqGF,iBAAS,eAAe,CAAC,EACvB,KAAU,EACV,KAAU,EACV,MAAM,EACN,YAAY,GACb,EAAE,gBAAgB,2CAclB;AAED,eAAO,MAAM,WAAW,wBAAkB,CAAC"}

package/dist/components/multiselect/MultiSelect.component.js

@@ -1,73 +0,0 @@
-import { jsx as _jsx, jsxs as _jsxs } from "react/jsx-runtime";
-import styled from 'styled-components';
-import { spacing } from '../../spacing';
-import { fontSize, fontWeight } from '../../style/theme';
-import { getThemePropSelector } from '../../utils';
-import { Icon } from '../icon/Icon.component';
-import { Button } from './../button/Button.component';
-import { Checkbox } from './../checkbox/Checkbox.component';
-import { Select } from './../select/Select.component';
-const MultiSelectContainer = styled.div `
-  color: ${getThemePropSelector('textPrimary')};
-`;
-const MultiSelectTitle = styled.h3 `
-  padding: ${spacing.r16} 0;
-  margin: 0;
-  font-weight: ${fontWeight.bold};
-  font-size: ${fontSize.large};
-`;
-const MultiSelectItemContainer = styled.div `
-  margin: ${spacing.r4} 0;
-  padding: ${spacing.r8} 0;
-  display: flex;
-  align-items: center;
-  border-bottom: 1px solid gray;
-  &:last-child {
-    border: none;
-  }
-`;
-const MultiSelectSearchContainer = styled.div `
-  display: flex;
-  align-items: center;
-  .sc-select-container {
-    width: 100%;
-  }
-  .sc-button {
-    margin: 0 ${spacing.r8};
-  }
-`;
-const MultiSelectItemLeft = styled.div `
-  .sc-checkbox,
-  .sc-button {
-    margin: 0 ${spacing.r8};
-  }
-`;
-const MultiSelectItemCenter = styled.div `
-  display: flex;
-  flex-grow: 1;
-  align-items: center;
-  justify-content: space-between;
-`;
-const MultiSelectItemRight = styled.div `
-  padding: 0 ${spacing.r16};
-`;
-const MultiSelectItemLabel = styled.span `
-  font-size: ${fontSize.large};
-`;
-const MultiSelectItemDescription = styled.span ``;
-function MultiSelectItem(props) {
-    const { selected, label, description, onItemRemove, onSelect } = props;
-    return (_jsxs(MultiSelectItemContainer, { className: "sc-multi-select-item", children: [_jsx(MultiSelectItemLeft, { className: "sc-multi-select-item-left", children: typeof selected === 'boolean' && onSelect && (_jsx(Checkbox, { checked: selected, onChange: (event) => onSelect(label, event) })) }), _jsxs(MultiSelectItemCenter, { className: "sc-multi-select-item-center", children: [_jsx(MultiSelectItemLabel, { className: "sc-multi-select-item-label", children: label }), description && (_jsx(MultiSelectItemDescription, { className: "sc-multi-select-item-description", children: description }))] }), _jsx(MultiSelectItemRight, { className: "sc-multi-select-item-right", children: onItemRemove && (_jsx(Button, { inverted: true, variant: "buttonDelete", onClick: (event) => onItemRemove(label, event), icon: _jsx(Icon, { name: "Delete" }) })) })] }));
-}
-function MultiSelectSearch(props) {
-    const { selectedOption, onSelect, onAdd, ...rest } = props;
-    return (_jsxs(MultiSelectSearchContainer, { className: "sc-multi-select-list-search", children: [_jsx(Select
-            // @ts-ignore
-            , { 
-                // @ts-ignore
-                onChange: onSelect, value: selectedOption, ...rest }), onAdd && _jsx(Button, { onClick: onAdd, icon: _jsx(Icon, { name: "Create-add" }) })] }));
-}
-function MultiSelectList({ title = '', items = [], search, onItemRemove, }) {
-    return (_jsxs(MultiSelectContainer, { className: "sc-multi-select-list", children: [title && _jsx(MultiSelectTitle, { children: title }), search && _jsx(MultiSelectSearch, { ...search }), items.map((item, index) => (_jsx(MultiSelectItem, { onItemRemove: onItemRemove, ...item }, `sc-multi-select-item-${index}`)))] }));
-}
-export const MultiSelect = MultiSelectList;

package/dist/components/select/Select.component.d.ts

@@ -1,14 +0,0 @@
-export type Item = {
-    label: string;
-    value: string | number;
-};
-type Items = Array<Item>;
-type Props = {
-    id?: any;
-    options: Items;
-    formatOptionLabel?: (arg0: any) => JSX.Element;
-};
-declare function SelectBox({ options, formatOptionLabel, ...rest }: Props): import("react/jsx-runtime").JSX.Element;
-export declare const Select: typeof SelectBox;
-export {};
-//# sourceMappingURL=Select.component.d.ts.map

package/dist/components/select/Select.component.d.ts.map

@@ -1 +0,0 @@
-{"version":3,"file":"Select.component.d.ts","sourceRoot":"","sources":["../../../src/lib/components/select/Select.component.tsx"],"names":[],"mappings":"AAKA,MAAM,MAAM,IAAI,GAAG;IACjB,KAAK,EAAE,MAAM,CAAC;IACd,KAAK,EAAE,MAAM,GAAG,MAAM,CAAC;CACxB,CAAC;AACF,KAAK,KAAK,GAAG,KAAK,CAAC,IAAI,CAAC,CAAC;AACzB,KAAK,KAAK,GAAG;IACX,EAAE,CAAC,EAAE,GAAG,CAAC;IACT,OAAO,EAAE,KAAK,CAAC;IACf,iBAAiB,CAAC,EAAE,CAAC,IAAI,EAAE,GAAG,KAAK,GAAG,CAAC,OAAO,CAAC;CAChD,CAAC;AAqEF,iBAAS,SAAS,CAAC,EAAE,OAAO,EAAE,iBAAiB,EAAE,GAAG,IAAI,EAAE,EAAE,KAAK,2CAYhE;AAED,eAAO,MAAM,MAAM,kBAAY,CAAC"}

package/dist/components/select/Select.component.js

@@ -1,71 +0,0 @@
-import { jsx as _jsx } from "react/jsx-runtime";
-import ReactSelect from 'react-select';
-import styled from 'styled-components';
-import { fontSize, fontWeight, gray, zIndex } from '../../style/theme';
-import { getThemePropSelector } from '../../utils';
-const SelectContainer = styled.div `
-  font-size: ${fontSize.base};
-  .sc-select__control {
-    background-color: ${getThemePropSelector('backgroundLevel1')};
-    border-radius: 4px;
-    border: 1px solid ${getThemePropSelector('border')};
-    height: auto;
-
-    .sc-select__placeholder,
-    .sc-select__single-value {
-      color: ${getThemePropSelector('textSecondary')};
-    }
-    &.sc-select__control--is-focused {
-      border-color: ${getThemePropSelector('selectedActive')};
-      box-shadow: inset 0 1px 1px rgba(0, 0, 0, 0.075),
-        0 0 0 1px rgba(0, 126, 255, 0.1);
-      outline: none;
-    }
-    .sc-select__indicator {
-      color: ${getThemePropSelector('textSecondary')};
-      &.sc-select__dropdown-indicator:hover {
-        color: ${getThemePropSelector('selectedActive')};
-      }
-      &.sc-select__clear-indicator:hover {
-        color: ${gray};
-      }
-    }
-    .sc-select__multi-value__remove {
-      border-radius: 0;
-      color: ${getThemePropSelector('textSecondary')};
-      background-color: ${getThemePropSelector('backgroundLevel4')};
-      &:hover {
-        color: ${gray};
-      }
-    }
-    .sc-select__multi-value__label {
-      border-radius: 0;
-      color: ${getThemePropSelector('selectedActive')};
-      background-color: ${getThemePropSelector('backgroundLevel4')};
-      vertical-align: initial;
-    }
-  }
-  .sc-select__menu {
-    background-color: ${getThemePropSelector('backgroundLevel1')};
-    color: ${getThemePropSelector('textSecondary')};
-    border: 1px solid ${getThemePropSelector('selectedActive')};
-    box-sizing: border-box;
-    overflow: hidden;
-    z-index: ${zIndex.dropdown};
-    .sc-select__option {
-      &.sc-select__option--is-focused {
-        background-color: ${getThemePropSelector('backgroundLevel1')};
-      }
-      &.sc-select__option--is-selected {
-        background-color: ${getThemePropSelector('backgroundLevel1')};
-        color: ${getThemePropSelector('selectedActive')};
-        font-weight: ${fontWeight.bold};
-      }
-    }
-  }
-`;
-const defaultFormatOptionLabel = ({ label, ...rest }) => (_jsx("div", { className: "sc-select-option-label", ...rest, children: label }));
-function SelectBox({ options, formatOptionLabel, ...rest }) {
-    return (_jsx(SelectContainer, { className: "sc-select-container", children: _jsx(ReactSelect, { className: "sc-select", classNamePrefix: "sc-select", options: options, formatOptionLabel: formatOptionLabel || defaultFormatOptionLabel, ...rest }) }));
-}
-export const Select = SelectBox;

package/dist/components/spacedbox/SpacedBox.d.ts

@@ -1,34 +0,0 @@
-type SpacingValue = 0 | 1 | 2 | 4 | 8 | 12 | 14 | 16 | 20 | 24 | 28 | 32;
-export type Props = {
-    m?: SpacingValue;
-    mt?: SpacingValue;
-    mr?: SpacingValue;
-    mb?: SpacingValue;
-    ml?: SpacingValue;
-    mx?: SpacingValue;
-    my?: SpacingValue;
-    p?: SpacingValue;
-    pt?: SpacingValue;
-    pr?: SpacingValue;
-    pb?: SpacingValue;
-    pl?: SpacingValue;
-    px?: SpacingValue;
-    py?: SpacingValue;
-};
-/**
- * @deprecated
- * Please use Box with import { Box } from '@scality/core-ui/dist/next';
- *
- * Most common use cases:
- *
- * `<SpacedBox m={14}><Component /></SpacedBox>`
- *
- * `<SpacedBox as={SpanComponent}><Component /></SpacedBox>`
- *
- * Props : m, mt, mr, mb, ml, mx, my, p, pt, pr, pb, pl, px, py
- *
- * Values: 0, 1, 2, 4, 8, 12, 14, 16, 20, 24, 28, 32
- */
-declare const SpacedBox: import("styled-components").StyledComponent<"div", import("styled-components").DefaultTheme, Props, never>;
-export { SpacedBox };
-//# sourceMappingURL=SpacedBox.d.ts.map

package/dist/components/spacedbox/SpacedBox.d.ts.map

@@ -1 +0,0 @@
-{"version":3,"file":"SpacedBox.d.ts","sourceRoot":"","sources":["../../../src/lib/components/spacedbox/SpacedBox.ts"],"names":[],"mappings":"AAEA,KAAK,YAAY,GAAG,CAAC,GAAG,CAAC,GAAG,CAAC,GAAG,CAAC,GAAG,CAAC,GAAG,EAAE,GAAG,EAAE,GAAG,EAAE,GAAG,EAAE,GAAG,EAAE,GAAG,EAAE,GAAG,EAAE,CAAC;AACzE,MAAM,MAAM,KAAK,GAAG;IAClB,CAAC,CAAC,EAAE,YAAY,CAAC;IACjB,EAAE,CAAC,EAAE,YAAY,CAAC;IAClB,EAAE,CAAC,EAAE,YAAY,CAAC;IAClB,EAAE,CAAC,EAAE,YAAY,CAAC;IAClB,EAAE,CAAC,EAAE,YAAY,CAAC;IAClB,EAAE,CAAC,EAAE,YAAY,CAAC;IAClB,EAAE,CAAC,EAAE,YAAY,CAAC;IAClB,CAAC,CAAC,EAAE,YAAY,CAAC;IACjB,EAAE,CAAC,EAAE,YAAY,CAAC;IAClB,EAAE,CAAC,EAAE,YAAY,CAAC;IAClB,EAAE,CAAC,EAAE,YAAY,CAAC;IAClB,EAAE,CAAC,EAAE,YAAY,CAAC;IAClB,EAAE,CAAC,EAAE,YAAY,CAAC;IAClB,EAAE,CAAC,EAAE,YAAY,CAAC;CACnB,CAAC;AAmEF;;;;;;;;;;;;;GAaG;AACH,QAAA,MAAM,SAAS,4GAed,CAAC;AACF,OAAO,EAAE,SAAS,EAAE,CAAC"}