@veeqo/ui 14.10.0-beta-1 → 14.10.0

package/dist/components/Search/styled.js

@@ -1,37 +0,0 @@
-import styled from 'styled-components';
-import { TextField } from '../TextField/index.js';
-import { BaseContainer } from '../BaseContainer/BaseContainer.js';
-import 'react';
-
-const Input = styled(TextField).withConfig({ displayName: "vui--Input", componentId: "vui--je6y84" }) `flex-grow:2;margin-top:0;margin-bottom:0;`;
-const IconContainer = styled.div.withConfig({ displayName: "vui--IconContainer", componentId: "vui--113gfe8" }) `position:absolute;`;
-const Container = styled(BaseContainer).withConfig({
-    shouldForwardProp: (prop) => !['iconPosition'].includes(prop),
-}) `
-  position: relative;
-  display: flex;
-  justify-content: flex-start;
-  align-items: center;
-  border-radius: 0.25rem;
-
-  ${({ iconPosition }) => {
-    let padding = 'padding-right: 2.5rem;';
-    let position = 'right: 0.5rem;';
-    if (iconPosition === 'left') {
-        padding = 'padding-left: 2.5rem';
-        position = 'left: 0.5rem;';
-    }
-    return `
-      & ${Input} {
-        ${padding}
-      }
-
-      & ${IconContainer} {
-        ${position}
-      }
-    `;
-}}
-`;
-
-export { Container, IconContainer, Input };
-//# sourceMappingURL=styled.js.map

package/dist/components/Search/styled.js.map

@@ -1 +0,0 @@
-{"version":3,"file":"styled.js","sources":["../../../src/components/Search/styled.ts"],"sourcesContent":["import styled from 'styled-components';\n\nimport { TextField } from '../TextField';\nimport { BaseContainer } from '../BaseContainer';\nimport { Loader } from '../Loader';\n\nconst Input = styled(TextField)`\n  flex-grow: 2;\n  margin-top: 0;\n  margin-bottom: 0;\n`;\n\nconst IconContainer = styled.div`\n  position: absolute;\n`;\n\nconst Container = styled(BaseContainer).withConfig({\n  shouldForwardProp: (prop) => !['iconPosition'].includes(prop),\n})<{ iconPosition: 'left' | 'right' }>`\n  position: relative;\n  display: flex;\n  justify-content: flex-start;\n  align-items: center;\n  border-radius: 0.25rem;\n\n  ${({ iconPosition }) => {\n    let padding = 'padding-right: 2.5rem;';\n    let position = 'right: 0.5rem;';\n\n    if (iconPosition === 'left') {\n      padding = 'padding-left: 2.5rem';\n      position = 'left: 0.5rem;';\n    }\n\n    return `\n      & ${Input} {\n        ${padding}\n      }\n\n      & ${IconContainer} {\n        ${position}\n      }\n    `;\n  }}\n`;\n\nexport { Container, Input, IconContainer, Loader };\n"],"names":[],"mappings":";;;;;AAMA,MAAM,KAAK,GAAG,MAAM,CAAC,SAAS,CAAC;AAM/B,MAAM,aAAa,GAAG,MAAM,CAAC,GAAG;AAIhC,MAAM,SAAS,GAAG,MAAM,CAAC,aAAa,CAAC,CAAC,UAAU,CAAC;AACjD,IAAA,iBAAiB,EAAE,CAAC,IAAI,KAAK,CAAC,CAAC,cAAc,CAAC,CAAC,QAAQ,CAAC,IAAI,CAAC;AAC9D,CAAA,CAAC,CAAoC;;;;;;;AAOlC,EAAA,EAAA,CAAC,EAAE,YAAY,EAAE,KAAI;IACrB,IAAI,OAAO,GAAG,wBAAwB;IACtC,IAAI,QAAQ,GAAG,gBAAgB;IAE/B,IAAI,YAAY,KAAK,MAAM,EAAE;QAC3B,OAAO,GAAG,sBAAsB;QAChC,QAAQ,GAAG,eAAe;AAC3B,IAAA;IAED,OAAO;UACD,KAAK,CAAA;UACL,OAAO;;;UAGP,aAAa,CAAA;UACb,QAAQ;;KAEb;AACH,CAAC;;;;;"}

package/dist/components/Stepper/styled.cjs

@@ -1,33 +0,0 @@
-'use strict';
-
-var styled = require('styled-components');
-var index = require('../../theme/index.cjs');
-var inputStyles = require('../../utils/forms/inputStyles.cjs');
-var Stack = require('../Stack/Stack.cjs');
-
-function _interopDefaultCompat (e) { return e && typeof e === 'object' && 'default' in e ? e : { default: e }; }
-
-var styled__default = /*#__PURE__*/_interopDefaultCompat(styled);
-
-const { colors: { neutral, secondary }, radius, } = index.theme;
-const ContainerStack = styled__default.default(Stack.Stack).withConfig({
-    shouldForwardProp: (prop) => !['hasError', 'compact'].includes(prop),
-}) `
-  --background-color: ${({ disabled }) => (disabled ? neutral.grey.light : 'white')};
-  --border-color: ${({ hasError }) => (hasError ? secondary.red.base : neutral.ink.lightest)};
-
-  box-sizing: border-box;
-  display: inline-flex;
-  background-color: var(--background-color);
-  border: ${index.theme.sizes.line} solid var(--border-color);
-  border-radius: ${radius.base};
-
-  height: ${({ compact }) => (compact ? index.theme.sizes[8] : index.theme.sizes[10])};
-`;
-const StepButton = styled__default.default.button.withConfig({ displayName: "vui--StepButton", componentId: "vui--1j6prbe" }) `appearance:none;border:0;background-color:transparent;border-radius:${radius.base};cursor:pointer;height:100%;aspect-ratio:1;&:hover{background-color:${neutral.grey.light};}${inputStyles.inputFocusStyles}`;
-const StepperDivider = styled__default.default.div.withConfig({ displayName: "vui--StepperDivider", componentId: "vui--19ho080" }) `width:${index.theme.sizes.line};background-color:${neutral.ink.lightest};height:${({ compact }) => (compact ? index.theme.sizes[4] : index.theme.sizes[6])};`;
-
-exports.ContainerStack = ContainerStack;
-exports.StepButton = StepButton;
-exports.StepperDivider = StepperDivider;
-//# sourceMappingURL=styled.cjs.map

package/dist/components/Stepper/styled.cjs.map

@@ -1 +0,0 @@
-{"version":3,"file":"styled.cjs","sources":["../../../src/components/Stepper/styled.ts"],"sourcesContent":["import styled from 'styled-components';\nimport { theme } from '../../theme';\nimport { inputFocusStyles } from '../../utils/forms/inputStyles';\nimport { Stack } from '../Stack';\nimport { FormComponentProps } from '../types';\n\nconst {\n  colors: { neutral, secondary },\n  radius,\n} = theme;\n\nexport const ContainerStack = styled(Stack).withConfig({\n  shouldForwardProp: (prop) => !['hasError', 'compact'].includes(prop),\n})<FormComponentProps>`\n  --background-color: ${({ disabled }) => (disabled ? neutral.grey.light : 'white')};\n  --border-color: ${({ hasError }) => (hasError ? secondary.red.base : neutral.ink.lightest)};\n\n  box-sizing: border-box;\n  display: inline-flex;\n  background-color: var(--background-color);\n  border: ${theme.sizes.line} solid var(--border-color);\n  border-radius: ${radius.base};\n\n  height: ${({ compact }) => (compact ? theme.sizes[8] : theme.sizes[10])};\n`;\n\nexport const StepButton = styled.button`\n  appearance: none;\n  border: 0;\n  background-color: transparent;\n  border-radius: ${radius.base};\n  cursor: pointer;\n\n  height: 100%;\n  aspect-ratio: 1;\n\n  &:hover {\n    background-color: ${neutral.grey.light};\n  }\n\n  ${inputFocusStyles}\n`;\n\nexport const StepperDivider = styled.div<Pick<FormComponentProps, 'compact'>>`\n  width: ${theme.sizes.line};\n  background-color: ${neutral.ink.lightest};\n  height: ${({ compact }) => (compact ? theme.sizes[4] : theme.sizes[6])};\n`;\n"],"names":["theme","styled","Stack","inputFocusStyles"],"mappings":";;;;;;;;;;;AAMA,MAAM,EACJ,MAAM,EAAE,EAAE,OAAO,EAAE,SAAS,EAAE,EAC9B,MAAM,GACP,GAAGA,WAAK;AAEF,MAAM,cAAc,GAAGC,uBAAM,CAACC,WAAK,CAAC,CAAC,UAAU,CAAC;AACrD,IAAA,iBAAiB,EAAE,CAAC,IAAI,KAAK,CAAC,CAAC,UAAU,EAAE,SAAS,CAAC,CAAC,QAAQ,CAAC,IAAI,CAAC;AACrE,CAAA,CAAC,CAAoB;wBACE,CAAC,EAAE,QAAQ,EAAE,MAAM,QAAQ,GAAG,OAAO,CAAC,IAAI,CAAC,KAAK,GAAG,OAAO,CAAC,CAAA;oBAC/D,CAAC,EAAE,QAAQ,EAAE,MAAM,QAAQ,GAAG,SAAS,CAAC,GAAG,CAAC,IAAI,GAAG,OAAO,CAAC,GAAG,CAAC,QAAQ,CAAC,CAAA;;;;;YAKhFF,WAAK,CAAC,KAAK,CAAC,IAAI,CAAA;AACT,iBAAA,EAAA,MAAM,CAAC,IAAI,CAAA;;YAElB,CAAC,EAAE,OAAO,EAAE,MAAM,OAAO,GAAGA,WAAK,CAAC,KAAK,CAAC,CAAC,CAAC,GAAGA,WAAK,CAAC,KAAK,CAAC,EAAE,CAAC,CAAC,CAAA;;MAG5D,UAAU,GAAGC,uBAAM,CAAC,MAAM,oJAIpB,MAAM,CAAC,IAAI,CAAA,oEAAA,EAON,OAAO,CAAC,IAAI,CAAC,KAAK,CAAA,EAAA,EAGtCE,4BAAgB;MAGP,cAAc,GAAGF,uBAAM,CAAC,GAAG,CAAA,UAAA,CAAA,EAAA,WAAA,EAAA,qBAAA,EAAA,WAAA,EAAA,cAAA,EAAA,CAAA,CAAA,CAAA,MAAA,EAC7BD,WAAK,CAAC,KAAK,CAAC,IAAI,CAAA,kBAAA,EACL,OAAO,CAAC,GAAG,CAAC,QAAQ,CAAA,QAAA,EAC9B,CAAC,EAAE,OAAO,EAAE,MAAM,OAAO,GAAGA,WAAK,CAAC,KAAK,CAAC,CAAC,CAAC,GAAGA,WAAK,CAAC,KAAK,CAAC,CAAC,CAAC,CAAC,CAAA,CAAA;;;;;;"}

package/dist/components/Stepper/styled.d.ts

@@ -1,12 +0,0 @@
-/// <reference types="react" />
-import { FormComponentProps } from '../types';
-export declare const ContainerStack: import("styled-components").StyledComponent<import("react").ForwardRefExoticComponent<{
-    direction?: "horizontal" | "vertical" | undefined;
-    alignX?: "start" | "end" | "center" | "stretch" | "between" | "around" | undefined;
-    alignY?: "start" | "end" | "center" | "stretch" | "between" | "around" | undefined;
-    spacing?: keyof import("../Stack").SizeScale | undefined;
-    as?: import("react").ElementType<any> | undefined;
-    forwardedAs?: import("react").ElementType<any> | undefined;
-} & import("react").HTMLAttributes<HTMLDivElement> & import("react").RefAttributes<HTMLDivElement>>, any, FormComponentProps, never>;
-export declare const StepButton: import("styled-components").StyledComponent<"button", any, FormComponentProps, never>;
-export declare const StepperDivider: import("styled-components").StyledComponent<"div", any, Pick<FormComponentProps, "compact">, never>;

package/dist/components/Stepper/styled.js

@@ -1,25 +0,0 @@
-import styled from 'styled-components';
-import { theme } from '../../theme/index.js';
-import { inputFocusStyles } from '../../utils/forms/inputStyles.js';
-import { Stack } from '../Stack/Stack.js';
-
-const { colors: { neutral, secondary }, radius, } = theme;
-const ContainerStack = styled(Stack).withConfig({
-    shouldForwardProp: (prop) => !['hasError', 'compact'].includes(prop),
-}) `
-  --background-color: ${({ disabled }) => (disabled ? neutral.grey.light : 'white')};
-  --border-color: ${({ hasError }) => (hasError ? secondary.red.base : neutral.ink.lightest)};
-
-  box-sizing: border-box;
-  display: inline-flex;
-  background-color: var(--background-color);
-  border: ${theme.sizes.line} solid var(--border-color);
-  border-radius: ${radius.base};
-
-  height: ${({ compact }) => (compact ? theme.sizes[8] : theme.sizes[10])};
-`;
-const StepButton = styled.button.withConfig({ displayName: "vui--StepButton", componentId: "vui--1j6prbe" }) `appearance:none;border:0;background-color:transparent;border-radius:${radius.base};cursor:pointer;height:100%;aspect-ratio:1;&:hover{background-color:${neutral.grey.light};}${inputFocusStyles}`;
-const StepperDivider = styled.div.withConfig({ displayName: "vui--StepperDivider", componentId: "vui--19ho080" }) `width:${theme.sizes.line};background-color:${neutral.ink.lightest};height:${({ compact }) => (compact ? theme.sizes[4] : theme.sizes[6])};`;
-
-export { ContainerStack, StepButton, StepperDivider };
-//# sourceMappingURL=styled.js.map

package/dist/components/Stepper/styled.js.map

@@ -1 +0,0 @@
-{"version":3,"file":"styled.js","sources":["../../../src/components/Stepper/styled.ts"],"sourcesContent":["import styled from 'styled-components';\nimport { theme } from '../../theme';\nimport { inputFocusStyles } from '../../utils/forms/inputStyles';\nimport { Stack } from '../Stack';\nimport { FormComponentProps } from '../types';\n\nconst {\n  colors: { neutral, secondary },\n  radius,\n} = theme;\n\nexport const ContainerStack = styled(Stack).withConfig({\n  shouldForwardProp: (prop) => !['hasError', 'compact'].includes(prop),\n})<FormComponentProps>`\n  --background-color: ${({ disabled }) => (disabled ? neutral.grey.light : 'white')};\n  --border-color: ${({ hasError }) => (hasError ? secondary.red.base : neutral.ink.lightest)};\n\n  box-sizing: border-box;\n  display: inline-flex;\n  background-color: var(--background-color);\n  border: ${theme.sizes.line} solid var(--border-color);\n  border-radius: ${radius.base};\n\n  height: ${({ compact }) => (compact ? theme.sizes[8] : theme.sizes[10])};\n`;\n\nexport const StepButton = styled.button`\n  appearance: none;\n  border: 0;\n  background-color: transparent;\n  border-radius: ${radius.base};\n  cursor: pointer;\n\n  height: 100%;\n  aspect-ratio: 1;\n\n  &:hover {\n    background-color: ${neutral.grey.light};\n  }\n\n  ${inputFocusStyles}\n`;\n\nexport const StepperDivider = styled.div<Pick<FormComponentProps, 'compact'>>`\n  width: ${theme.sizes.line};\n  background-color: ${neutral.ink.lightest};\n  height: ${({ compact }) => (compact ? theme.sizes[4] : theme.sizes[6])};\n`;\n"],"names":[],"mappings":";;;;;AAMA,MAAM,EACJ,MAAM,EAAE,EAAE,OAAO,EAAE,SAAS,EAAE,EAC9B,MAAM,GACP,GAAG,KAAK;AAEF,MAAM,cAAc,GAAG,MAAM,CAAC,KAAK,CAAC,CAAC,UAAU,CAAC;AACrD,IAAA,iBAAiB,EAAE,CAAC,IAAI,KAAK,CAAC,CAAC,UAAU,EAAE,SAAS,CAAC,CAAC,QAAQ,CAAC,IAAI,CAAC;AACrE,CAAA,CAAC,CAAoB;wBACE,CAAC,EAAE,QAAQ,EAAE,MAAM,QAAQ,GAAG,OAAO,CAAC,IAAI,CAAC,KAAK,GAAG,OAAO,CAAC,CAAA;oBAC/D,CAAC,EAAE,QAAQ,EAAE,MAAM,QAAQ,GAAG,SAAS,CAAC,GAAG,CAAC,IAAI,GAAG,OAAO,CAAC,GAAG,CAAC,QAAQ,CAAC,CAAA;;;;;YAKhF,KAAK,CAAC,KAAK,CAAC,IAAI,CAAA;AACT,iBAAA,EAAA,MAAM,CAAC,IAAI,CAAA;;YAElB,CAAC,EAAE,OAAO,EAAE,MAAM,OAAO,GAAG,KAAK,CAAC,KAAK,CAAC,CAAC,CAAC,GAAG,KAAK,CAAC,KAAK,CAAC,EAAE,CAAC,CAAC,CAAA;;MAG5D,UAAU,GAAG,MAAM,CAAC,MAAM,oJAIpB,MAAM,CAAC,IAAI,CAAA,oEAAA,EAON,OAAO,CAAC,IAAI,CAAC,KAAK,CAAA,EAAA,EAGtC,gBAAgB;MAGP,cAAc,GAAG,MAAM,CAAC,GAAG,CAAA,UAAA,CAAA,EAAA,WAAA,EAAA,qBAAA,EAAA,WAAA,EAAA,cAAA,EAAA,CAAA,CAAA,CAAA,MAAA,EAC7B,KAAK,CAAC,KAAK,CAAC,IAAI,CAAA,kBAAA,EACL,OAAO,CAAC,GAAG,CAAC,QAAQ,CAAA,QAAA,EAC9B,CAAC,EAAE,OAAO,EAAE,MAAM,OAAO,GAAG,KAAK,CAAC,KAAK,CAAC,CAAC,CAAC,GAAG,KAAK,CAAC,KAAK,CAAC,CAAC,CAAC,CAAC,CAAA,CAAA;;;;"}

package/dist/components/Toggle/styled.cjs

@@ -1,20 +0,0 @@
-'use strict';
-
-var styled = require('styled-components');
-var BaseContainer = require('../BaseContainer/BaseContainer.cjs');
-var index = require('../../theme/index.cjs');
-
-function _interopDefaultCompat (e) { return e && typeof e === 'object' && 'default' in e ? e : { default: e }; }
-
-var styled__default = /*#__PURE__*/_interopDefaultCompat(styled);
-
-const Slider = styled__default.default.span.withConfig({ displayName: "vui--Slider", componentId: "vui--x03mdi" }) `content:'';position:absolute;top:0;left:0;right:0;bottom:0;border-radius:18px;background-color:#cdd1d5;-webkit-transition:0.3s;transition:0.3s;&:after{content:'';position:absolute;border-radius:50%;background-color:${({ disabled, switched }) => disabled && switched ? index.theme.colors.secondary.blue.lightest : 'white'};-webkit-transition:0.3s;transition:0.3s;}`;
-const Input = styled__default.default.input.withConfig({ displayName: "vui--Input", componentId: "vui--1ccelw2" }) `width:100%;height:100%;border-radius:${index.theme.radius.base};z-index:2;margin:0;cursor:${({ disabled }) => (disabled ? 'not-allowed' : 'pointer')};&:focus-visible + ${Slider}{box-shadow:0 0 0 4px ${index.theme.colors.brand.blue.light};}&:checked + ${Slider}{background-color:#0079d1;}&:disabled + ${Slider}{background-color:${index.theme.colors.neutral.grey.base};}&:checked:disabled + ${Slider}{background-color:${index.theme.colors.secondary.blue.light};}`;
-const Switch = styled__default.default.span.withConfig({ displayName: "vui--Switch", componentId: "vui--13yy1uj" }) `display:flex;position:relative;height:${({ small }) => (small ? '28px' : '36px')};width:${({ small }) => (small ? '56px' : '72px')};z-index:1;input{position:absolute;opacity:0;}${Slider}:after{height:${({ small }) => (small ? '22px' : '28px')};width:${({ small }) => (small ? '22px' : '28px')};left:${({ small }) => (small ? '3px' : '4px')};bottom:${({ small }) => (small ? '3px' : '4px')};}${Input}:checked + ${Slider}{&:after,svg{-webkit-transform:translateX(${({ small }) => (small ? '28px' : '36px')});-ms-transform:translateX(${({ small }) => (small ? '28px' : '36px')});transform:translateX(${({ small }) => (small ? '28px' : '36px')});}}`;
-const Wrapper = styled__default.default(BaseContainer.BaseContainer).withConfig({ displayName: "vui--Wrapper", componentId: "vui--69792q" }) `display:inline-block;user-select:none;`;
-
-exports.Input = Input;
-exports.Slider = Slider;
-exports.Switch = Switch;
-exports.Wrapper = Wrapper;
-//# sourceMappingURL=styled.cjs.map

package/dist/components/Toggle/styled.cjs.map

@@ -1 +0,0 @@
-{"version":3,"file":"styled.cjs","sources":["../../../src/components/Toggle/styled.ts"],"sourcesContent":["import styled from 'styled-components';\n\nimport { ToggleProps } from './types';\nimport { BaseContainer } from '../BaseContainer';\nimport { theme } from '../../theme';\n\nconst Slider = styled.span<{ switched?: boolean; disabled?: boolean }>`\n  content: '';\n  position: absolute;\n  top: 0;\n  left: 0;\n  right: 0;\n  bottom: 0;\n  border-radius: 18px;\n  background-color: #cdd1d5;\n  -webkit-transition: 0.3s;\n  transition: 0.3s;\n\n  &:after {\n    content: '';\n    position: absolute;\n    border-radius: 50%;\n    background-color: ${({ disabled, switched }) =>\n      disabled && switched ? theme.colors.secondary.blue.lightest : 'white'};\n    -webkit-transition: 0.3s;\n    transition: 0.3s;\n  }\n`;\n\nconst Input = styled.input`\n  width: 100%;\n  height: 100%;\n  border-radius: ${theme.radius.base};\n  z-index: 2;\n  margin: 0;\n\n  cursor: ${({ disabled }) => (disabled ? 'not-allowed' : 'pointer')};\n\n  &:focus-visible + ${Slider} {\n    box-shadow: 0 0 0 4px ${theme.colors.brand.blue.light};\n  }\n\n  &:checked + ${Slider} {\n    background-color: #0079d1;\n  }\n\n  &:disabled + ${Slider} {\n    background-color: ${theme.colors.neutral.grey.base};\n  }\n\n  &:checked:disabled + ${Slider} {\n    background-color: ${theme.colors.secondary.blue.light};\n  }\n`;\n\nconst Switch = styled.span<ToggleProps>`\n  display: flex;\n  position: relative;\n  height: ${({ small }) => (small ? '28px' : '36px')};\n  width: ${({ small }) => (small ? '56px' : '72px')};\n  z-index: 1;\n\n  input {\n    position: absolute;\n    opacity: 0;\n  }\n\n  // configure size and animation\n  ${Slider}:after {\n    height: ${({ small }) => (small ? '22px' : '28px')};\n    width: ${({ small }) => (small ? '22px' : '28px')};\n    left: ${({ small }) => (small ? '3px' : '4px')};\n    bottom: ${({ small }) => (small ? '3px' : '4px')};\n  }\n\n  ${Input}:checked + ${Slider} {\n    &:after,\n    svg {\n      -webkit-transform: translateX(${({ small }) => (small ? '28px' : '36px')});\n      -ms-transform: translateX(${({ small }) => (small ? '28px' : '36px')});\n      transform: translateX(${({ small }) => (small ? '28px' : '36px')});\n    }\n  }\n`;\n\nconst Wrapper = styled(BaseContainer)<{ disabled?: boolean }>`\n  display: inline-block;\n  user-select: none;\n`;\n\nexport { Switch, Slider, Input, Wrapper };\n"],"names":["styled","theme","BaseContainer"],"mappings":";;;;;;;;;;AAMA,MAAM,MAAM,GAAGA,uBAAM,CAAC,IAAI,CAAA,UAAA,CAAA,EAAA,WAAA,EAAA,aAAA,EAAA,WAAA,EAAA,aAAA,EAAA,CAAA,CAAA,CAAA,uNAAA,EAgBF,CAAC,EAAE,QAAQ,EAAE,QAAQ,EAAE,KACzC,QAAQ,IAAI,QAAQ,GAAGC,WAAK,CAAC,MAAM,CAAC,SAAS,CAAC,IAAI,CAAC,QAAQ,GAAG,OAAO;AAM3E,MAAM,KAAK,GAAGD,uBAAM,CAAC,KAAK,CAAA,UAAA,CAAA,EAAA,WAAA,EAAA,YAAA,EAAA,WAAA,EAAA,cAAA,EAAA,CAAA,CAAA,CAAA,qCAAA,EAGPC,WAAK,CAAC,MAAM,CAAC,IAAI,CAAA,2BAAA,EAIxB,CAAC,EAAE,QAAQ,EAAE,MAAM,QAAQ,GAAG,aAAa,GAAG,SAAS,CAAC,CAAA,mBAAA,EAE9C,MAAM,CAAA,sBAAA,EACAA,WAAK,CAAC,MAAM,CAAC,KAAK,CAAC,IAAI,CAAC,KAAK,CAAA,cAAA,EAGzC,MAAM,CAAA,wCAAA,EAIL,MAAM,CAAA,kBAAA,EACCA,WAAK,CAAC,MAAM,CAAC,OAAO,CAAC,IAAI,CAAC,IAAI,CAAA,uBAAA,EAG7B,MAAM,qBACPA,WAAK,CAAC,MAAM,CAAC,SAAS,CAAC,IAAI,CAAC,KAAK;AAIzD,MAAM,MAAM,GAAGD,uBAAM,CAAC,IAAI,CAAA,UAAA,CAAA,EAAA,WAAA,EAAA,aAAA,EAAA,WAAA,EAAA,cAAA,EAAA,CAAA,CAAA,CAAA,sCAAA,EAGd,CAAC,EAAE,KAAK,EAAE,MAAM,KAAK,GAAG,MAAM,GAAG,MAAM,CAAC,CAAA,OAAA,EACzC,CAAC,EAAE,KAAK,EAAE,MAAM,KAAK,GAAG,MAAM,GAAG,MAAM,CAAC,CAAA,8CAAA,EAS/C,MAAM,CAAA,cAAA,EACI,CAAC,EAAE,KAAK,EAAE,MAAM,KAAK,GAAG,MAAM,GAAG,MAAM,CAAC,UACzC,CAAC,EAAE,KAAK,EAAE,MAAM,KAAK,GAAG,MAAM,GAAG,MAAM,CAAC,CAAA,MAAA,EACzC,CAAC,EAAE,KAAK,EAAE,MAAM,KAAK,GAAG,KAAK,GAAG,KAAK,CAAC,WACpC,CAAC,EAAE,KAAK,EAAE,MAAM,KAAK,GAAG,KAAK,GAAG,KAAK,CAAC,CAAA,EAAA,EAGhD,KAAK,cAAc,MAAM,CAAA,0CAAA,EAGS,CAAC,EAAE,KAAK,EAAE,MAAM,KAAK,GAAG,MAAM,GAAG,MAAM,CAAC,CAAA,2BAAA,EAC5C,CAAC,EAAE,KAAK,EAAE,MAAM,KAAK,GAAG,MAAM,GAAG,MAAM,CAAC,CAAA,uBAAA,EAC5C,CAAC,EAAE,KAAK,EAAE,MAAM,KAAK,GAAG,MAAM,GAAG,MAAM,CAAC;AAKtE,MAAM,OAAO,GAAGA,uBAAM,CAACE,2BAAa,CAAC;;;;;;;"}

package/dist/components/Toggle/styled.d.ts

@@ -1,12 +0,0 @@
-/// <reference types="react" />
-import { ToggleProps } from './types';
-declare const Slider: import("styled-components").StyledComponent<"span", any, {
-    switched?: boolean | undefined;
-    disabled?: boolean | undefined;
-}, never>;
-declare const Input: import("styled-components").StyledComponent<"input", any, {}, never>;
-declare const Switch: import("styled-components").StyledComponent<"span", any, ToggleProps, never>;
-declare const Wrapper: import("styled-components").StyledComponent<import("react").ForwardRefExoticComponent<import("../BaseContainer").BaseContainerProps & import("react").HTMLAttributes<HTMLDivElement> & import("react").RefAttributes<HTMLDivElement>>, any, {
-    disabled?: boolean | undefined;
-}, never>;
-export { Switch, Slider, Input, Wrapper };

package/dist/components/Toggle/styled.js

@@ -1,11 +0,0 @@
-import styled from 'styled-components';
-import { BaseContainer } from '../BaseContainer/BaseContainer.js';
-import { theme } from '../../theme/index.js';
-
-const Slider = styled.span.withConfig({ displayName: "vui--Slider", componentId: "vui--x03mdi" }) `content:'';position:absolute;top:0;left:0;right:0;bottom:0;border-radius:18px;background-color:#cdd1d5;-webkit-transition:0.3s;transition:0.3s;&:after{content:'';position:absolute;border-radius:50%;background-color:${({ disabled, switched }) => disabled && switched ? theme.colors.secondary.blue.lightest : 'white'};-webkit-transition:0.3s;transition:0.3s;}`;
-const Input = styled.input.withConfig({ displayName: "vui--Input", componentId: "vui--1ccelw2" }) `width:100%;height:100%;border-radius:${theme.radius.base};z-index:2;margin:0;cursor:${({ disabled }) => (disabled ? 'not-allowed' : 'pointer')};&:focus-visible + ${Slider}{box-shadow:0 0 0 4px ${theme.colors.brand.blue.light};}&:checked + ${Slider}{background-color:#0079d1;}&:disabled + ${Slider}{background-color:${theme.colors.neutral.grey.base};}&:checked:disabled + ${Slider}{background-color:${theme.colors.secondary.blue.light};}`;
-const Switch = styled.span.withConfig({ displayName: "vui--Switch", componentId: "vui--13yy1uj" }) `display:flex;position:relative;height:${({ small }) => (small ? '28px' : '36px')};width:${({ small }) => (small ? '56px' : '72px')};z-index:1;input{position:absolute;opacity:0;}${Slider}:after{height:${({ small }) => (small ? '22px' : '28px')};width:${({ small }) => (small ? '22px' : '28px')};left:${({ small }) => (small ? '3px' : '4px')};bottom:${({ small }) => (small ? '3px' : '4px')};}${Input}:checked + ${Slider}{&:after,svg{-webkit-transform:translateX(${({ small }) => (small ? '28px' : '36px')});-ms-transform:translateX(${({ small }) => (small ? '28px' : '36px')});transform:translateX(${({ small }) => (small ? '28px' : '36px')});}}`;
-const Wrapper = styled(BaseContainer).withConfig({ displayName: "vui--Wrapper", componentId: "vui--69792q" }) `display:inline-block;user-select:none;`;
-
-export { Input, Slider, Switch, Wrapper };
-//# sourceMappingURL=styled.js.map

package/dist/components/Toggle/styled.js.map

@@ -1 +0,0 @@
-{"version":3,"file":"styled.js","sources":["../../../src/components/Toggle/styled.ts"],"sourcesContent":["import styled from 'styled-components';\n\nimport { ToggleProps } from './types';\nimport { BaseContainer } from '../BaseContainer';\nimport { theme } from '../../theme';\n\nconst Slider = styled.span<{ switched?: boolean; disabled?: boolean }>`\n  content: '';\n  position: absolute;\n  top: 0;\n  left: 0;\n  right: 0;\n  bottom: 0;\n  border-radius: 18px;\n  background-color: #cdd1d5;\n  -webkit-transition: 0.3s;\n  transition: 0.3s;\n\n  &:after {\n    content: '';\n    position: absolute;\n    border-radius: 50%;\n    background-color: ${({ disabled, switched }) =>\n      disabled && switched ? theme.colors.secondary.blue.lightest : 'white'};\n    -webkit-transition: 0.3s;\n    transition: 0.3s;\n  }\n`;\n\nconst Input = styled.input`\n  width: 100%;\n  height: 100%;\n  border-radius: ${theme.radius.base};\n  z-index: 2;\n  margin: 0;\n\n  cursor: ${({ disabled }) => (disabled ? 'not-allowed' : 'pointer')};\n\n  &:focus-visible + ${Slider} {\n    box-shadow: 0 0 0 4px ${theme.colors.brand.blue.light};\n  }\n\n  &:checked + ${Slider} {\n    background-color: #0079d1;\n  }\n\n  &:disabled + ${Slider} {\n    background-color: ${theme.colors.neutral.grey.base};\n  }\n\n  &:checked:disabled + ${Slider} {\n    background-color: ${theme.colors.secondary.blue.light};\n  }\n`;\n\nconst Switch = styled.span<ToggleProps>`\n  display: flex;\n  position: relative;\n  height: ${({ small }) => (small ? '28px' : '36px')};\n  width: ${({ small }) => (small ? '56px' : '72px')};\n  z-index: 1;\n\n  input {\n    position: absolute;\n    opacity: 0;\n  }\n\n  // configure size and animation\n  ${Slider}:after {\n    height: ${({ small }) => (small ? '22px' : '28px')};\n    width: ${({ small }) => (small ? '22px' : '28px')};\n    left: ${({ small }) => (small ? '3px' : '4px')};\n    bottom: ${({ small }) => (small ? '3px' : '4px')};\n  }\n\n  ${Input}:checked + ${Slider} {\n    &:after,\n    svg {\n      -webkit-transform: translateX(${({ small }) => (small ? '28px' : '36px')});\n      -ms-transform: translateX(${({ small }) => (small ? '28px' : '36px')});\n      transform: translateX(${({ small }) => (small ? '28px' : '36px')});\n    }\n  }\n`;\n\nconst Wrapper = styled(BaseContainer)<{ disabled?: boolean }>`\n  display: inline-block;\n  user-select: none;\n`;\n\nexport { Switch, Slider, Input, Wrapper };\n"],"names":[],"mappings":";;;;AAMA,MAAM,MAAM,GAAG,MAAM,CAAC,IAAI,CAAA,UAAA,CAAA,EAAA,WAAA,EAAA,aAAA,EAAA,WAAA,EAAA,aAAA,EAAA,CAAA,CAAA,CAAA,uNAAA,EAgBF,CAAC,EAAE,QAAQ,EAAE,QAAQ,EAAE,KACzC,QAAQ,IAAI,QAAQ,GAAG,KAAK,CAAC,MAAM,CAAC,SAAS,CAAC,IAAI,CAAC,QAAQ,GAAG,OAAO;AAM3E,MAAM,KAAK,GAAG,MAAM,CAAC,KAAK,CAAA,UAAA,CAAA,EAAA,WAAA,EAAA,YAAA,EAAA,WAAA,EAAA,cAAA,EAAA,CAAA,CAAA,CAAA,qCAAA,EAGP,KAAK,CAAC,MAAM,CAAC,IAAI,CAAA,2BAAA,EAIxB,CAAC,EAAE,QAAQ,EAAE,MAAM,QAAQ,GAAG,aAAa,GAAG,SAAS,CAAC,CAAA,mBAAA,EAE9C,MAAM,CAAA,sBAAA,EACA,KAAK,CAAC,MAAM,CAAC,KAAK,CAAC,IAAI,CAAC,KAAK,CAAA,cAAA,EAGzC,MAAM,CAAA,wCAAA,EAIL,MAAM,CAAA,kBAAA,EACC,KAAK,CAAC,MAAM,CAAC,OAAO,CAAC,IAAI,CAAC,IAAI,CAAA,uBAAA,EAG7B,MAAM,qBACP,KAAK,CAAC,MAAM,CAAC,SAAS,CAAC,IAAI,CAAC,KAAK;AAIzD,MAAM,MAAM,GAAG,MAAM,CAAC,IAAI,CAAA,UAAA,CAAA,EAAA,WAAA,EAAA,aAAA,EAAA,WAAA,EAAA,cAAA,EAAA,CAAA,CAAA,CAAA,sCAAA,EAGd,CAAC,EAAE,KAAK,EAAE,MAAM,KAAK,GAAG,MAAM,GAAG,MAAM,CAAC,CAAA,OAAA,EACzC,CAAC,EAAE,KAAK,EAAE,MAAM,KAAK,GAAG,MAAM,GAAG,MAAM,CAAC,CAAA,8CAAA,EAS/C,MAAM,CAAA,cAAA,EACI,CAAC,EAAE,KAAK,EAAE,MAAM,KAAK,GAAG,MAAM,GAAG,MAAM,CAAC,UACzC,CAAC,EAAE,KAAK,EAAE,MAAM,KAAK,GAAG,MAAM,GAAG,MAAM,CAAC,CAAA,MAAA,EACzC,CAAC,EAAE,KAAK,EAAE,MAAM,KAAK,GAAG,KAAK,GAAG,KAAK,CAAC,WACpC,CAAC,EAAE,KAAK,EAAE,MAAM,KAAK,GAAG,KAAK,GAAG,KAAK,CAAC,CAAA,EAAA,EAGhD,KAAK,cAAc,MAAM,CAAA,0CAAA,EAGS,CAAC,EAAE,KAAK,EAAE,MAAM,KAAK,GAAG,MAAM,GAAG,MAAM,CAAC,CAAA,2BAAA,EAC5C,CAAC,EAAE,KAAK,EAAE,MAAM,KAAK,GAAG,MAAM,GAAG,MAAM,CAAC,CAAA,uBAAA,EAC5C,CAAC,EAAE,KAAK,EAAE,MAAM,KAAK,GAAG,MAAM,GAAG,MAAM,CAAC;AAKtE,MAAM,OAAO,GAAG,MAAM,CAAC,aAAa,CAAC;;;;"}