@salutejs/plasma-new-hope 0.194.0-canary.1565.11870784206.0 → 0.194.0-canary.1568.11891833298.0

package/emotion/cjs/examples/plasma_web/components/Switch/Switch.stories.tsx

@@ -9,7 +9,7 @@ import { mergeConfig } from '../../../../engines';
 import { WithTheme, argTypesFromConfig } from '../../../_helpers';
 
 import { config } from './Switch.config';
-import { Switch } from './Switch';
+import { Switch, SwitchOutline } from './Switch';
 
 type SwitchProps = ComponentProps<typeof Switch>;
 
@@ -72,3 +72,35 @@ export const Default: StoryObj<SwitchProps> = {
     },
     render: (args) => <StoryDefault {...args} />,
 };
+
+const StoryOutline = (args: SwitchProps) => {
+    const value = 'yes';
+    const name = 'agree';
+    const [checked, setChecked] = useState(true);
+
+    return (
+        <StyledWrapper>
+            <SwitchOutline
+                value={value}
+                name={name}
+                checked={checked}
+                onChange={(event) => {
+                    setChecked(event.target.checked);
+                    onChange(event);
+                }}
+                onFocus={onFocus}
+                onBlur={onBlur}
+                {...args}
+            />
+        </StyledWrapper>
+    );
+};
+
+export const Outline: StoryObj<SwitchProps> = {
+    args: {
+        size: 'm',
+        toggleSize: 'l',
+        disabled: false,
+    },
+    render: (args) => <StoryOutline {...args} />,
+};

package/emotion/cjs/examples/plasma_web/components/TextField/TextField.stories.tsx

@@ -291,255 +291,3 @@ export const Chips: StoryObj<StoryPropsChips> = {
     },
     render: (args) => <StoryChips {...args} />,
 };
-
-type StoryEmailValidationProps = StoryPropsDefault & {
-    minLengthValue?: number;
-    minLengthErrorMessage?: string;
-    maxLengthValue?: number;
-    maxLengthErrorMessage?: string;
-    minHostLengthValue?: number;
-    minHostLengthErrorMessage?: string;
-    maxHostLengthValue?: number;
-    maxHostLengthErrorMessage?: string;
-    minDomainLengthValue?: number;
-    minDomainLengthErrorMessage?: string;
-    maxDomainLengthValue?: number;
-    maxDomainLengthErrorMessage?: string;
-    minZoneLengthValue?: number;
-    minZoneLengthErrorMessage?: string;
-    maxZoneLengthValue?: number;
-    maxZoneLengthErrorMessage?: string;
-    whitelistDomainsValue?: string;
-    whitelistDomainsErrorMessage?: string;
-    blacklistDomainsValue?: string;
-    blacklistDomainsErrorMessage?: string;
-};
-
-const StoryEmailValidation = ({
-    minLengthValue,
-    minLengthErrorMessage,
-    maxLengthValue,
-    maxLengthErrorMessage,
-    minHostLengthValue,
-    minHostLengthErrorMessage,
-    maxHostLengthValue,
-    maxHostLengthErrorMessage,
-    minDomainLengthValue,
-    minDomainLengthErrorMessage,
-    maxDomainLengthValue,
-    maxDomainLengthErrorMessage,
-    minZoneLengthValue,
-    minZoneLengthErrorMessage,
-    maxZoneLengthValue,
-    maxZoneLengthErrorMessage,
-    whitelistDomainsValue,
-    whitelistDomainsErrorMessage,
-    blacklistDomainsValue,
-    blacklistDomainsErrorMessage,
-    ...rest
-}: StoryEmailValidationProps) => {
-    const [error, setError] = useState('');
-
-    const validationOptions = {
-        minLength: {
-            value: minLengthValue || undefined,
-            errorMessage: minLengthErrorMessage || 'Почта слишком короткая',
-        },
-        maxLength: {
-            value: maxLengthValue || undefined,
-            errorMessage: maxLengthErrorMessage || 'Почта слишком длинная',
-        },
-        minHostLength: {
-            value: minHostLengthValue || undefined,
-            errorMessage: minHostLengthErrorMessage || 'Хост слишком короткий',
-        },
-        maxHostLength: {
-            value: maxHostLengthValue || undefined,
-            errorMessage: maxHostLengthErrorMessage || 'Хост слишком длинный',
-        },
-        minDomainLength: {
-            value: minDomainLengthValue || undefined,
-            errorMessage: minDomainLengthErrorMessage || 'Домен слишком короткий',
-        },
-        maxDomainLength: {
-            value: maxDomainLengthValue || undefined,
-            errorMessage: maxDomainLengthErrorMessage || 'Домен слишком длинный',
-        },
-        minZoneLength: {
-            value: minZoneLengthValue || undefined,
-            errorMessage: minZoneLengthErrorMessage || 'Доменная зона слишком короткая',
-        },
-        maxZoneLength: {
-            value: maxZoneLengthValue || undefined,
-            errorMessage: maxZoneLengthErrorMessage || 'Доменная зона слишком длинная',
-        },
-        whitelistDomains: {
-            value: whitelistDomainsValue?.split(',') || undefined,
-            errorMessage: whitelistDomainsErrorMessage || 'Домен не разрешен',
-        },
-        blacklistDomains: {
-            value: blacklistDomainsValue?.split(',') || undefined,
-            errorMessage: blacklistDomainsErrorMessage || 'Домен запрещен',
-        },
-    };
-
-    const handleOnChange = () => {
-        setError('');
-    };
-
-    const handleOnValidate = ({ errorMessage }: { errorMessage?: string }) => {
-        setError(errorMessage || '');
-    };
-
-    return (
-        <TextField
-            label="Валидация почты"
-            validationType="email"
-            options={validationOptions}
-            size="l"
-            view={error ? 'negative' : 'default'}
-            leftHelper={error || 'Валидация почты'}
-            onChange={handleOnChange}
-            onValidate={handleOnValidate}
-            {...rest}
-        />
-    );
-};
-
-export const EmailValidation: StoryObj<StoryEmailValidationProps> = {
-    argTypes: {
-        ...disableProps(['view', 'size', 'maxLength', 'required', 'requiredPlacement', 'optional']),
-    },
-    args: {
-        labelPlacement: 'outer',
-        placeholder: 'Заполните поле',
-        minLengthValue: 5,
-        minLengthErrorMessage: 'Почта слишком короткая',
-        maxLengthValue: 25,
-        maxLengthErrorMessage: 'Почта слишком длинная',
-        minHostLengthValue: 1,
-        minHostLengthErrorMessage: 'Хост слишком короткий',
-        maxHostLengthValue: 12,
-        maxHostLengthErrorMessage: 'Хост слишком длинный',
-        minDomainLengthValue: 1,
-        minDomainLengthErrorMessage: 'Домен слишком короткий',
-        maxDomainLengthValue: 6,
-        maxDomainLengthErrorMessage: 'Домен слишком длинный',
-        minZoneLengthValue: 1,
-        minZoneLengthErrorMessage: 'Доменная зона слишком короткая',
-        maxZoneLengthValue: 5,
-        maxZoneLengthErrorMessage: 'Доменная зона слишком длинная',
-        whitelistDomainsValue: 'gmail.com,yandex.ru,mail.ru,mail.com',
-        whitelistDomainsErrorMessage: 'Домен не разрешен',
-        blacklistDomainsValue: 'heh.org,hah.ha',
-        blacklistDomainsErrorMessage: 'Домен запрещен',
-    },
-    render: (args) => <StoryEmailValidation {...args} />,
-};
-
-type StoryPasswordValidationProps = StoryPropsDefault & {
-    minLengthValue?: number;
-    minLengthErrorMessage?: string;
-    maxLengthValue?: number;
-    maxLengthErrorMessage?: string;
-    includeUppercase?: boolean;
-    includeUppercaseErrorMessage?: string;
-    includeLowercase?: boolean;
-    includeLowercaseErrorMessage?: string;
-    includeDigits?: boolean;
-    includeDigitsErrorMessage?: string;
-    includeSpecialSymbols?: boolean;
-    includeSpecialSymbolsErrorMessage?: string;
-};
-
-const StoryPasswordValidation = ({
-    minLengthValue,
-    minLengthErrorMessage,
-    maxLengthValue,
-    maxLengthErrorMessage,
-    includeUppercase,
-    includeUppercaseErrorMessage,
-    includeLowercase,
-    includeLowercaseErrorMessage,
-    includeDigits,
-    includeDigitsErrorMessage,
-    includeSpecialSymbols,
-    includeSpecialSymbolsErrorMessage,
-    ...rest
-}: StoryPasswordValidationProps) => {
-    const [error, setError] = useState('');
-
-    const validationOptions = {
-        minLength: {
-            value: minLengthValue || undefined,
-            errorMessage: minLengthErrorMessage || 'Пароль слишком короткий',
-        },
-        maxLength: {
-            value: maxLengthValue || undefined,
-            errorMessage: maxLengthErrorMessage || 'Пароль слишком длинный',
-        },
-        includeUppercase: {
-            value: includeUppercase,
-            errorMessage: includeUppercaseErrorMessage || 'Пароль должен содержать хотя бы одну заглавную букву',
-        },
-        includeLowercase: {
-            value: includeLowercase,
-            errorMessage: includeLowercaseErrorMessage || 'Пароль должен содержать хотя бы одну строчную букву',
-        },
-        includeDigits: {
-            value: includeDigits,
-            errorMessage: includeDigitsErrorMessage || 'Пароль должен содержать хотя бы одну цифру',
-        },
-        includeSpecialSymbols: {
-            value: includeSpecialSymbols,
-            errorMessage:
-                includeSpecialSymbolsErrorMessage || 'Пароль должен содержать хотя бы один специальный символ',
-        },
-    };
-
-    const handleOnChange = () => {
-        setError('');
-    };
-
-    const handleOnValidate = ({ errorMessage }: { errorMessage?: string }) => {
-        setError(errorMessage || '');
-    };
-
-    return (
-        <TextField
-            label="Валидация пароля"
-            validationType="password"
-            options={validationOptions}
-            size="l"
-            view={error ? 'negative' : 'default'}
-            leftHelper={error || 'Валидация пароля'}
-            onChange={handleOnChange}
-            onValidate={handleOnValidate}
-            {...rest}
-        />
-    );
-};
-
-export const PasswordValidation: StoryObj<StoryPasswordValidationProps> = {
-    argTypes: {
-        ...disableProps(['view', 'size', 'maxLength', 'required', 'requiredPlacement', 'optional']),
-    },
-    args: {
-        labelPlacement: 'outer',
-        placeholder: 'Заполните поле',
-        passwordHidden: false,
-        minLengthValue: 5,
-        minLengthErrorMessage: 'Пароль слишком короткий',
-        maxLengthValue: 25,
-        maxLengthErrorMessage: 'Пароль слишком длинный',
-        includeUppercase: true,
-        includeUppercaseErrorMessage: 'Пароль должен содержать хотя бы одну заглавную букву',
-        includeLowercase: true,
-        includeLowercaseErrorMessage: 'Пароль должен содержать хотя бы одну строчную букву',
-        includeDigits: true,
-        includeDigitsErrorMessage: 'Пароль должен содержать хотя бы одну цифру',
-        includeSpecialSymbols: true,
-        includeSpecialSymbolsErrorMessage: 'Пароль должен содержать хотя бы один специальный символ',
-    },
-    render: (args) => <StoryPasswordValidation {...args} />,
-};

package/emotion/cjs/utils/constants.js

@@ -3,7 +3,7 @@
 Object.defineProperty(exports, "__esModule", {
   value: true
 });
-exports.specialCharacters = exports.keyCodes = exports.emailPattern = void 0;
+exports.keyCodes = void 0;
 var keyCodes = exports.keyCodes = {
   PageUp: 33,
   PageDown: 34,
@@ -16,6 +16,4 @@ var keyCodes = exports.keyCodes = {
   Enter: 13,
   Space: 32,
   Escape: 27
-};
-var emailPattern = exports.emailPattern = /^[^\s@]+@([^\s@.,]+\.)+[^\s@.,]{2,}$/;
-var specialCharacters = exports.specialCharacters = /[!@#$%^&*(),.?":{}|<>]/;
+};

package/emotion/es/components/Card/Card.api.mdx

@@ -0,0 +1,184 @@
+---
+id: card
+title: Card
+---
+
+отличия от https://plasma.sberdevices.ru/b2c/components/card/:
+* избавляемся от CardBody
+* убираем дублирование disabled
+
+примеры дизайна https://www.figma.com/design/MXl0ZkXEqEhIFDS2H6b3yk/StarDS-Cards?node-id=2-690&node-type=instance&t=TJN8Nqyiky3Dfw2T-0
+
+другие либы:
+https://ant.design/components/card#
+https://mui.com/material-ui/react-card/
+
+```tsx live
+import React, { ReactNode } from "react";
+
+/**
+ * Набор часто встречающихся скруглений.
+ */
+
+export const radiuses = {
+  250: 15.625,
+  32: 2,
+  28: 1.75,
+  24: 1.5,
+  20: 1.25,
+  18: 1.125,
+  16: 1,
+  14: 0.875,
+  12: 0.75,
+  8: 0.5,
+  0: 0,
+};
+
+export type Roundness = keyof typeof radiuses;
+
+export interface RoundnessProps {
+  /** Скругленность */
+  roundness: Roundness;
+}
+
+interface Card {
+  /** Компонент в фокусе */
+  focused?: boolean;
+  /** Увеличение по фокусу */
+  scaleOnFocus?: boolean;
+  /** Компонент неактивен */
+  disabled?: boolean;
+  /** Добавить рамку при фокусе */
+  outlined?: boolean;
+  /** Цвет подложки */
+  background?: string;
+  /** Делает карточку квадратной */
+  square?: boolean;
+  /** Заголовок */
+  title?: string | ReactNode;
+  /** Подзаголовок */
+  subtitle?: string | ReactNode;
+  /** Расположение заголовка и подзаголовка, пока нет в дизайне */
+  titlePlacement?: "inner" | "outer";
+  /** Выравнивание заголовка и подзаголовка */
+  titleAlign?: "left" | "center";
+  /** Подвал, или вынести в
+   * <CardContent footer={<CardTimeline />} /> или <CardFooter><CardTimeline /></CardFooter>
+   * */
+  footer?: ReactNode;
+}
+
+const ratios = {
+  "1 / 1": "100",
+  "1/1": "100",
+  "3 / 4": "133.3333",
+  "3/4": "133.3333",
+  "4 / 3": "75",
+  "4/3": "75",
+  "9 / 16": "177.7778",
+  "9/16": "177.7778",
+  "16 / 9": "56.25",
+  "16/9": "56.25",
+  "1 / 2": "200",
+  "1/2": "200",
+  "2 / 1": "50",
+  "2/1": "50",
+};
+
+export type Ratio = keyof typeof ratios;
+
+/**
+ * CardMedia из текущей реализации
+ * Стоит ли заменить пропсом `cover?: ReactNode;` в Card как в Ant?
+ * а width и height передавать в style...
+ *
+ * имхо, нет. у Card может быть title и subtitle под карточкой
+ * скорее всего, на них свойство height не должно распространяться
+ * стоит подождать финальный дизайн
+ */
+interface CardMedia {
+  base?: "img" | "div";
+  height?: string | number;
+  ratio?: Ratio;
+  customRatio?: string;
+}
+
+interface CardContent {
+  topLeft?: string | ReactNode;
+  topRight?: string | ReactNode;
+  bottomLeft?: string | ReactNode;
+  bottomRight?: string | ReactNode;
+  children?: ReactNode;
+}
+
+/** или */
+interface CardContent {
+  placement?: "top-left" | "top-right" | "bottom-left" | "bottom-right";
+  children?: ReactNode;
+}
+
+interface CardTimeline {
+  /**
+   * Описание, например время до конца фильма. Возможно,
+   * не нужно и стоит указывать bottomRight контент
+   */
+  text?: string;
+  progress?: string | number;
+  /**
+   * Не увеличивать высоту карточки
+   * @default true
+   */
+  inline?: boolean;
+}
+```
+
+```tsx live
+<Card title="Title" subtitle="Subtitle">
+  <CardContent placement="top-left">
+    <SomeIcon />
+  </CardContent>
+  <CardContent placement="top-right">
+    <SaveButton saved={isSaved} />
+  </CardContent>
+  <CardContent placement="bottom-right">18+</CardContent>
+</Card>;
+
+<Card title="Title" subtitle="Subtitle">
+  <CardContent
+    topLeft={<SomeIcon />}
+    topRight={<SaveButton saved={isSaved} />}
+    bottomRight="18+"
+  />
+</Card>;
+
+<Card title="Title" subtitle="Subtitle">
+  <CardMedia src={someSrc} alt="trailer" />
+  <CardContent
+    topLeft={<SomeIcon />}
+    topRight={<SaveButton saved={isSaved} />}
+    bottomRight="18+"
+  />
+  <CardTimeline text="еще 1ч 23мин" progress={56} />
+</Card>;
+
+<Card title="Title" subtitle="Subtitle">
+  <CardContent topLeft={<SomeIcon />} topRight={<SaveButton saved={isSaved} />}>
+    <CardMedia src={someSrc} alt="trailer" />
+  </CardContent>
+  <CardTimeline text="еще 1ч 23мин" progress={56} />
+</Card>;
+
+<Card
+  title="Title"
+  subtitle="Subtitle"
+  // как в ant, но кажется, что так менее гибко
+  cover={<CardMedia src={someSrc} alt="trailer" />}
+  square
+>
+  <CardContent
+    topLeft={<SomeIcon />}
+    topRight={<SaveButton saved={isSaved} />}
+  />
+  <CardTimeline text="еще 1ч 23мин" progress={56} />
+</Card>;
+```

package/emotion/es/components/Switch/Switch.tokens.js

@@ -23,6 +23,11 @@ export var tokens = {
   verticalGap: '--plasma-switch-vertical-gap',
   trackWidth: '--plasma-switch__track-width',
   trackHeight: '--plasma-switch__track-height',
+  trackBorderWidth: '--plasma-switch__track-border',
+  trackBorderColorOn: '--plasma-switch__track-checked_true-border-color',
+  trackBorderColorOnHover: '--plasma-switch__track-checked_true_hovered_true-border-color',
+  trackBorderColorOff: '--plasma-switch__track-checked_false-border-color',
+  trackBorderColorOffHover: '--plasma-switch__track-checked_false_hovered_true-border-color',
   trackBorderRadius: '--plasma-switch__track-border-radius',
   // NOTE: could be intersection with checked
   trackBackgroundColorOn: '--plasma-switch__track_checked_true-bg-color',
@@ -34,7 +39,8 @@ export var tokens = {
   thumbOffset: '--plasma-switch__thumb-offset',
   thumbBorderRadius: '--plasma-switch__thumb-border-radius',
   thumbPressScale: '--plasma-switch__thumb-scale',
-  thumbBackgroundColor: '--plasma-switch__thumb-bg-color',
+  thumbBackgroundColorOn: '--plasma-switch__thumb_checked_true-bg-color',
+  thumbBackgroundColorOff: '--plasma-switch__thumb-checked_false-bg-color',
   thumbBoxShadow: '--plasma-switch__thumb-box-shadow',
   thumbBoxShadowOn: '--plasma-switch__thumb-box-shadow_checked_true',
   labelOffsetPrivate: '--plasma_private-switch__label-offset'

package/emotion/es/components/Switch/_toggleSize/base.js

@@ -1,4 +1,4 @@
 import { css } from '@emotion/react';
 import { tokens } from '../Switch.tokens';
 import { StyledTrigger } from '../Switch.styles';
-export var base = /*#__PURE__*/css(StyledTrigger, "{flex:0 0 var(", tokens.trackWidth, ");width:var(", tokens.trackWidth, ");height:var(", tokens.trackHeight, ");border-radius:var(", tokens.trackBorderRadius, ");&::after{width:var(", tokens.thumbSize, ");height:var(", tokens.thumbSize, ");border-radius:var(", tokens.thumbBorderRadius, ");margin:auto var(", tokens.thumbOffset, ");}}:active:not([disabled]) ", StyledTrigger, "::after{width:calc(var(", tokens.thumbSize, ") * var(", tokens.thumbPressScale, ", 1));};label:plasma-new-hope__base;" + (process.env.NODE_ENV === "production" ? "" : "/*# sourceMappingURL=data:application/json;charset=utf-8;base64,eyJ2ZXJzaW9uIjozLCJzb3VyY2VzIjpbIi4uLy4uLy4uLy4uLy4uL3NyYy1lbW90aW9uL2NvbXBvbmVudHMvU3dpdGNoL190b2dnbGVTaXplL2Jhc2UudHMiXSwibmFtZXMiOltdLCJtYXBwaW5ncyI6IkFBS3VCIiwiZmlsZSI6Ii4uLy4uLy4uLy4uLy4uL3NyYy1lbW90aW9uL2NvbXBvbmVudHMvU3dpdGNoL190b2dnbGVTaXplL2Jhc2UudHMiLCJzb3VyY2VzQ29udGVudCI6WyJpbXBvcnQgeyBjc3MgfSBmcm9tICdAZW1vdGlvbi9yZWFjdCc7XG5cbmltcG9ydCB7IHRva2VucyB9IGZyb20gJy4uL1N3aXRjaC50b2tlbnMnO1xuaW1wb3J0IHsgU3R5bGVkVHJpZ2dlciB9IGZyb20gJy4uL1N3aXRjaC5zdHlsZXMnO1xuXG5leHBvcnQgY29uc3QgYmFzZSA9IGNzc2BcbiAgICAke1N0eWxlZFRyaWdnZXJ9IHtcbiAgICAgICAgZmxleDogMCAwIHZhcigke3Rva2Vucy50cmFja1dpZHRofSk7XG4gICAgICAgIHdpZHRoOiB2YXIoJHt0b2tlbnMudHJhY2tXaWR0aH0pO1xuICAgICAgICBoZWlnaHQ6IHZhcigke3Rva2Vucy50cmFja0hlaWdodH0pO1xuICAgICAgICBib3JkZXItcmFkaXVzOiB2YXIoJHt0b2tlbnMudHJhY2tCb3JkZXJSYWRpdXN9KTtcblxuICAgICAgICAmOjphZnRlciB7XG4gICAgICAgICAgICB3aWR0aDogdmFyKCR7dG9rZW5zLnRodW1iU2l6ZX0pO1xuICAgICAgICAgICAgaGVpZ2h0OiB2YXIoJHt0b2tlbnMudGh1bWJTaXplfSk7XG4gICAgICAgICAgICBib3JkZXItcmFkaXVzOiB2YXIoJHt0b2tlbnMudGh1bWJCb3JkZXJSYWRpdXN9KTtcbiAgICAgICAgICAgIG1hcmdpbjogYXV0byB2YXIoJHt0b2tlbnMudGh1bWJPZmZzZXR9KTtcbiAgICAgICAgfVxuICAgIH1cblxuICAgIDphY3RpdmU6bm90KFtkaXNhYmxlZF0pICR7U3R5bGVkVHJpZ2dlcn06OmFmdGVyIHtcbiAgICAgICAgd2lkdGg6IGNhbGModmFyKCR7dG9rZW5zLnRodW1iU2l6ZX0pICogdmFyKCR7dG9rZW5zLnRodW1iUHJlc3NTY2FsZX0sIDEpKTtcbiAgICB9XG5gO1xuIl19 */"));
+export var base = /*#__PURE__*/css(StyledTrigger, "{box-sizing:border-box;flex:0 0 var(", tokens.trackWidth, ");border-style:solid;border-width:var(", tokens.trackBorderWidth, ");border-radius:var(", tokens.trackBorderRadius, ");width:var(", tokens.trackWidth, ");height:var(", tokens.trackHeight, ");&::after{width:var(", tokens.thumbSize, ");height:var(", tokens.thumbSize, ");border-radius:var(", tokens.thumbBorderRadius, ");margin:auto var(", tokens.thumbOffset, ");}}:active:not([disabled]) ", StyledTrigger, "::after{width:calc(var(", tokens.thumbSize, ") * var(", tokens.thumbPressScale, ", 1));};label:plasma-new-hope__base;" + (process.env.NODE_ENV === "production" ? "" : "/*# sourceMappingURL=data:application/json;charset=utf-8;base64,eyJ2ZXJzaW9uIjozLCJzb3VyY2VzIjpbIi4uLy4uLy4uLy4uLy4uL3NyYy1lbW90aW9uL2NvbXBvbmVudHMvU3dpdGNoL190b2dnbGVTaXplL2Jhc2UudHMiXSwibmFtZXMiOltdLCJtYXBwaW5ncyI6IkFBS3VCIiwiZmlsZSI6Ii4uLy4uLy4uLy4uLy4uL3NyYy1lbW90aW9uL2NvbXBvbmVudHMvU3dpdGNoL190b2dnbGVTaXplL2Jhc2UudHMiLCJzb3VyY2VzQ29udGVudCI6WyJpbXBvcnQgeyBjc3MgfSBmcm9tICdAZW1vdGlvbi9yZWFjdCc7XG5cbmltcG9ydCB7IHRva2VucyB9IGZyb20gJy4uL1N3aXRjaC50b2tlbnMnO1xuaW1wb3J0IHsgU3R5bGVkVHJpZ2dlciB9IGZyb20gJy4uL1N3aXRjaC5zdHlsZXMnO1xuXG5leHBvcnQgY29uc3QgYmFzZSA9IGNzc2BcbiAgICAke1N0eWxlZFRyaWdnZXJ9IHtcbiAgICAgICAgYm94LXNpemluZzogYm9yZGVyLWJveDtcbiAgICAgICAgZmxleDogMCAwIHZhcigke3Rva2Vucy50cmFja1dpZHRofSk7XG5cbiAgICAgICAgYm9yZGVyLXN0eWxlOiBzb2xpZDtcbiAgICAgICAgYm9yZGVyLXdpZHRoOiB2YXIoJHt0b2tlbnMudHJhY2tCb3JkZXJXaWR0aH0pO1xuICAgICAgICBib3JkZXItcmFkaXVzOiB2YXIoJHt0b2tlbnMudHJhY2tCb3JkZXJSYWRpdXN9KTtcblxuICAgICAgICB3aWR0aDogdmFyKCR7dG9rZW5zLnRyYWNrV2lkdGh9KTtcbiAgICAgICAgaGVpZ2h0OiB2YXIoJHt0b2tlbnMudHJhY2tIZWlnaHR9KTtcblxuICAgICAgICAmOjphZnRlciB7XG4gICAgICAgICAgICB3aWR0aDogdmFyKCR7dG9rZW5zLnRodW1iU2l6ZX0pO1xuICAgICAgICAgICAgaGVpZ2h0OiB2YXIoJHt0b2tlbnMudGh1bWJTaXplfSk7XG4gICAgICAgICAgICBib3JkZXItcmFkaXVzOiB2YXIoJHt0b2tlbnMudGh1bWJCb3JkZXJSYWRpdXN9KTtcbiAgICAgICAgICAgIG1hcmdpbjogYXV0byB2YXIoJHt0b2tlbnMudGh1bWJPZmZzZXR9KTtcbiAgICAgICAgfVxuICAgIH1cblxuICAgIDphY3RpdmU6bm90KFtkaXNhYmxlZF0pICR7U3R5bGVkVHJpZ2dlcn06OmFmdGVyIHtcbiAgICAgICAgd2lkdGg6IGNhbGModmFyKCR7dG9rZW5zLnRodW1iU2l6ZX0pICogdmFyKCR7dG9rZW5zLnRodW1iUHJlc3NTY2FsZX0sIDEpKTtcbiAgICB9XG5gO1xuIl19 */"));

package/emotion/es/components/Switch/_view/base.js

@@ -1,4 +1,4 @@
 import { css } from '@emotion/react';
 import { tokens } from '../Switch.tokens';
 import { StyledTrigger, StyledInput, StyledLabel, StyledDescription } from '../Switch.styles';
-export var base = /*#__PURE__*/css(StyledTrigger, "{background-color:var(", tokens.trackBackgroundColorOff, ");}", StyledInput, ":not([disabled])~", StyledTrigger, ":hover{background-color:var(", tokens.trackBackgroundColorOffHover, ", var(", tokens.trackBackgroundColorOff, "));}", StyledInput, ":checked~", StyledTrigger, "{background-color:var(", tokens.trackBackgroundColorOn, ");}", StyledInput, ":checked:not([disabled])~", StyledTrigger, ":hover{background-color:var(", tokens.trackBackgroundColorOnHover, ", var(", tokens.trackBackgroundColorOn, "));}", StyledTrigger, "::after{background-color:var(", tokens.thumbBackgroundColor, ");box-shadow:var(", tokens.thumbBoxShadow, ");}", StyledInput, ":checked~", StyledTrigger, "::after{box-shadow:var(", tokens.thumbBoxShadowOn, ", var(", tokens.thumbBoxShadow, "));}", StyledLabel, "{color:var(", tokens.labelColor, ");}", StyledDescription, "{color:var(", tokens.descriptionColor, ");};label:plasma-new-hope__base;" + (process.env.NODE_ENV === "production" ? "" : "/*# sourceMappingURL=data:application/json;charset=utf-8;base64,eyJ2ZXJzaW9uIjozLCJzb3VyY2VzIjpbIi4uLy4uLy4uLy4uLy4uL3NyYy1lbW90aW9uL2NvbXBvbmVudHMvU3dpdGNoL192aWV3L2Jhc2UudHMiXSwibmFtZXMiOltdLCJtYXBwaW5ncyI6IkFBS3VCIiwiZmlsZSI6Ii4uLy4uLy4uLy4uLy4uL3NyYy1lbW90aW9uL2NvbXBvbmVudHMvU3dpdGNoL192aWV3L2Jhc2UudHMiLCJzb3VyY2VzQ29udGVudCI6WyJpbXBvcnQgeyBjc3MgfSBmcm9tICdAZW1vdGlvbi9yZWFjdCc7XG5cbmltcG9ydCB7IHRva2VucyB9IGZyb20gJy4uL1N3aXRjaC50b2tlbnMnO1xuaW1wb3J0IHsgU3R5bGVkVHJpZ2dlciwgU3R5bGVkSW5wdXQsIFN0eWxlZExhYmVsLCBTdHlsZWREZXNjcmlwdGlvbiB9IGZyb20gJy4uL1N3aXRjaC5zdHlsZXMnO1xuXG5leHBvcnQgY29uc3QgYmFzZSA9IGNzc2BcbiAgICAke1N0eWxlZFRyaWdnZXJ9IHtcbiAgICAgICAgYmFja2dyb3VuZC1jb2xvcjogdmFyKCR7dG9rZW5zLnRyYWNrQmFja2dyb3VuZENvbG9yT2ZmfSk7XG4gICAgfVxuXG4gICAgJHtTdHlsZWRJbnB1dH06bm90KFtkaXNhYmxlZF0pIH4gJHtTdHlsZWRUcmlnZ2VyfTpob3ZlciB7XG4gICAgICAgIGJhY2tncm91bmQtY29sb3I6IHZhcigke3Rva2Vucy50cmFja0JhY2tncm91bmRDb2xvck9mZkhvdmVyfSwgdmFyKCR7dG9rZW5zLnRyYWNrQmFja2dyb3VuZENvbG9yT2ZmfSkpO1xuICAgIH1cblxuICAgICR7U3R5bGVkSW5wdXR9OmNoZWNrZWQgfiAke1N0eWxlZFRyaWdnZXJ9IHtcbiAgICAgICAgYmFja2dyb3VuZC1jb2xvcjogdmFyKCR7dG9rZW5zLnRyYWNrQmFja2dyb3VuZENvbG9yT259KTtcbiAgICB9XG5cbiAgICAke1N0eWxlZElucHV0fTpjaGVja2VkOm5vdChbZGlzYWJsZWRdKSB+ICR7U3R5bGVkVHJpZ2dlcn06aG92ZXIgIHtcbiAgICAgICAgYmFja2dyb3VuZC1jb2xvcjogdmFyKCR7dG9rZW5zLnRyYWNrQmFja2dyb3VuZENvbG9yT25Ib3Zlcn0sIHZhcigke3Rva2Vucy50cmFja0JhY2tncm91bmRDb2xvck9ufSkpO1xuICAgIH1cblxuICAgICR7U3R5bGVkVHJpZ2dlcn06OmFmdGVyIHtcbiAgICAgICAgYmFja2dyb3VuZC1jb2xvcjogdmFyKCR7dG9rZW5zLnRodW1iQmFja2dyb3VuZENvbG9yfSk7XG4gICAgICAgIGJveC1zaGFkb3c6IHZhcigke3Rva2Vucy50aHVtYkJveFNoYWRvd30pO1xuICAgIH1cblxuICAgICR7U3R5bGVkSW5wdXR9OmNoZWNrZWQgfiAke1N0eWxlZFRyaWdnZXJ9OjphZnRlciB7XG4gICAgICAgIGJveC1zaGFkb3c6IHZhcigke3Rva2Vucy50aHVtYkJveFNoYWRvd09ufSwgdmFyKCR7dG9rZW5zLnRodW1iQm94U2hhZG93fSkpO1xuICAgIH1cblxuICAgICR7U3R5bGVkTGFiZWx9IHtcbiAgICAgICAgY29sb3I6IHZhcigke3Rva2Vucy5sYWJlbENvbG9yfSk7XG4gICAgfVxuXG4gICAgJHtTdHlsZWREZXNjcmlwdGlvbn0ge1xuICAgICAgICBjb2xvcjogdmFyKCR7dG9rZW5zLmRlc2NyaXB0aW9uQ29sb3J9KTtcbiAgICB9XG5gO1xuIl19 */"));
+export var base = /*#__PURE__*/css(StyledTrigger, "{background-color:var(", tokens.trackBackgroundColorOff, ");border-color:var(", tokens.trackBorderColorOff, ");}", StyledInput, ":not([disabled])~", StyledTrigger, ":hover{background-color:var(", tokens.trackBackgroundColorOffHover, ", var(", tokens.trackBackgroundColorOff, "));border-color:var(", tokens.trackBorderColorOffHover, ", var(", tokens.trackBorderColorOff, "));}", StyledInput, ":checked~", StyledTrigger, "{background-color:var(", tokens.trackBackgroundColorOn, ");border-color:var(", tokens.trackBorderColorOn, ");}", StyledInput, ":checked:not([disabled])~", StyledTrigger, ":hover{background-color:var(", tokens.trackBackgroundColorOnHover, ", var(", tokens.trackBackgroundColorOn, "));border-color:var(", tokens.trackBorderColorOnHover, ", var(", tokens.trackBorderColorOn, "));}", StyledTrigger, "::after{background-color:var(", tokens.thumbBackgroundColorOff, ");box-shadow:var(", tokens.thumbBoxShadow, ");}", StyledInput, ":checked~", StyledTrigger, "::after{background-color:var(", tokens.thumbBackgroundColorOn, ");box-shadow:var(", tokens.thumbBoxShadowOn, ", var(", tokens.thumbBoxShadow, "));}", StyledLabel, "{color:var(", tokens.labelColor, ");}", StyledDescription, "{color:var(", tokens.descriptionColor, ");};label:plasma-new-hope__base;" + (process.env.NODE_ENV === "production" ? "" : "/*# sourceMappingURL=data:application/json;charset=utf-8;base64,eyJ2ZXJzaW9uIjozLCJzb3VyY2VzIjpbIi4uLy4uLy4uLy4uLy4uL3NyYy1lbW90aW9uL2NvbXBvbmVudHMvU3dpdGNoL192aWV3L2Jhc2UudHMiXSwibmFtZXMiOltdLCJtYXBwaW5ncyI6IkFBS3VCIiwiZmlsZSI6Ii4uLy4uLy4uLy4uLy4uL3NyYy1lbW90aW9uL2NvbXBvbmVudHMvU3dpdGNoL192aWV3L2Jhc2UudHMiLCJzb3VyY2VzQ29udGVudCI6WyJpbXBvcnQgeyBjc3MgfSBmcm9tICdAZW1vdGlvbi9yZWFjdCc7XG5cbmltcG9ydCB7IHRva2VucyB9IGZyb20gJy4uL1N3aXRjaC50b2tlbnMnO1xuaW1wb3J0IHsgU3R5bGVkVHJpZ2dlciwgU3R5bGVkSW5wdXQsIFN0eWxlZExhYmVsLCBTdHlsZWREZXNjcmlwdGlvbiB9IGZyb20gJy4uL1N3aXRjaC5zdHlsZXMnO1xuXG5leHBvcnQgY29uc3QgYmFzZSA9IGNzc2BcbiAgICAke1N0eWxlZFRyaWdnZXJ9IHtcbiAgICAgICAgYmFja2dyb3VuZC1jb2xvcjogdmFyKCR7dG9rZW5zLnRyYWNrQmFja2dyb3VuZENvbG9yT2ZmfSk7XG4gICAgICAgIGJvcmRlci1jb2xvcjogdmFyKCR7dG9rZW5zLnRyYWNrQm9yZGVyQ29sb3JPZmZ9KTtcbiAgICB9XG5cbiAgICAke1N0eWxlZElucHV0fTpub3QoW2Rpc2FibGVkXSkgfiAke1N0eWxlZFRyaWdnZXJ9OmhvdmVyIHtcbiAgICAgICAgYmFja2dyb3VuZC1jb2xvcjogdmFyKCR7dG9rZW5zLnRyYWNrQmFja2dyb3VuZENvbG9yT2ZmSG92ZXJ9LCB2YXIoJHt0b2tlbnMudHJhY2tCYWNrZ3JvdW5kQ29sb3JPZmZ9KSk7XG4gICAgICAgIGJvcmRlci1jb2xvcjogdmFyKCR7dG9rZW5zLnRyYWNrQm9yZGVyQ29sb3JPZmZIb3Zlcn0sIHZhcigke3Rva2Vucy50cmFja0JvcmRlckNvbG9yT2ZmfSkpO1xuICAgIH1cblxuICAgICR7U3R5bGVkSW5wdXR9OmNoZWNrZWQgfiAke1N0eWxlZFRyaWdnZXJ9IHtcbiAgICAgICAgYmFja2dyb3VuZC1jb2xvcjogdmFyKCR7dG9rZW5zLnRyYWNrQmFja2dyb3VuZENvbG9yT259KTtcbiAgICAgICAgYm9yZGVyLWNvbG9yOiB2YXIoJHt0b2tlbnMudHJhY2tCb3JkZXJDb2xvck9ufSk7XG4gICAgfVxuXG4gICAgJHtTdHlsZWRJbnB1dH06Y2hlY2tlZDpub3QoW2Rpc2FibGVkXSkgfiAke1N0eWxlZFRyaWdnZXJ9OmhvdmVyICB7XG4gICAgICAgIGJhY2tncm91bmQtY29sb3I6IHZhcigke3Rva2Vucy50cmFja0JhY2tncm91bmRDb2xvck9uSG92ZXJ9LCB2YXIoJHt0b2tlbnMudHJhY2tCYWNrZ3JvdW5kQ29sb3JPbn0pKTtcbiAgICAgICAgYm9yZGVyLWNvbG9yOiB2YXIoJHt0b2tlbnMudHJhY2tCb3JkZXJDb2xvck9uSG92ZXJ9LCB2YXIoJHt0b2tlbnMudHJhY2tCb3JkZXJDb2xvck9ufSkpO1xuICAgIH1cblxuICAgICR7U3R5bGVkVHJpZ2dlcn06OmFmdGVyIHtcbiAgICAgICAgYmFja2dyb3VuZC1jb2xvcjogdmFyKCR7dG9rZW5zLnRodW1iQmFja2dyb3VuZENvbG9yT2ZmfSk7XG4gICAgICAgIGJveC1zaGFkb3c6IHZhcigke3Rva2Vucy50aHVtYkJveFNoYWRvd30pO1xuICAgIH1cblxuICAgICR7U3R5bGVkSW5wdXR9OmNoZWNrZWQgfiAke1N0eWxlZFRyaWdnZXJ9OjphZnRlciB7XG4gICAgICAgIGJhY2tncm91bmQtY29sb3I6IHZhcigke3Rva2Vucy50aHVtYkJhY2tncm91bmRDb2xvck9ufSk7XG4gICAgICAgIGJveC1zaGFkb3c6IHZhcigke3Rva2Vucy50aHVtYkJveFNoYWRvd09ufSwgdmFyKCR7dG9rZW5zLnRodW1iQm94U2hhZG93fSkpO1xuICAgIH1cblxuICAgICR7U3R5bGVkTGFiZWx9IHtcbiAgICAgICAgY29sb3I6IHZhcigke3Rva2Vucy5sYWJlbENvbG9yfSk7XG4gICAgfVxuXG4gICAgJHtTdHlsZWREZXNjcmlwdGlvbn0ge1xuICAgICAgICBjb2xvcjogdmFyKCR7dG9rZW5zLmRlc2NyaXB0aW9uQ29sb3J9KTtcbiAgICB9XG5gO1xuIl19 */"));