@stokr/components-library 2.3.65-beta.10 → 2.3.65-beta.12

package/dist/components/StatusTag/StatusTag.stories.js

@@ -1,262 +0,0 @@
-"use strict";
-
-Object.defineProperty(exports, "__esModule", {
-  value: true
-});
-exports.default = exports.WithTooltips = exports.WithHoverColor = exports.UsingChildren = exports.TableUniformity = exports.Default = exports.CustomIcon = exports.Clickable = exports.AllVariants = exports.AllStatesInRow = void 0;
-var _react = _interopRequireDefault(require("react"));
-var _StatusTag = _interopRequireDefault(require("./StatusTag"));
-var _ComponentWrapper = require("../ComponentWrapper/ComponentWrapper.styles");
-var _Icon = require("../Icon/Icon.style");
-var _colors = _interopRequireDefault(require("../../styles/colors"));
-var _global = _interopRequireDefault(require("../../styles/global"));
-function _interopRequireDefault(e) { return e && e.__esModule ? e : { default: e }; }
-var _default = exports.default = {
-  title: 'Components Library/StatusTag',
-  component: _StatusTag.default,
-  decorators: [Story => /*#__PURE__*/_react.default.createElement(_react.default.Fragment, null, /*#__PURE__*/_react.default.createElement(_global.default, null), /*#__PURE__*/_react.default.createElement(Story, null))],
-  argTypes: {
-    variant: {
-      control: {
-        type: 'select'
-      },
-      options: ['pending', 'initiated', 'confirmed', 'declined', 'paid', null],
-      description: 'Built-in variant (uses default icon and colors)'
-    },
-    text: {
-      control: 'text',
-      description: 'Text to display next to the icon'
-    },
-    icon: {
-      control: false,
-      description: 'Custom icon component (overrides variant icon)'
-    },
-    tooltip: {
-      control: 'text',
-      description: 'Tooltip text (uses InfoIcon)'
-    },
-    iconColor: {
-      control: 'color',
-      description: 'Default icon color (defaults to grey)'
-    },
-    hoverColor: {
-      control: 'color',
-      description: 'Icon color on hover'
-    },
-    disableHoverColor: {
-      control: 'boolean',
-      description: 'Disable hover color change (for pre-colored icons)',
-      defaultValue: false
-    },
-    minWidth: {
-      control: 'text',
-      description: 'Minimum width (for table uniformity)'
-    },
-    onClick: {
-      action: 'clicked',
-      description: 'Click handler'
-    }
-  }
-}; // Default example
-const Default = () => /*#__PURE__*/_react.default.createElement(_ComponentWrapper.ComponentWrapper, null, /*#__PURE__*/_react.default.createElement(_StatusTag.default, {
-  variant: "pending",
-  text: "Pending"
-}));
-
-// All variants
-exports.Default = Default;
-const AllVariants = () => /*#__PURE__*/_react.default.createElement(_ComponentWrapper.ComponentWrapper, null, /*#__PURE__*/_react.default.createElement("div", {
-  style: {
-    display: 'flex',
-    flexDirection: 'column',
-    gap: '16px'
-  }
-}, /*#__PURE__*/_react.default.createElement(_StatusTag.default, {
-  variant: "pending",
-  text: "Pending"
-}), /*#__PURE__*/_react.default.createElement(_StatusTag.default, {
-  variant: "initiated",
-  text: "Initiated"
-}), /*#__PURE__*/_react.default.createElement(_StatusTag.default, {
-  variant: "confirmed",
-  text: "Confirmed"
-}), /*#__PURE__*/_react.default.createElement(_StatusTag.default, {
-  variant: "declined",
-  text: "Declined"
-}), /*#__PURE__*/_react.default.createElement(_StatusTag.default, {
-  variant: "paid",
-  text: "Paid"
-})));
-
-// Using children instead of text prop
-exports.AllVariants = AllVariants;
-const UsingChildren = () => /*#__PURE__*/_react.default.createElement(_ComponentWrapper.ComponentWrapper, null, /*#__PURE__*/_react.default.createElement("div", {
-  style: {
-    display: 'flex',
-    flexDirection: 'column',
-    gap: '16px'
-  }
-}, /*#__PURE__*/_react.default.createElement(_StatusTag.default, {
-  variant: "pending"
-}, "Pending"), /*#__PURE__*/_react.default.createElement(_StatusTag.default, {
-  variant: "initiated"
-}, "Initiated"), /*#__PURE__*/_react.default.createElement(_StatusTag.default, {
-  variant: "paid"
-}, "Paid")));
-
-// With hover color change
-exports.UsingChildren = UsingChildren;
-const WithHoverColor = () => /*#__PURE__*/_react.default.createElement(_ComponentWrapper.ComponentWrapper, null, /*#__PURE__*/_react.default.createElement("div", {
-  style: {
-    display: 'flex',
-    flexDirection: 'column',
-    gap: '16px'
-  }
-}, /*#__PURE__*/_react.default.createElement("div", null, /*#__PURE__*/_react.default.createElement("h4", {
-  style: {
-    marginBottom: '8px',
-    fontSize: '14px'
-  }
-}, "Pending (hover to see color change)"), /*#__PURE__*/_react.default.createElement(_StatusTag.default, {
-  variant: "pending",
-  text: "Pending"
-})), /*#__PURE__*/_react.default.createElement("div", null, /*#__PURE__*/_react.default.createElement("h4", {
-  style: {
-    marginBottom: '8px',
-    fontSize: '14px'
-  }
-}, "Custom hover color"), /*#__PURE__*/_react.default.createElement(_StatusTag.default, {
-  variant: "pending",
-  text: "Custom Hover",
-  hoverColor: _colors.default.blue
-}))));
-
-// Custom icon
-exports.WithHoverColor = WithHoverColor;
-const CustomIcon = () => /*#__PURE__*/_react.default.createElement(_ComponentWrapper.ComponentWrapper, null, /*#__PURE__*/_react.default.createElement("div", {
-  style: {
-    display: 'flex',
-    flexDirection: 'column',
-    gap: '16px'
-  }
-}, /*#__PURE__*/_react.default.createElement(_StatusTag.default, {
-  icon: /*#__PURE__*/_react.default.createElement(_Icon.Icon, {
-    icon: _Icon.iconsMap.check,
-    size: 12
-  }),
-  text: "Custom Icon",
-  hoverColor: _colors.default.freshGreen
-}), /*#__PURE__*/_react.default.createElement(_StatusTag.default, {
-  icon: /*#__PURE__*/_react.default.createElement(_Icon.Icon, {
-    icon: _Icon.iconsMap.warning,
-    size: 12
-  }),
-  text: "Warning",
-  hoverColor: _colors.default.warningOrange
-})));
-
-// With tooltips
-exports.CustomIcon = CustomIcon;
-const WithTooltips = () => /*#__PURE__*/_react.default.createElement(_ComponentWrapper.ComponentWrapper, null, /*#__PURE__*/_react.default.createElement("div", {
-  style: {
-    display: 'flex',
-    flexDirection: 'column',
-    gap: '16px'
-  }
-}, /*#__PURE__*/_react.default.createElement(_StatusTag.default, {
-  variant: "pending",
-  text: "Pending",
-  tooltip: "This transaction is awaiting confirmation"
-}), /*#__PURE__*/_react.default.createElement(_StatusTag.default, {
-  variant: "initiated",
-  text: "Initiated",
-  tooltip: "Transaction has been initiated and is in progress"
-}), /*#__PURE__*/_react.default.createElement(_StatusTag.default, {
-  variant: "paid",
-  text: "Paid",
-  tooltip: "Payment has been successfully completed"
-})));
-
-// Table uniformity
-exports.WithTooltips = WithTooltips;
-const TableUniformity = () => /*#__PURE__*/_react.default.createElement(_ComponentWrapper.ComponentWrapper, null, /*#__PURE__*/_react.default.createElement("div", {
-  style: {
-    display: 'flex',
-    flexDirection: 'column',
-    gap: '8px'
-  }
-}, /*#__PURE__*/_react.default.createElement("h4", {
-  style: {
-    marginBottom: '8px',
-    fontSize: '14px'
-  }
-}, "All tags with same minWidth (for table columns)"), /*#__PURE__*/_react.default.createElement(_StatusTag.default, {
-  variant: "pending",
-  text: "Pending",
-  minWidth: "120px",
-  center: true
-}), /*#__PURE__*/_react.default.createElement(_StatusTag.default, {
-  variant: "initiated",
-  text: "Initiated",
-  minWidth: "120px",
-  center: true
-}), /*#__PURE__*/_react.default.createElement(_StatusTag.default, {
-  variant: "confirmed",
-  text: "Confirmed",
-  minWidth: "120px",
-  center: true
-}), /*#__PURE__*/_react.default.createElement(_StatusTag.default, {
-  variant: "declined",
-  text: "Declined",
-  minWidth: "120px",
-  center: true
-}), /*#__PURE__*/_react.default.createElement(_StatusTag.default, {
-  variant: "paid",
-  text: "Paid",
-  minWidth: "120px",
-  center: true
-})));
-
-// Clickable
-exports.TableUniformity = TableUniformity;
-const Clickable = () => /*#__PURE__*/_react.default.createElement(_ComponentWrapper.ComponentWrapper, null, /*#__PURE__*/_react.default.createElement("div", {
-  style: {
-    display: 'flex',
-    flexDirection: 'column',
-    gap: '16px'
-  }
-}, /*#__PURE__*/_react.default.createElement(_StatusTag.default, {
-  variant: "pending",
-  text: "Clickable Pending",
-  onClick: () => alert('Clicked!')
-}), /*#__PURE__*/_react.default.createElement(_StatusTag.default, {
-  variant: "paid",
-  text: "Clickable Paid",
-  onClick: () => alert('Paid clicked!')
-})));
-
-// All states in a row
-exports.Clickable = Clickable;
-const AllStatesInRow = () => /*#__PURE__*/_react.default.createElement(_ComponentWrapper.ComponentWrapper, null, /*#__PURE__*/_react.default.createElement("div", {
-  style: {
-    display: 'flex',
-    flexWrap: 'wrap',
-    gap: '12px'
-  }
-}, /*#__PURE__*/_react.default.createElement(_StatusTag.default, {
-  variant: "pending",
-  text: "Pending"
-}), /*#__PURE__*/_react.default.createElement(_StatusTag.default, {
-  variant: "initiated",
-  text: "Initiated"
-}), /*#__PURE__*/_react.default.createElement(_StatusTag.default, {
-  variant: "confirmed",
-  text: "Confirmed"
-}), /*#__PURE__*/_react.default.createElement(_StatusTag.default, {
-  variant: "declined",
-  text: "Declined"
-}), /*#__PURE__*/_react.default.createElement(_StatusTag.default, {
-  variant: "paid",
-  text: "Paid"
-})));
-exports.AllStatesInRow = AllStatesInRow;

package/dist/components/StepController/StepController.stories.js

@@ -1,60 +0,0 @@
-"use strict";
-
-Object.defineProperty(exports, "__esModule", {
-  value: true
-});
-exports.default = exports.SCTouched1Done0 = void 0;
-var _react = _interopRequireDefault(require("react"));
-var _StepController = require("./StepController");
-var _SvgIcons = require("../SvgIcons");
-var _global = _interopRequireDefault(require("../../styles/global"));
-function _interopRequireDefault(e) { return e && e.__esModule ? e : { default: e }; }
-var _default = exports.default = {
-  title: 'Components Library/StepController/Stepcontroller',
-  component: _StepController.StepController,
-  argTypes: {
-    children: {
-      type: 'node',
-      defaultValue: [],
-      required: true
-    },
-    stepsProgressList: {
-      type: 'node',
-      defaultValue: [],
-      required: true
-    },
-    currentStep: {
-      type: 'string',
-      defaultValue: '',
-      required: true
-    },
-    activeStepIndex: {
-      type: 'number',
-      defaultValue: 1,
-      required: true
-    },
-    touchedStepsIndexes: {
-      type: 'array of numbers',
-      defaultValue: []
-    },
-    doneStepsIndexes: {
-      type: 'array of numbers',
-      defaultValue: []
-    },
-    changeStep: {
-      type: 'function',
-      action: 'changeStep'
-    }
-  }
-};
-const Template = args => /*#__PURE__*/_react.default.createElement(_react.default.Fragment, null, /*#__PURE__*/_react.default.createElement(_global.default, null), /*#__PURE__*/_react.default.createElement(_StepController.StepController, args));
-const SCTouched1Done0 = exports.SCTouched1Done0 = Template.bind({});
-SCTouched1Done0.args = {
-  children: [/*#__PURE__*/_react.default.createElement(_SvgIcons.OneSvg, null), /*#__PURE__*/_react.default.createElement(_SvgIcons.TwoSvg, null), /*#__PURE__*/_react.default.createElement(_SvgIcons.FourSvg, null)],
-  stepsProgressList: [/*#__PURE__*/_react.default.createElement(_SvgIcons.OneSvg, null), /*#__PURE__*/_react.default.createElement(_SvgIcons.TwoSvg, null), /*#__PURE__*/_react.default.createElement(_SvgIcons.FourSvg, null)],
-  touchedStepsIndexes: [1],
-  doneStepsIndexes: [0]
-};
-
-//doublecheck:
-// no story for StepControllerContext. varying export names

package/dist/components/StepController/StepControllerProgress.stories.js

@@ -1,49 +0,0 @@
-"use strict";
-
-Object.defineProperty(exports, "__esModule", {
-  value: true
-});
-exports.default = exports.SCPTouched2Done2 = void 0;
-var _react = _interopRequireDefault(require("react"));
-var _StepControllerProgress = require("./StepControllerProgress");
-var _SvgIcons = require("../SvgIcons");
-var _global = _interopRequireDefault(require("../../styles/global"));
-function _interopRequireDefault(e) { return e && e.__esModule ? e : { default: e }; }
-var _default = exports.default = {
-  title: 'Components Library/StepController/StepControllerProgress',
-  component: _StepControllerProgress.StepControllerProgress,
-  argTypes: {
-    stepsProgressList: {
-      type: 'node',
-      defaultValue: [],
-      required: true
-    },
-    activeStepIndex: {
-      type: 'number',
-      defaultValue: 1,
-      required: true
-    },
-    touchedStepsIndexes: {
-      type: 'array of numbers',
-      defaultValue: []
-    },
-    doneStepsIndexes: {
-      type: 'array of numbers',
-      defaultValue: []
-    },
-    handleItemClick: {
-      type: 'function',
-      action: 'handleItemClick'
-    }
-  }
-};
-const Template = args => /*#__PURE__*/_react.default.createElement(_react.default.Fragment, null, /*#__PURE__*/_react.default.createElement(_global.default, null), /*#__PURE__*/_react.default.createElement(_StepControllerProgress.StepControllerProgress, args));
-const SCPTouched2Done2 = exports.SCPTouched2Done2 = Template.bind({});
-SCPTouched2Done2.args = {
-  stepsProgressList: [/*#__PURE__*/_react.default.createElement(_SvgIcons.OneSvg, null), /*#__PURE__*/_react.default.createElement(_SvgIcons.TwoSvg, null), /*#__PURE__*/_react.default.createElement(_SvgIcons.FourSvg, null)],
-  touchedStepsIndexes: [2],
-  doneStepsIndexes: [2]
-};
-
-//doublecheck:
-// no story for StepControllerContext bc of varying export names

package/dist/components/StepsProgress/StepIndicator.stories.js

@@ -1,153 +0,0 @@
-"use strict";
-
-Object.defineProperty(exports, "__esModule", {
-  value: true
-});
-exports.default = exports.WithoutLabels = exports.SecondStep = exports.ManySteps = exports.LastStep = exports.Interactive = exports.Default = exports.CustomMargin = exports.AllCompleted = void 0;
-var _react = _interopRequireWildcard(require("react"));
-var _StepIndicator = _interopRequireDefault(require("./StepIndicator"));
-var _ComponentWrapper = require("../ComponentWrapper/ComponentWrapper.styles");
-var _global = _interopRequireDefault(require("../../styles/global"));
-function _interopRequireDefault(e) { return e && e.__esModule ? e : { default: e }; }
-function _interopRequireWildcard(e, t) { if ("function" == typeof WeakMap) var r = new WeakMap(), n = new WeakMap(); return (_interopRequireWildcard = function (e, t) { if (!t && e && e.__esModule) return e; var o, i, f = { __proto__: null, default: e }; if (null === e || "object" != typeof e && "function" != typeof e) return f; if (o = t ? n : r) { if (o.has(e)) return o.get(e); o.set(e, f); } for (const t in e) "default" !== t && {}.hasOwnProperty.call(e, t) && ((i = (o = Object.defineProperty) && Object.getOwnPropertyDescriptor(e, t)) && (i.get || i.set) ? o(f, t, i) : f[t] = e[t]); return f; })(e, t); }
-var _default = exports.default = {
-  title: 'Components Library/StepIndicator',
-  component: _StepIndicator.default,
-  decorators: [Story => /*#__PURE__*/_react.default.createElement(_react.default.Fragment, null, /*#__PURE__*/_react.default.createElement(_global.default, null), /*#__PURE__*/_react.default.createElement(Story, null))],
-  argTypes: {
-    currentStep: {
-      control: {
-        type: 'number',
-        min: 0,
-        max: 3
-      },
-      description: 'Current active step (0-indexed)'
-    },
-    showLabels: {
-      control: 'boolean',
-      description: 'Show or hide step labels'
-    },
-    marginBottom: {
-      control: 'text',
-      description: 'Bottom margin of the component'
-    }
-  }
-};
-const sampleSteps = [{
-  id: 'step1',
-  label: 'Details'
-}, {
-  id: 'step2',
-  label: 'Review'
-}, {
-  id: 'step3',
-  label: 'Confirm'
-}];
-
-// Default - first step active
-const Default = () => /*#__PURE__*/_react.default.createElement(_ComponentWrapper.ComponentWrapper, null, /*#__PURE__*/_react.default.createElement(_StepIndicator.default, {
-  steps: sampleSteps,
-  currentStep: 0
-}));
-
-// Second step active (first completed)
-exports.Default = Default;
-const SecondStep = () => /*#__PURE__*/_react.default.createElement(_ComponentWrapper.ComponentWrapper, null, /*#__PURE__*/_react.default.createElement(_StepIndicator.default, {
-  steps: sampleSteps,
-  currentStep: 1
-}));
-
-// Last step active (all previous completed)
-exports.SecondStep = SecondStep;
-const LastStep = () => /*#__PURE__*/_react.default.createElement(_ComponentWrapper.ComponentWrapper, null, /*#__PURE__*/_react.default.createElement(_StepIndicator.default, {
-  steps: sampleSteps,
-  currentStep: 2
-}));
-
-// All steps completed
-exports.LastStep = LastStep;
-const AllCompleted = () => /*#__PURE__*/_react.default.createElement(_ComponentWrapper.ComponentWrapper, null, /*#__PURE__*/_react.default.createElement(_StepIndicator.default, {
-  steps: sampleSteps,
-  currentStep: 3
-}));
-
-// Interactive example
-exports.AllCompleted = AllCompleted;
-const Interactive = () => {
-  const [currentStep, setCurrentStep] = (0, _react.useState)(0);
-  return /*#__PURE__*/_react.default.createElement(_ComponentWrapper.ComponentWrapper, null, /*#__PURE__*/_react.default.createElement(_StepIndicator.default, {
-    steps: sampleSteps,
-    currentStep: currentStep,
-    onStepClick: index => setCurrentStep(index)
-  }), /*#__PURE__*/_react.default.createElement("div", {
-    style: {
-      marginTop: '24px'
-    }
-  }, /*#__PURE__*/_react.default.createElement("button", {
-    onClick: () => setCurrentStep(prev => Math.max(0, prev - 1)),
-    disabled: currentStep === 0,
-    style: {
-      marginRight: '8px',
-      padding: '8px 16px'
-    }
-  }, "Previous"), /*#__PURE__*/_react.default.createElement("button", {
-    onClick: () => setCurrentStep(prev => Math.min(sampleSteps.length, prev + 1)),
-    disabled: currentStep >= sampleSteps.length,
-    style: {
-      padding: '8px 16px'
-    }
-  }, "Next")), /*#__PURE__*/_react.default.createElement("p", {
-    style: {
-      marginTop: '16px',
-      fontSize: '14px',
-      color: '#666'
-    }
-  }, "Current step: ", currentStep, " (click on steps to navigate)"));
-};
-
-// Without labels
-exports.Interactive = Interactive;
-const WithoutLabels = () => /*#__PURE__*/_react.default.createElement(_ComponentWrapper.ComponentWrapper, null, /*#__PURE__*/_react.default.createElement(_StepIndicator.default, {
-  steps: sampleSteps,
-  currentStep: 1,
-  showLabels: false
-}));
-
-// More steps
-exports.WithoutLabels = WithoutLabels;
-const ManySteps = () => {
-  const manySteps = [{
-    id: 'step1',
-    label: 'Account'
-  }, {
-    id: 'step2',
-    label: 'Personal'
-  }, {
-    id: 'step3',
-    label: 'Documents'
-  }, {
-    id: 'step4',
-    label: 'Review'
-  }, {
-    id: 'step5',
-    label: 'Complete'
-  }];
-  return /*#__PURE__*/_react.default.createElement(_ComponentWrapper.ComponentWrapper, null, /*#__PURE__*/_react.default.createElement(_StepIndicator.default, {
-    steps: manySteps,
-    currentStep: 2
-  }));
-};
-
-// Custom margin
-exports.ManySteps = ManySteps;
-const CustomMargin = () => /*#__PURE__*/_react.default.createElement(_ComponentWrapper.ComponentWrapper, null, /*#__PURE__*/_react.default.createElement(_StepIndicator.default, {
-  steps: sampleSteps,
-  currentStep: 1,
-  marginBottom: "0"
-}), /*#__PURE__*/_react.default.createElement("p", {
-  style: {
-    margin: 0,
-    fontSize: '14px'
-  }
-}, "Content immediately below (no margin)"));
-exports.CustomMargin = CustomMargin;

package/dist/components/StepsProgress/StepsProgress.stories.js

@@ -1,49 +0,0 @@
-"use strict";
-
-Object.defineProperty(exports, "__esModule", {
-  value: true
-});
-exports.stepsProgress = exports.default = void 0;
-var _react = _interopRequireDefault(require("react"));
-var _StepsProgress = require("./StepsProgress");
-var _AuthContext = require("../../context/AuthContext");
-var _reactRouterDom = require("react-router-dom");
-function _interopRequireDefault(e) { return e && e.__esModule ? e : { default: e }; }
-//import { withKnobs, select, boolean, array } from '@storybook/addon-knobs'
-var _default = exports.default = {
-  title: 'Components Library/Steps Progress',
-  component: _StepsProgress.StepsProgress
-  //decorators: [withKnobs],
-}; //maybe change to args
-
-const stepsProgress = () => /*#__PURE__*/_react.default.createElement(_reactRouterDom.BrowserRouter, null, /*#__PURE__*/_react.default.createElement(_AuthContext.AuthProvider, null, /*#__PURE__*/_react.default.createElement(_StepsProgress.StepsProgress, {
-  user: {
-    //country: select('country', ['', 'Austria', 'Brazil']),
-    // kyc_status: select('kyc_status', [
-    //   '',
-    //   'Draft',
-    //   'Pending',
-    //   'Approved',
-    //   'Accepted',
-    //   'Rejected',
-    //   'Denied',
-    //   'Escalated',
-    //   'In progress',
-    //   'Reapply',
-    // ]),
-    // KYCDocuments: {
-    //   status: select('KYCDocuments', [
-    //     '',
-    //     'Pending',
-    //     'Approved',
-    //     'Rejected',
-    //   ]),
-    // },
-    // entity_name: select('entity_name', ['', 'Some entity name']),
-    // investor_eth_addresses: array('investor_eth_addresses', []),
-    // is_risk_questionnaire_finished: boolean(
-    //   'is_risk_questionnaire_finished',
-    // ),
-  }
-})));
-exports.stepsProgress = stepsProgress;

package/dist/components/Switch/Switch.stories.js

@@ -1,81 +0,0 @@
-"use strict";
-
-Object.defineProperty(exports, "__esModule", {
-  value: true
-});
-exports.default = exports.SwitchMobile = exports.SwitchDefault = exports.SwitchDark = void 0;
-var _react = _interopRequireDefault(require("react"));
-var _Switch = _interopRequireDefault(require("./Switch"));
-var _ComponentWrapper = require("../ComponentWrapper/ComponentWrapper.styles");
-var _viewport = require("storybook/viewport");
-var _global = _interopRequireDefault(require("../../styles/global"));
-function _interopRequireDefault(e) { return e && e.__esModule ? e : { default: e }; }
-var _default = exports.default = {
-  title: 'Components Library/Switch',
-  component: _Switch.default,
-  argTypes: {
-    value: {
-      type: 'string',
-      required: true
-    },
-    value1: {
-      type: 'string',
-      required: true
-    },
-    value2: {
-      type: 'string',
-      required: true
-    },
-    handleChange: {
-      type: 'function',
-      required: true,
-      action: 'handleChange'
-    },
-    mobile: {
-      type: 'boolean',
-      defaultValue: false
-    },
-    dark: {
-      type: 'boolean',
-      defaultValue: false
-    }
-  },
-  parameters: {
-    viewport: {
-      viewports: _viewport.INITIAL_VIEWPORTS,
-      defaultViewport: 'reset viewport'
-    },
-    backgrounds: {
-      default: ''
-    }
-  }
-};
-const Template = args => /*#__PURE__*/_react.default.createElement(_react.default.Fragment, null, /*#__PURE__*/_react.default.createElement(_global.default, null), /*#__PURE__*/_react.default.createElement(_ComponentWrapper.ComponentWrapper, null, /*#__PURE__*/_react.default.createElement(_Switch.default, args)));
-const SwitchDefault = exports.SwitchDefault = Template.bind({});
-SwitchDefault.args = {};
-const SwitchDark = exports.SwitchDark = Template.bind({});
-SwitchDark.args = {
-  value: 'Initial Value',
-  value1: 'Click on Value 1',
-  value2: 'Click on Value 2',
-  dark: true
-};
-SwitchDark.parameters = {
-  backgrounds: {
-    default: 'black'
-  }
-};
-const SwitchMobile = exports.SwitchMobile = Template.bind({});
-SwitchMobile.args = {
-  value: 'Initial Value',
-  value1: 'Click on Value 1',
-  value2: 'Click on Value 2',
-  mobile: true
-};
-SwitchMobile.parameters = {
-  viewport: {
-    defaultViewport: 'iphonexsmax'
-  }
-};
-
-//now stories automatically changing to dark and mobile situatons