@pedidopago/ui 1.8.5 → 1.8.6

package/dist/components/RadioInput/radio-input.test.js

@@ -1,184 +0,0 @@
-"use strict";
-
-require("@testing-library/jest-dom");
-var _react = require("@testing-library/react");
-var _testUtils = require("../../shared/tests/test-utils");
-var _ChoiceList = _interopRequireDefault(require("./components/ChoiceList"));
-var _ = _interopRequireDefault(require("."));
-var _jsxRuntime = require("react/jsx-runtime");
-function _interopRequireDefault(obj) { return obj && obj.__esModule ? obj : { default: obj }; }
-describe('Radio Input', function () {
-  it('should render input', function () {
-    var fn = jest.fn();
-    var _render = (0, _testUtils.render)( /*#__PURE__*/(0, _jsxRuntime.jsx)(_.default, {
-        onChange: fn,
-        value: "test",
-        id: "test",
-        children: "Radio Test"
-      })),
-      container = _render.container;
-    var radio = container.querySelector('input[type="radio"]');
-    expect(radio).toBeInTheDocument();
-  });
-  it('should check input on Click on input', function () {
-    var fn = jest.fn();
-    var _render2 = (0, _testUtils.render)( /*#__PURE__*/(0, _jsxRuntime.jsx)(_ChoiceList.default, {
-        radiosName: "radio",
-        children: /*#__PURE__*/(0, _jsxRuntime.jsx)(_.default, {
-          onChange: fn,
-          value: "test",
-          id: "test",
-          children: "Radio Test"
-        })
-      })),
-      container = _render2.container;
-    var radio = container.querySelector('input[type="radio"]');
-    _react.fireEvent.click(radio);
-    expect(radio).toBeChecked();
-  });
-  it('should check input on Click label', function () {
-    var fn = jest.fn();
-    var _render3 = (0, _testUtils.render)( /*#__PURE__*/(0, _jsxRuntime.jsx)(_ChoiceList.default, {
-        radiosName: "radio",
-        children: /*#__PURE__*/(0, _jsxRuntime.jsx)(_.default, {
-          onChange: fn,
-          value: "test",
-          id: "test",
-          children: "Radio Test"
-        })
-      })),
-      container = _render3.container,
-      getByText = _render3.getByText;
-    var radio = container.querySelector('input[type="radio"]');
-    var label = getByText('Radio Test');
-    _react.fireEvent.click(label);
-    expect(radio).toBeChecked();
-  });
-  it('should checked input if defaultChecked is provided', function () {
-    var fn = jest.fn();
-    var _render4 = (0, _testUtils.render)( /*#__PURE__*/(0, _jsxRuntime.jsx)(_ChoiceList.default, {
-        defaultValue: "test",
-        radiosName: "radio",
-        children: /*#__PURE__*/(0, _jsxRuntime.jsx)(_.default, {
-          onChange: fn,
-          value: "test",
-          id: "test",
-          children: "Radio Test"
-        })
-      })),
-      container = _render4.container;
-    var radio = container.querySelector('input[type="radio"]');
-    expect(radio).toBeChecked();
-  });
-  it('should call onChange on Click input', function () {
-    var fn = jest.fn();
-    var _render5 = (0, _testUtils.render)( /*#__PURE__*/(0, _jsxRuntime.jsx)(_ChoiceList.default, {
-        onChangeValue: fn,
-        radiosName: "radio",
-        children: /*#__PURE__*/(0, _jsxRuntime.jsx)(_.default, {
-          value: "test",
-          id: "test",
-          children: "Radio Test"
-        })
-      })),
-      container = _render5.container;
-    _react.fireEvent.click(container);
-    expect(fn).toBeCalled();
-  });
-  it('Should ChoiceList disabled radio children is isDisabled is provided', function () {
-    var fn = jest.fn();
-    (0, _testUtils.render)( /*#__PURE__*/(0, _jsxRuntime.jsxs)(_ChoiceList.default, {
-      onChangeValue: fn,
-      isDisabled: true,
-      radiosName: "test-name",
-      defaultValue: "test3",
-      children: [/*#__PURE__*/(0, _jsxRuntime.jsx)(_.default, {
-        value: "test1",
-        id: "test",
-        children: "Radio Test 1"
-      }), /*#__PURE__*/(0, _jsxRuntime.jsx)(_.default, {
-        value: "test2",
-        id: "test",
-        children: "Radio Test 2"
-      }), /*#__PURE__*/(0, _jsxRuntime.jsx)(_.default, {
-        value: "test3",
-        id: "test",
-        children: "Radio Test 3"
-      })]
-    }));
-    var sut = _react.screen.getAllByRole('radio');
-    sut.forEach(function (value) {
-      expect(value).toBeDisabled();
-    });
-  });
-  it('should render helpText if helpText is provided', function () {
-    var fn = jest.fn();
-    (0, _testUtils.render)( /*#__PURE__*/(0, _jsxRuntime.jsxs)(_ChoiceList.default, {
-      onChangeValue: fn,
-      radiosName: "test-name",
-      defaultValue: "test3",
-      helpText: "Help Text",
-      children: [/*#__PURE__*/(0, _jsxRuntime.jsx)(_.default, {
-        value: "test1",
-        id: "test",
-        children: "Radio Test 1"
-      }), /*#__PURE__*/(0, _jsxRuntime.jsx)(_.default, {
-        value: "test2",
-        id: "test",
-        children: "Radio Test 2"
-      }), /*#__PURE__*/(0, _jsxRuntime.jsx)(_.default, {
-        value: "test3",
-        id: "test",
-        children: "Radio Test 3"
-      })]
-    }));
-    expect(_react.screen.getByText('Help Text')).toBeInTheDocument();
-  });
-  it('should render label if label is provided', function () {
-    var fn = jest.fn();
-    (0, _testUtils.render)( /*#__PURE__*/(0, _jsxRuntime.jsxs)(_ChoiceList.default, {
-      onChangeValue: fn,
-      label: "any_label",
-      radiosName: "test-name",
-      defaultValue: "test3",
-      helpText: "Help Text",
-      children: [/*#__PURE__*/(0, _jsxRuntime.jsx)(_.default, {
-        value: "test1",
-        id: "test",
-        children: "Radio Test 1"
-      }), /*#__PURE__*/(0, _jsxRuntime.jsx)(_.default, {
-        value: "test2",
-        id: "test",
-        children: "Radio Test 2"
-      }), /*#__PURE__*/(0, _jsxRuntime.jsx)(_.default, {
-        value: "test3",
-        id: "test",
-        children: "Radio Test 3"
-      })]
-    }));
-    expect(_react.screen.getByRole('radiogroup').children[1].tagName.toLowerCase()).toBe('label');
-  });
-  it('should not render label if label not provided', function () {
-    var fn = jest.fn();
-    (0, _testUtils.render)( /*#__PURE__*/(0, _jsxRuntime.jsxs)(_ChoiceList.default, {
-      onChangeValue: fn,
-      radiosName: "test-name",
-      defaultValue: "test3",
-      helpText: "Help Text",
-      children: [/*#__PURE__*/(0, _jsxRuntime.jsx)(_.default, {
-        value: "test1",
-        id: "test",
-        children: "Radio Test 1"
-      }), /*#__PURE__*/(0, _jsxRuntime.jsx)(_.default, {
-        value: "test2",
-        id: "test",
-        children: "Radio Test 2"
-      }), /*#__PURE__*/(0, _jsxRuntime.jsx)(_.default, {
-        value: "test3",
-        id: "test",
-        children: "Radio Test 3"
-      })]
-    }));
-    expect(_react.screen.getByRole('radiogroup').children[1].tagName.toLowerCase()).not.toBe('label');
-  });
-});

package/dist/components/RadioInput/styles.d.ts

@@ -1,31 +0,0 @@
-/// <reference types="react" />
-import { IStyledRadioInput } from './types';
-export declare const Wrapper: import("@emotion/styled").StyledComponent<{
-    theme?: import("@emotion/react").Theme | undefined;
-    as?: import("react").ElementType<any> | undefined;
-}, import("react").DetailedHTMLProps<import("react").HTMLAttributes<HTMLDivElement>, HTMLDivElement>, {}>;
-export declare const Label: import("@emotion/styled").StyledComponent<{
-    theme?: import("@emotion/react").Theme | undefined;
-    as?: import("react").ElementType<any> | undefined;
-}, import("react").DetailedHTMLProps<import("react").LabelHTMLAttributes<HTMLLabelElement>, HTMLLabelElement>, {}>;
-export declare const Input: import("@emotion/styled").StyledComponent<{
-    theme?: import("@emotion/react").Theme | undefined;
-    as?: import("react").ElementType<any> | undefined;
-} & IStyledRadioInput, import("react").DetailedHTMLProps<import("react").InputHTMLAttributes<HTMLInputElement>, HTMLInputElement>, {}>;
-export declare const ChoiceWrapper: import("@emotion/styled").StyledComponent<{
-    theme?: import("@emotion/react").Theme | undefined;
-    as?: import("react").ElementType<any> | undefined;
-}, import("react").DetailedHTMLProps<import("react").HTMLAttributes<HTMLDivElement>, HTMLDivElement>, {}>;
-export declare const ListWrapper: import("@emotion/styled").StyledComponent<{
-    theme?: import("@emotion/react").Theme | undefined;
-    as?: import("react").ElementType<any> | undefined;
-} & IStyledRadioInput, import("react").DetailedHTMLProps<import("react").HTMLAttributes<HTMLDivElement>, HTMLDivElement>, {}>;
-export declare const ChoiceLabel: import("@emotion/styled").StyledComponent<{
-    theme?: import("@emotion/react").Theme | undefined;
-    as?: import("react").ElementType<any> | undefined;
-} & IStyledRadioInput, import("react").DetailedHTMLProps<import("react").LabelHTMLAttributes<HTMLLabelElement>, HTMLLabelElement>, {}>;
-export declare const HelpText: import("@emotion/styled").StyledComponent<{
-    theme?: import("@emotion/react").Theme | undefined;
-    as?: import("react").ElementType<any> | undefined;
-} & IStyledRadioInput, import("react").DetailedHTMLProps<import("react").HTMLAttributes<HTMLSpanElement>, HTMLSpanElement>, {}>;
-//# sourceMappingURL=styles.d.ts.map

package/dist/components/RadioInput/styles.d.ts.map

@@ -1 +0,0 @@
-{"version":3,"file":"styles.d.ts","sourceRoot":"","sources":["../../../src/components/RadioInput/styles.ts"],"names":[],"mappings":";AAEA,OAAO,EAAE,iBAAiB,EAAE,MAAM,SAAS,CAAC;AAE5C,eAAO,MAAM,OAAO;;;yGAInB,CAAC;AAEF,eAAO,MAAM,KAAK;;;kHAGjB,CAAC;AAEF,eAAO,MAAM,KAAK;;;sIAgEjB,CAAC;AAEF,eAAO,MAAM,aAAa;;;yGAAe,CAAC;AAE1C,eAAO,MAAM,WAAW;;;6HAOvB,CAAC;AAEF,eAAO,MAAM,WAAW;;;sIASvB,CAAC;AAEF,eAAO,MAAM,QAAQ;;;+HASpB,CAAC"}

package/dist/components/RadioInput/styles.js

@@ -1,39 +0,0 @@
-"use strict";
-
-Object.defineProperty(exports, "__esModule", {
-  value: true
-});
-exports.Wrapper = exports.ListWrapper = exports.Label = exports.Input = exports.HelpText = exports.ChoiceWrapper = exports.ChoiceLabel = void 0;
-var _react = require("@emotion/react");
-var _styled = _interopRequireDefault(require("@emotion/styled"));
-var _templateObject, _templateObject2, _templateObject3, _templateObject4, _templateObject5, _templateObject6, _templateObject7, _templateObject8, _templateObject9, _templateObject10, _templateObject11;
-function _interopRequireDefault(obj) { return obj && obj.__esModule ? obj : { default: obj }; }
-function _taggedTemplateLiteral(strings, raw) { if (!raw) { raw = strings.slice(0); } return Object.freeze(Object.defineProperties(strings, { raw: { value: Object.freeze(raw) } })); }
-var Wrapper = _styled.default.div(_templateObject || (_templateObject = _taggedTemplateLiteral(["\n  display: flex;\n  align-items: center;\n  gap: 8px;\n"])));
-exports.Wrapper = Wrapper;
-var Label = _styled.default.label(_templateObject2 || (_templateObject2 = _taggedTemplateLiteral(["\n  font-weight: 500;\n  margin-right: 12px;\n"])));
-exports.Label = Label;
-var Input = _styled.default.input(_templateObject3 || (_templateObject3 = _taggedTemplateLiteral(["\n  ", "\n"])), function (_ref) {
-  var colors = _ref.theme.colors;
-  return (0, _react.css)(_templateObject4 || (_templateObject4 = _taggedTemplateLiteral(["\n    appearance: none;\n    display: flex;\n    justify-content: center;\n    align-items: center;\n    margin: 0;\n    min-width: 20px;\n    height: 20px;\n    border-radius: 50%;\n    border: 2px solid ", ";\n    transition: all ease 0.2s;\n    cursor: pointer;\n\n    + label {\n      color: ", ";\n      line-height: 20px;\n      cursor: pointer;\n    }\n\n    :hover {\n      border-color: ", ";\n    }\n\n    :disabled {\n      cursor: default;\n      border-color: ", ";\n      background-color: ", ";\n      + label {\n        color: ", ";\n        cursor: default;\n      }\n    }\n\n    :checked {\n      background-color: ", ";\n      border-color: ", ";\n      &:focus {\n        background-color: ", ";\n        border-color: ", ";\n        box-shadow: 0 0 0 2px ", ";\n      }\n      &:hover {\n        background-color: ", ";\n        border-color: ", ";\n      }\n      &:disabled {\n        background-color: ", ";\n        border-color: ", ";\n        + label {\n          color: ", ";\n          cursor: default;\n        }\n      }\n\n      &::after {\n        content: '';\n        width: 6px;\n        height: 6px;\n        background: #fff;\n        border-radius: 50%;\n      }\n    }\n  "])), colors.neutral.neutral2, colors.neutral.black, colors.primary.hover, colors.neutral.neutral1, colors.neutral.neutral1, colors.neutral.neutral2, colors.primary.default, colors.primary.default, colors.primary.focus, colors.primary.focus, colors.primary.disabled, colors.primary.hover, colors.primary.hover, colors.neutral.neutral2, colors.neutral.neutral2, colors.neutral.neutral4);
-});
-exports.Input = Input;
-var ChoiceWrapper = _styled.default.div(_templateObject5 || (_templateObject5 = _taggedTemplateLiteral([""])));
-exports.ChoiceWrapper = ChoiceWrapper;
-var ListWrapper = _styled.default.div(_templateObject6 || (_templateObject6 = _taggedTemplateLiteral(["\n  ", "\n"])), function (_ref2) {
-  var _ref2$alignDirection = _ref2.alignDirection,
-    alignDirection = _ref2$alignDirection === void 0 ? 'row' : _ref2$alignDirection;
-  return (0, _react.css)(_templateObject7 || (_templateObject7 = _taggedTemplateLiteral(["\n    display: flex;\n    flex-direction: ", ";\n    flex-wrap: wrap;\n    gap: 12px;\n  "])), alignDirection);
-});
-exports.ListWrapper = ListWrapper;
-var ChoiceLabel = _styled.default.label(_templateObject8 || (_templateObject8 = _taggedTemplateLiteral(["\n  ", "\n"])), function (_ref3) {
-  var colors = _ref3.theme.colors;
-  return (0, _react.css)(_templateObject9 || (_templateObject9 = _taggedTemplateLiteral(["\n    display: block;\n    font-weight: 500;\n    font-size: 16px;\n    line-height: 24px;\n    color: ", ";\n    margin-bottom: 16px;\n  "])), colors.neutral.black);
-});
-exports.ChoiceLabel = ChoiceLabel;
-var HelpText = _styled.default.span(_templateObject10 || (_templateObject10 = _taggedTemplateLiteral(["\n  ", "\n"])), function (_ref4) {
-  var theme = _ref4.theme,
-    textColor = _ref4.textColor;
-  return (0, _react.css)(_templateObject11 || (_templateObject11 = _taggedTemplateLiteral(["\n    font-size: ", ";\n    color: ", ";\n    font-weight: 500;\n    display: block;\n    padding-left: 30px;\n    margin-top: 18px;\n  "])), theme.fontSizes.xxs, textColor);
-});
-exports.HelpText = HelpText;

package/dist/components/RadioInput/types.d.ts

@@ -1,27 +0,0 @@
-import { ReactNode, InputHTMLAttributes } from 'react';
-export interface IRadioInputProps extends Omit<InputHTMLAttributes<HTMLInputElement>, 'type'> {
-    isDisabled?: boolean;
-    children?: ReactNode;
-}
-export interface ChoiceListProps extends InputHTMLAttributes<HTMLInputElement> {
-    onChangeValue?: (value?: string) => void;
-    label?: string;
-    defaultValue?: string;
-    isDisabled?: boolean;
-    radiosName: string;
-    alignDirection?: 'column' | 'row';
-    color?: string;
-    helpText?: string;
-    children: ReactNode;
-}
-export type ChoiceListContext = {
-    handleRadioClick: (e: string) => void;
-    defaultValue?: string;
-    groupName: string;
-    isDisabled?: boolean;
-};
-export interface IStyledRadioInput {
-    textColor?: string;
-    alignDirection?: 'column' | 'row';
-}
-//# sourceMappingURL=types.d.ts.map

package/dist/components/RadioInput/types.d.ts.map

@@ -1 +0,0 @@
-{"version":3,"file":"types.d.ts","sourceRoot":"","sources":["../../../src/components/RadioInput/types.ts"],"names":[],"mappings":"AAAA,OAAO,EAAE,SAAS,EAAE,mBAAmB,EAAE,MAAM,OAAO,CAAC;AAEvD,MAAM,WAAW,gBAAiB,SAAQ,IAAI,CAAC,mBAAmB,CAAC,gBAAgB,CAAC,EAAE,MAAM,CAAC;IAC3F,UAAU,CAAC,EAAE,OAAO,CAAC;IACrB,QAAQ,CAAC,EAAE,SAAS,CAAC;CACtB;AAED,MAAM,WAAW,eAAgB,SAAQ,mBAAmB,CAAC,gBAAgB,CAAC;IAC5E,aAAa,CAAC,EAAE,CAAC,KAAK,CAAC,EAAE,MAAM,KAAK,IAAI,CAAC;IACzC,KAAK,CAAC,EAAE,MAAM,CAAC;IACf,YAAY,CAAC,EAAE,MAAM,CAAC;IACtB,UAAU,CAAC,EAAE,OAAO,CAAC;IACrB,UAAU,EAAE,MAAM,CAAC;IACnB,cAAc,CAAC,EAAE,QAAQ,GAAG,KAAK,CAAC;IAClC,KAAK,CAAC,EAAE,MAAM,CAAC;IACf,QAAQ,CAAC,EAAE,MAAM,CAAC;IAClB,QAAQ,EAAE,SAAS,CAAC;CACrB;AAED,MAAM,MAAM,iBAAiB,GAAG;IAC9B,gBAAgB,EAAE,CAAC,CAAC,EAAE,MAAM,KAAK,IAAI,CAAC;IACtC,YAAY,CAAC,EAAE,MAAM,CAAC;IACtB,SAAS,EAAE,MAAM,CAAC;IAClB,UAAU,CAAC,EAAE,OAAO,CAAC;CACtB,CAAC;AAEF,MAAM,WAAW,iBAAiB;IAChC,SAAS,CAAC,EAAE,MAAM,CAAC;IACnB,cAAc,CAAC,EAAE,QAAQ,GAAG,KAAK,CAAC;CACnC"}

package/dist/components/RadioInput/types.js

@@ -1 +0,0 @@
-"use strict";

package/dist/components/RadioInput/utils/get-colors-props.d.ts

@@ -1,12 +0,0 @@
-export declare function getColorsProps(hue: number): {
-    black: string;
-    gray: string;
-    grayLightness: string;
-    graySaturation: string;
-    focus: string;
-    focusChecked: string;
-    shadowLightness: string;
-    saturation: string;
-    saturationFocus: string;
-};
-//# sourceMappingURL=get-colors-props.d.ts.map

package/dist/components/RadioInput/utils/get-colors-props.d.ts.map

@@ -1 +0,0 @@
-{"version":3,"file":"get-colors-props.d.ts","sourceRoot":"","sources":["../../../../src/components/RadioInput/utils/get-colors-props.ts"],"names":[],"mappings":"AAAA,wBAAgB,cAAc,CAAC,GAAG,EAAE,MAAM;;;;;;;;;;EAYzC"}

package/dist/components/RadioInput/utils/get-colors-props.js

@@ -1,19 +0,0 @@
-"use strict";
-
-Object.defineProperty(exports, "__esModule", {
-  value: true
-});
-exports.getColorsProps = getColorsProps;
-function getColorsProps(hue) {
-  return {
-    black: "hsl(".concat(hue + 4, ", ", 12, "%, ", 23, "%)"),
-    gray: "hsl(".concat(hue, ", ", 13, "%, ", 82, "%)"),
-    grayLightness: "hsl(".concat(hue + 4, ", ", 14, "%, ", 93, "%)"),
-    graySaturation: "hsl(".concat(hue + 2, ", ", 13, "%, ", 68, "%)"),
-    focus: "hsl(".concat(hue + 4, ", ", 13, "%, ", 50, "%)"),
-    focusChecked: "hsl(".concat(hue + 5, ", ", 73, "%, ", 35, "%)"),
-    shadowLightness: "hsl(".concat(hue + 5, ", ", 68, "%, ", 83, "%)"),
-    saturation: "hsl(".concat(hue + 5, ", ", 74, "%, ", 40, "%)"),
-    saturationFocus: "hsl(".concat(hue + 5, ", ", 73, "%, ", 35, "%)")
-  };
-}

package/dist/components/Steps/components/StepIconMobile/index.d.ts

@@ -1,4 +0,0 @@
-/// <reference types="react" />
-import { StepIconProps } from '../../types';
-export declare const StepIconMobile: ({ stepPosition, isSelectedStep, hasStartGradient, hasEndGratient, activeColor, }: StepIconProps) => JSX.Element;
-//# sourceMappingURL=index.d.ts.map

package/dist/components/Steps/components/StepIconMobile/index.d.ts.map

@@ -1 +0,0 @@
-{"version":3,"file":"index.d.ts","sourceRoot":"","sources":["../../../../../src/components/Steps/components/StepIconMobile/index.tsx"],"names":[],"mappings":";AAEA,OAAO,EAAE,aAAa,EAAE,MAAM,aAAa,CAAC;AAO5C,eAAO,MAAM,cAAc,qFAMxB,aAAa,gBAgGf,CAAC"}

package/dist/components/Steps/components/StepIconMobile/index.js

@@ -1,126 +0,0 @@
-"use strict";
-
-Object.defineProperty(exports, "__esModule", {
-  value: true
-});
-exports.StepIconMobile = void 0;
-var _react = require("@emotion/react");
-var _styled = _interopRequireDefault(require("@emotion/styled"));
-var _jsxRuntime = require("react/jsx-runtime");
-var _templateObject;
-function _interopRequireDefault(obj) { return obj && obj.__esModule ? obj : { default: obj }; }
-function _taggedTemplateLiteral(strings, raw) { if (!raw) { raw = strings.slice(0); } return Object.freeze(Object.defineProperties(strings, { raw: { value: Object.freeze(raw) } })); }
-var IconContainer = _styled.default.div(_templateObject || (_templateObject = _taggedTemplateLiteral(["\n  margin-right: 20px;\n  margin-bottom: -10px;\n"])));
-var StepIconMobile = function StepIconMobile(_ref) {
-  var stepPosition = _ref.stepPosition,
-    isSelectedStep = _ref.isSelectedStep,
-    hasStartGradient = _ref.hasStartGradient,
-    hasEndGratient = _ref.hasEndGratient,
-    _ref$activeColor = _ref.activeColor,
-    activeColor = _ref$activeColor === void 0 ? 'primary' : _ref$activeColor;
-  var theme = (0, _react.useTheme)();
-  var strokeColor = theme.colors[activeColor].default;
-  var neutralStrokeColor = theme.colors.neutral.neutral1;
-  return /*#__PURE__*/(0, _jsxRuntime.jsx)(_jsxRuntime.Fragment, {
-    children: isSelectedStep ? /*#__PURE__*/(0, _jsxRuntime.jsx)(IconContainer, {
-      children: /*#__PURE__*/(0, _jsxRuntime.jsxs)("svg", {
-        width: "16",
-        height: "81",
-        viewBox: "0 0 16 81",
-        fill: "none",
-        xmlns: "http://www.w3.org/2000/svg",
-        children: [/*#__PURE__*/(0, _jsxRuntime.jsx)("rect", {
-          width: "3",
-          height: "32",
-          transform: "translate(6.5 0.785156)",
-          fill: "url(#".concat(stepPosition, ")")
-        }), /*#__PURE__*/(0, _jsxRuntime.jsx)("circle", {
-          cx: "8",
-          cy: "40.7852",
-          r: "5",
-          fill: "#F8FAF9",
-          stroke: strokeColor,
-          strokeWidth: "6"
-        }), /*#__PURE__*/(0, _jsxRuntime.jsx)("rect", {
-          width: "3",
-          height: "32",
-          transform: "translate(6.5 48.7852)",
-          fill: "url(#".concat(stepPosition, "-2)")
-        }), /*#__PURE__*/(0, _jsxRuntime.jsxs)("defs", {
-          children: [/*#__PURE__*/(0, _jsxRuntime.jsxs)("linearGradient", {
-            id: stepPosition,
-            x1: "1.5",
-            y1: "33.5",
-            x2: "1.5",
-            y2: "5.63098e-10",
-            gradientUnits: "userSpaceOnUse",
-            children: [/*#__PURE__*/(0, _jsxRuntime.jsx)("stop", {
-              stopColor: strokeColor
-            }), hasStartGradient && /*#__PURE__*/(0, _jsxRuntime.jsx)("stop", {
-              offset: "1",
-              stopColor: strokeColor,
-              stopOpacity: "0"
-            })]
-          }), /*#__PURE__*/(0, _jsxRuntime.jsxs)("linearGradient", {
-            id: "".concat(stepPosition, "-2"),
-            x1: "1.88295",
-            y1: "-0.857085",
-            x2: "1.64628",
-            y2: "41.7156",
-            gradientUnits: "userSpaceOnUse",
-            children: [/*#__PURE__*/(0, _jsxRuntime.jsx)("stop", {
-              stopColor: strokeColor
-            }), hasEndGratient && /*#__PURE__*/(0, _jsxRuntime.jsx)("stop", {
-              offset: "1",
-              stopColor: strokeColor,
-              stopOpacity: "0"
-            })]
-          })]
-        })]
-      })
-    }) : /*#__PURE__*/(0, _jsxRuntime.jsx)(IconContainer, {
-      children: /*#__PURE__*/(0, _jsxRuntime.jsxs)("svg", {
-        width: "16",
-        height: "81",
-        viewBox: "0 0 16 81",
-        fill: "none",
-        xmlns: "http://www.w3.org/2000/svg",
-        children: [/*#__PURE__*/(0, _jsxRuntime.jsx)("rect", {
-          width: "3",
-          height: "32",
-          transform: "translate(6.5 0.785156)",
-          fill: neutralStrokeColor
-        }), /*#__PURE__*/(0, _jsxRuntime.jsx)("circle", {
-          cx: "8",
-          cy: "40.7852",
-          r: "7",
-          fill: "#F8FAF9",
-          stroke: "#B7C7C2",
-          strokeWidth: "2"
-        }), /*#__PURE__*/(0, _jsxRuntime.jsx)("rect", {
-          width: "3",
-          height: "32",
-          transform: "translate(6.5 48.7852)",
-          fill: "url(#".concat(stepPosition, ")")
-        }), /*#__PURE__*/(0, _jsxRuntime.jsx)("defs", {
-          children: /*#__PURE__*/(0, _jsxRuntime.jsxs)("linearGradient", {
-            id: stepPosition,
-            x1: "1.5",
-            y1: "0",
-            x2: "1.5",
-            y2: "32",
-            gradientUnits: "userSpaceOnUse",
-            children: [/*#__PURE__*/(0, _jsxRuntime.jsx)("stop", {
-              stopColor: neutralStrokeColor
-            }), hasEndGratient && /*#__PURE__*/(0, _jsxRuntime.jsx)("stop", {
-              offset: "1",
-              stopColor: neutralStrokeColor,
-              stopOpacity: "0"
-            })]
-          })
-        })]
-      })
-    })
-  });
-};
-exports.StepIconMobile = StepIconMobile;