@skbkontur/react-ui 0.0.0-1e20264c71 → 0.0.0-1fb0cccdc2

package/cjs/components/Toggle/Toggle.mixins.js.map

@@ -0,0 +1 @@
+{"version":3,"sources":["Toggle.mixins.ts"],"names":["toggleSizeMixin","fontSize","toggleHeight","toggleWidth","css","buttonSizeMixin","labGrotesqueBaselineCompensation","toggleBorderRadius","toggleButtonOffsetY","labGrotesqueCompenstation","parseInt","buttonFontSize","baselineCompensation","isChrome","captionSizeMixin","handleMixin","toggleHandleSize","toggleHandleBorderRadius","containerSizeMixin","inputSizeMixin","handleWidthWithBorders","height","globalClasses","containerDisabled","background","handle","activeHandleSizeMixin","toggleBorderWidth","toggleHandleActiveWidthIncrement","handleActiveWidth","disabled"],"mappings":"8bAAA;AACA;;AAEA,yC;;AAEO,IAAMA,eAAe,GAAG,SAAlBA,eAAkB,CAACC,QAAD,EAAmBC,YAAnB,EAAyCC,WAAzC,EAAiE;AAC9F,aAAOC,YAAP;AACiBF,EAAAA,YADjB;AAEeD,EAAAA,QAFf;;;AAKaE,EAAAA,WALb;;;AAQD,CATM,C;;AAWA,IAAME,eAAe,GAAG,SAAlBA,eAAkB;AAC7BC,gCAD6B;AAE7BL,QAF6B;AAG7BC,YAH6B;AAI7BC,WAJ6B;AAK7BI,kBAL6B;AAM7BC,mBAN6B;AAO1B;AACH,MAAMC,yBAAyB,GAAGC,QAAQ,CAACJ,gCAAD,CAA1C;AACA,MAAMK,cAAc,GAAGD,QAAQ,CAACT,QAAD,CAA/B;AACA,MAAMW,oBAAoB,GAAGD,cAAc,IAAI,EAAlB,IAAwBE,gBAAxB,GAAmC,CAACJ,yBAApC,GAAgE,CAA7F;AACA,aAAOL,YAAP;AACYF,EAAAA,YADZ;AAEWC,EAAAA,WAFX;AAGcA,EAAAA,WAHd;;AAKmBI,EAAAA,kBALnB;AAMiBL,EAAAA,YANjB;;AAQqBM,EAAAA,mBARrB,EAQ8CI,oBAR9C;;AAUD,CArBM,C;;AAuBA,IAAME,gBAAgB,GAAG,SAAnBA,gBAAmB,CAACb,QAAD,EAAmBC,YAAnB,EAA4C;AAC1E,aAAOE,YAAP;AACiBF,EAAAA,YADjB;AAEeD,EAAAA,QAFf;;AAID,CALM,C;;AAOA,IAAMc,WAAW,GAAG,SAAdA,WAAc,CAACC,gBAAD,EAA2BC,wBAA3B,EAAgE;AACzF,aAAOb,YAAP;AACmBa,EAAAA,wBADnB;AAEYD,EAAAA,gBAFZ;AAGWA,EAAAA,gBAHX;;AAKD,CANM,C;;AAQA,IAAME,kBAAkB,GAAG,SAArBA,kBAAqB,CAACX,kBAAD,EAAgC;AAChE,aAAOH,YAAP;AACmBG,EAAAA,kBADnB;;AAGD,CAJM,C;;AAMA,IAAMY,cAAc,GAAG,SAAjBA,cAAiB,CAACjB,YAAD,EAAuBC,WAAvB,EAA+C;AAC3E,MAAMiB,sBAAsB,GAAGlB,YAA/B;AACA,MAAMmB,MAAM,GAAGX,QAAQ,CAACR,YAAD,CAAvB;AACA,aAAOE,YAAP;AACiBkB,wBAAcC,iBAD/B,EACqDD,sBAAcE,UADnE;AAEqBH,EAAAA,MAAM,GAAG,GAF9B,EAE2CA,MAAM,GAAG,GAFpD;;AAIiBC,wBAAcG,MAJ/B;AAK4BtB,EAAAA,WAL5B,EAKwDiB,sBALxD;;;AAQD,CAXM,C;;AAaA,IAAMM,qBAAqB,GAAG,SAAxBA,qBAAwB;AACnCV,gBADmC;AAEnCW,iBAFmC;AAGnCC,gCAHmC;AAInCzB,WAJmC;AAKhC;AACH,MAAMiB,sBAAsB,GAAGJ,gBAA/B;AACA,MAAMa,iBAAiB,aAAWT,sBAAX,eAA2CO,iBAA3C,WAAkEC,gCAAlE,MAAvB;AACA,aAAOxB,YAAP;AACkBkB,wBAAcQ,QADhC,EAC8CR,sBAAcG,MAD5D;AAEaI,EAAAA,iBAFb;;AAIkBP,wBAAcQ,QAJhC,EAI8DR,sBAAcG,MAJ5E;AAK4BtB,EAAAA,WAL5B,EAKwDiB,sBALxD;;;AAQD,CAhBM,C","sourcesContent":["import { css } from '../../lib/theming/Emotion';\nimport { isChrome } from '../../lib/client';\n\nimport { globalClasses } from './Toggle.styles';\n\nexport const toggleSizeMixin = (fontSize: string, toggleHeight: string, toggleWidth: string) => {\n  return css`\n    line-height: ${toggleHeight};\n    font-size: ${fontSize};\n\n    &::before {\n      width: ${toggleWidth};\n    }\n  `;\n};\n\nexport const buttonSizeMixin = (\n  labGrotesqueBaselineCompensation: string,\n  fontSize: string,\n  toggleHeight: string,\n  toggleWidth: string,\n  toggleBorderRadius: string,\n  toggleButtonOffsetY: string,\n) => {\n  const labGrotesqueCompenstation = parseInt(labGrotesqueBaselineCompensation);\n  const buttonFontSize = parseInt(fontSize);\n  const baselineCompensation = buttonFontSize <= 16 && isChrome ? -labGrotesqueCompenstation : 0;\n  return css`\n    height: ${toggleHeight};\n    width: ${toggleWidth};\n    flex: 1 0 ${toggleWidth};\n\n    border-radius: ${toggleBorderRadius};\n    line-height: ${toggleHeight};\n\n    margin-top: calc(${toggleButtonOffsetY} + ${baselineCompensation}px);\n  `;\n};\n\nexport const captionSizeMixin = (fontSize: string, toggleHeight: string) => {\n  return css`\n    line-height: ${toggleHeight};\n    font-size: ${fontSize};\n  `;\n};\n\nexport const handleMixin = (toggleHandleSize: string, toggleHandleBorderRadius: string) => {\n  return css`\n    border-radius: ${toggleHandleBorderRadius};\n    height: ${toggleHandleSize};\n    width: ${toggleHandleSize};\n  `;\n};\n\nexport const containerSizeMixin = (toggleBorderRadius: string) => {\n  return css`\n    border-radius: ${toggleBorderRadius};\n  `;\n};\n\nexport const inputSizeMixin = (toggleHeight: string, toggleWidth: string) => {\n  const handleWidthWithBorders = toggleHeight;\n  const height = parseInt(toggleHeight);\n  return css`\n    &:checked ~ .${globalClasses.containerDisabled} .${globalClasses.background} {\n      border-radius: ${height * 0.5}px 0 0 ${height * 0.5}px;\n    }\n    &:checked ~ .${globalClasses.handle} {\n      transform: translateX(${toggleWidth}) translateX(-${handleWidthWithBorders});\n    }\n  `;\n};\n\nexport const activeHandleSizeMixin = (\n  toggleHandleSize: string,\n  toggleBorderWidth: string,\n  toggleHandleActiveWidthIncrement: string,\n  toggleWidth: string,\n) => {\n  const handleWidthWithBorders = toggleHandleSize;\n  const handleActiveWidth = `calc(${handleWidthWithBorders} - 2 * ${toggleBorderWidth} + ${toggleHandleActiveWidthIncrement})`;\n  return css`\n    &:active:not(.${globalClasses.disabled}) .${globalClasses.handle} {\n      width: ${handleActiveWidth};\n    }\n    &:active:not(.${globalClasses.disabled}) input:checked ~ .${globalClasses.handle} {\n      transform: translateX(${toggleWidth}) translateX(-${handleWidthWithBorders}) translateX(-4px);\n    }\n  `;\n};\n"]}

package/cjs/components/Toggle/Toggle.styles.d.ts

@@ -0,0 +1,53 @@
+import { Theme } from '../../lib/theming/Theme';
+export declare const globalClasses: {
+    handle: string;
+    container: string;
+    disabled: string;
+    containerDisabled: string;
+    containerLoading: string;
+    background: string;
+};
+export declare const styles: {
+    root(t: Theme): string;
+    rootSmall(t: Theme): string;
+    rootMedium(t: Theme): string;
+    rootLarge(t: Theme): string;
+    activeHandleSmall(t: Theme): string;
+    activeHandleMedium(t: Theme): string;
+    activeHandleLarge(t: Theme): string;
+    disableAnimation(): string;
+    handle(t: Theme): string;
+    handleSmall(t: Theme): string;
+    handleMedium(t: Theme): string;
+    handleLarge(t: Theme): string;
+    handleDisabled(t: Theme): string;
+    input(t: Theme): string;
+    inputSmall(t: Theme): string;
+    inputMedium(t: Theme): string;
+    inputLarge(t: Theme): string;
+    input2022(t: Theme): string;
+    container(t: Theme): string;
+    containerSmall(t: Theme): string;
+    containerMedium(t: Theme): string;
+    containerLarge(t: Theme): string;
+    containerDisabled(t: Theme): string;
+    focused(t: Theme): string;
+    activeBackground(): string;
+    disabledBackground(t: Theme): string;
+    activeBackgroundLoading(t: Theme): string;
+    isWarning(t: Theme): string;
+    isError(t: Theme): string;
+    button(t: Theme): string;
+    buttonSmall(t: Theme): string;
+    buttonMedium(t: Theme): string;
+    buttonLarge(t: Theme): string;
+    buttonRight(): string;
+    disabled(): string;
+    rootLeft(): string;
+    caption(t: Theme): string;
+    captionSmall(t: Theme): string;
+    captionMedium(t: Theme): string;
+    captionLarge(t: Theme): string;
+    disabledCaption(t: Theme): string;
+    captionLeft(t: Theme): string;
+};

package/cjs/components/Toggle/Toggle.styles.js

@@ -0,0 +1,438 @@
+"use strict";var _interopRequireDefault = require("@babel/runtime/helpers/interopRequireDefault").default;exports.__esModule = true;exports.styles = exports.globalClasses = void 0;var _taggedTemplateLiteralLoose2 = _interopRequireDefault(require("@babel/runtime/helpers/taggedTemplateLiteralLoose"));var _Emotion = require("../../lib/theming/Emotion");
+
+
+var _Toggle = require("./Toggle.mixins");var _templateObject, _templateObject2, _templateObject3, _templateObject4, _templateObject5, _templateObject6, _templateObject7, _templateObject8, _templateObject9, _templateObject10, _templateObject11, _templateObject12, _templateObject13, _templateObject14, _templateObject15, _templateObject16, _templateObject17, _templateObject18, _templateObject19, _templateObject20, _templateObject21, _templateObject22, _templateObject23, _templateObject24, _templateObject25, _templateObject26, _templateObject27, _templateObject28, _templateObject29, _templateObject30, _templateObject31, _templateObject32, _templateObject33, _templateObject34, _templateObject35, _templateObject36, _templateObject37, _templateObject38, _templateObject39, _templateObject40, _templateObject41, _templateObject42;
+
+
+
+
+
+
+
+
+
+var globalClasses = (0, _Emotion.prefix)('toggle')({
+  handle: 'handle',
+  container: 'container',
+  disabled: 'disabled',
+  containerDisabled: 'container-disabled',
+  containerLoading: 'container-loading',
+  background: 'background' });exports.globalClasses = globalClasses;
+
+
+var styles = (0, _Emotion.memoizeStyle)({
+  root: function root(t) {
+    return (0, _Emotion.css)(_templateObject || (_templateObject = (0, _taggedTemplateLiteralLoose2.default)(["\n      display: inline-flex;\n      cursor: pointer;\n      align-items: baseline;\n      position: relative;\n\n      &::before {\n        // non-breaking space.\n        // makes a correct space for absolutely positioned button,\n        // and also height and baseline for toggle without caption.\n        content: '\\00A0';\n        display: inline-block;\n        flex: 0 0 auto;\n      }\n\n      &:hover .", " {\n        background: ", ";\n      }\n    "], ["\n      display: inline-flex;\n      cursor: pointer;\n      align-items: baseline;\n      position: relative;\n\n      &::before {\n        // non-breaking space.\n        // makes a correct space for absolutely positioned button,\n        // and also height and baseline for toggle without caption.\n        content: '\\\\00A0';\n        display: inline-block;\n        flex: 0 0 auto;\n      }\n\n      &:hover .", " {\n        background: ", ";\n      }\n    "])),
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+    globalClasses.handle,
+    t.toggleBgHover);
+
+
+  },
+  rootSmall: function rootSmall(t) {
+    return (0, _Emotion.css)(_templateObject2 || (_templateObject2 = (0, _taggedTemplateLiteralLoose2.default)(["\n      ", ";\n    "])),
+    (0, _Toggle.toggleSizeMixin)(t.toggleFontSizeSmall, t.toggleHeightSmall, t.toggleWidthSmall));
+
+  },
+  rootMedium: function rootMedium(t) {
+    return (0, _Emotion.css)(_templateObject3 || (_templateObject3 = (0, _taggedTemplateLiteralLoose2.default)(["\n      ", ";\n    "])),
+    (0, _Toggle.toggleSizeMixin)(t.toggleFontSizeMedium, t.toggleHeightMedium, t.toggleWidthMedium));
+
+  },
+  rootLarge: function rootLarge(t) {
+    return (0, _Emotion.css)(_templateObject4 || (_templateObject4 = (0, _taggedTemplateLiteralLoose2.default)(["\n      ", ";\n    "])),
+    (0, _Toggle.toggleSizeMixin)(t.toggleFontSizeLarge, t.toggleHeightLarge, t.toggleWidthLarge));
+
+  },
+
+  activeHandleSmall: function activeHandleSmall(t) {
+    return (0, _Emotion.css)(_templateObject5 || (_templateObject5 = (0, _taggedTemplateLiteralLoose2.default)(["\n      ", ";\n    "])),
+    (0, _Toggle.activeHandleSizeMixin)(
+    t.toggleHandleSizeSmall,
+    t.toggleBorderWidth,
+    t.toggleHandleActiveWidthIncrement,
+    t.toggleWidthSmall));
+
+
+  },
+  activeHandleMedium: function activeHandleMedium(t) {
+    return (0, _Emotion.css)(_templateObject6 || (_templateObject6 = (0, _taggedTemplateLiteralLoose2.default)(["\n      ", ";\n    "])),
+    (0, _Toggle.activeHandleSizeMixin)(
+    t.toggleHandleSizeMedium,
+    t.toggleBorderWidth,
+    t.toggleHandleActiveWidthIncrement,
+    t.toggleWidthMedium));
+
+
+  },
+  activeHandleLarge: function activeHandleLarge(t) {
+    return (0, _Emotion.css)(_templateObject7 || (_templateObject7 = (0, _taggedTemplateLiteralLoose2.default)(["\n      ", ";\n    "])),
+    (0, _Toggle.activeHandleSizeMixin)(
+    t.toggleHandleSizeLarge,
+    t.toggleBorderWidth,
+    t.toggleHandleActiveWidthIncrement,
+    t.toggleWidthLarge));
+
+
+  },
+
+  disableAnimation: function disableAnimation() {
+    return (0, _Emotion.css)(_templateObject8 || (_templateObject8 = (0, _taggedTemplateLiteralLoose2.default)(["\n      &,\n      * {\n        transition: none !important;\n      }\n    "])));
+
+
+
+
+
+  },
+
+  handle: function handle(t) {
+    return (0, _Emotion.css)(_templateObject9 || (_templateObject9 = (0, _taggedTemplateLiteralLoose2.default)(["\n      background: ", ";\n      bottom: ", ";\n      box-shadow: ", ";\n      left: ", ";\n      position: absolute;\n      top: ", ";\n      transition: 0.2s ease-in;\n    "])),
+    t.toggleHandleBg,
+    t.toggleBorderWidth,
+    t.toggleHandleBoxShadowOld,
+    t.toggleHandleLeft,
+
+    t.toggleHandleTop);
+
+
+  },
+  handleSmall: function handleSmall(t) {
+    return (0, _Emotion.css)(_templateObject10 || (_templateObject10 = (0, _taggedTemplateLiteralLoose2.default)(["\n      ", ";\n    "])),
+    (0, _Toggle.handleMixin)(t.toggleHandleSizeSmall, t.toggleHandleBorderRadiusSmall));
+
+  },
+  handleMedium: function handleMedium(t) {
+    return (0, _Emotion.css)(_templateObject11 || (_templateObject11 = (0, _taggedTemplateLiteralLoose2.default)(["\n      ", ";\n    "])),
+    (0, _Toggle.handleMixin)(t.toggleHandleSizeMedium, t.toggleHandleBorderRadiusMedium));
+
+  },
+  handleLarge: function handleLarge(t) {
+    return (0, _Emotion.css)(_templateObject12 || (_templateObject12 = (0, _taggedTemplateLiteralLoose2.default)(["\n      ", ";\n    "])),
+    (0, _Toggle.handleMixin)(t.toggleHandleSizeLarge, t.toggleHandleBorderRadiusLarge));
+
+  },
+
+  handleDisabled: function handleDisabled(t) {
+    return (0, _Emotion.css)(_templateObject13 || (_templateObject13 = (0, _taggedTemplateLiteralLoose2.default)(["\n      background: ", " !important; // override root hover/active styles\n    "])),
+    t.toggleDisabledHandleBg);
+
+  },
+
+  input: function input(t) {
+    return (0, _Emotion.css)(_templateObject14 || (_templateObject14 = (0, _taggedTemplateLiteralLoose2.default)(["\n      position: absolute;\n      opacity: 0;\n\n      &:focus {\n        outline: none;\n      }\n      &:checked ~ .", " {\n        box-shadow: inset 0 0 0 ", " ", ";\n        background: ", ";\n        transition: background 0s 0.2s;\n      }\n      &:checked ~ .", " {\n        box-shadow: inset 0 0 0 ", " ", ";\n        background: ", ";\n        transition: background 0s 0.2s;\n      }\n      &:checked ~ .", " {\n        background: ", ";\n        box-shadow: inset 0 0 0 ", " ", ";\n      }\n      &:checked ~ .", " .", " {\n        width: 70%;\n        background: ", ";\n      }\n      &:checked ~ .", " .", " {\n        width: 70%;\n        background: ", ";\n        box-shadow: inset 0 0 0 1px ", ";\n      }\n      &:checked ~ .", " {\n        background: ", ";\n        &:hover {\n          background: ", ";\n        }\n      }\n    "])),
+
+
+
+
+
+
+    globalClasses.container,
+    t.toggleBorderWidth, t.toggleBgChecked,
+    t.toggleBgChecked,
+
+
+    globalClasses.containerDisabled,
+    t.toggleBorderWidth, t.toggleBorderColorDisabledChecked,
+    t.toggleBgDisabledChecked,
+
+
+    globalClasses.containerLoading,
+    t.toggleBorderColor,
+    t.toggleBorderWidth, t.toggleBorderColor,
+
+    globalClasses.container, globalClasses.background,
+
+    t.toggleBgChecked,
+
+    globalClasses.containerDisabled, globalClasses.background,
+
+    t.toggleBgDisabledChecked,
+    t.toggleBorderColorDisabledChecked,
+
+    globalClasses.handle,
+    t.toggleCheckedBg,
+
+    t.toggleCheckedBgHover);
+
+
+
+  },
+  inputSmall: function inputSmall(t) {
+    return (0, _Emotion.css)(_templateObject15 || (_templateObject15 = (0, _taggedTemplateLiteralLoose2.default)(["\n      ", ";\n    "])),
+    (0, _Toggle.inputSizeMixin)(t.toggleHeightSmall, t.toggleWidthSmall));
+
+  },
+  inputMedium: function inputMedium(t) {
+    return (0, _Emotion.css)(_templateObject16 || (_templateObject16 = (0, _taggedTemplateLiteralLoose2.default)(["\n      ", ";\n    "])),
+    (0, _Toggle.inputSizeMixin)(t.toggleHeightMedium, t.toggleWidthMedium));
+
+  },
+  inputLarge: function inputLarge(t) {
+    return (0, _Emotion.css)(_templateObject17 || (_templateObject17 = (0, _taggedTemplateLiteralLoose2.default)(["\n      ", ";\n    "])),
+    (0, _Toggle.inputSizeMixin)(t.toggleHeightLarge, t.toggleWidthLarge));
+
+  },
+
+  input2022: function input2022(t) {
+    return (0, _Emotion.css)(_templateObject18 || (_templateObject18 = (0, _taggedTemplateLiteralLoose2.default)(["\n      &:enabled {\n        ~ .", ", ~ .", " {\n          transition: 0.2s ease-in;\n        }\n        :not(:checked) {\n          ~ .", " {\n            background: ", ";\n            box-shadow: ", ";\n          }\n          ~ .", " {\n            background: ", ";\n            box-shadow: ", ";\n          }\n        }\n        :checked {\n          ~ .", " {\n            background: ", ";\n            box-shadow: ", ";\n          }\n          ~ .", " {\n            background: ", ";\n            box-shadow: ", ";\n          }\n        }\n      }\n      &:enabled:hover {\n        :not(:checked) {\n          ~ .", " {\n            background: ", ";\n            box-shadow: ", ";\n          }\n          ~ .", " {\n            background: ", ";\n            box-shadow: ", ";\n          }\n        }\n        :checked {\n          ~ .", " {\n            background: ", ";\n            box-shadow: ", ";\n          }\n          ~ .", " {\n            background: ", ";\n            box-shadow: ", ";\n          }\n        }\n      }\n      &:disabled {\n        :not(:checked) {\n          ~ .", " {\n            background: ", ";\n            box-shadow: ", ";\n          }\n          ~ .", " {\n            background: ", " !important;\n            box-shadow: ", ";\n          }\n        }\n        :checked {\n          ~ .", " {\n            background: ", ";\n            box-shadow: ", ";\n          }\n          ~ .", " {\n            background: ", " !important;\n            box-shadow: ", ";\n          }\n        }\n      }\n    "])),
+
+    globalClasses.container, globalClasses.handle,
+
+
+
+    globalClasses.container,
+    t.toggleContainerBg,
+    t.toggleContainerBoxShadow,
+
+    globalClasses.handle,
+    t.toggleHandleBg,
+    t.toggleHandleBoxShadow,
+
+
+
+    globalClasses.container,
+    t.toggleContainerBgChecked,
+    t.toggleContainerBoxShadowChecked,
+
+    globalClasses.handle,
+    t.toggleHandleBgChecked,
+    t.toggleHandleBoxShadowChecked,
+
+
+
+
+
+    globalClasses.container,
+    t.toggleContainerBgHover,
+    t.toggleContainerBoxShadowHover,
+
+    globalClasses.handle,
+    t.toggleHandleBgHover,
+    t.toggleHandleBoxShadowHover,
+
+
+
+    globalClasses.container,
+    t.toggleContainerBgCheckedHover,
+    t.toggleContainerBoxShadowCheckedHover,
+
+    globalClasses.handle,
+    t.toggleHandleBgCheckedHover,
+    t.toggleHandleBoxShadowCheckedHover,
+
+
+
+
+
+    globalClasses.container,
+    t.toggleContainerBgDisabled,
+    t.toggleContainerBoxShadowDisabled,
+
+    globalClasses.handle,
+    t.toggleHandleBgDisabled,
+    t.toggleHandleBoxShadowDisabled,
+
+
+
+    globalClasses.container,
+    t.toggleContainerBgDisabledChecked,
+    t.toggleContainerBoxShadowDisabledChecked,
+
+    globalClasses.handle,
+    t.toggleHandleBgDisabledChecked,
+    t.toggleHandleBoxShadowDisabledChecked);
+
+
+
+
+  },
+
+  container: function container(t) {
+    return (0, _Emotion.css)(_templateObject19 || (_templateObject19 = (0, _taggedTemplateLiteralLoose2.default)(["\n      box-shadow: inset 0 0 0 ", " ", ";\n      height: 100%;\n      overflow: hidden;\n      position: absolute;\n      width: 100%;\n      /* fixes overflow issue in Safari: https://bugs.webkit.org/show_bug.cgi?id=98538 */\n      z-index: 0;\n    "])),
+    t.toggleBorderWidth, t.toggleBorderColor);
+
+
+
+
+
+
+
+  },
+  containerSmall: function containerSmall(t) {
+    return (0, _Emotion.css)(_templateObject20 || (_templateObject20 = (0, _taggedTemplateLiteralLoose2.default)(["\n      ", ";\n    "])),
+    (0, _Toggle.containerSizeMixin)(t.toggleBorderRadiusSmall));
+
+  },
+  containerMedium: function containerMedium(t) {
+    return (0, _Emotion.css)(_templateObject21 || (_templateObject21 = (0, _taggedTemplateLiteralLoose2.default)(["\n      ", ";\n    "])),
+    (0, _Toggle.containerSizeMixin)(t.toggleBorderRadiusMedium));
+
+  },
+  containerLarge: function containerLarge(t) {
+    return (0, _Emotion.css)(_templateObject22 || (_templateObject22 = (0, _taggedTemplateLiteralLoose2.default)(["\n      ", ";\n    "])),
+    (0, _Toggle.containerSizeMixin)(t.toggleBorderRadiusLarge));
+
+  },
+
+  containerDisabled: function containerDisabled(t) {
+    return (0, _Emotion.css)(_templateObject23 || (_templateObject23 = (0, _taggedTemplateLiteralLoose2.default)(["\n      background: ", ";\n      box-shadow: inset 0 0 0 1px ", ";\n    "])),
+    t.toggleBgDisabled,
+    t.toggleBorderColorDisabled);
+
+  },
+
+  focused: function focused(t) {
+    return (0, _Emotion.css)(_templateObject24 || (_templateObject24 = (0, _taggedTemplateLiteralLoose2.default)(["\n      box-shadow: 0 0 0 1px ", ", 0 0 0 ", " ", ";\n    "])),
+    t.toggleOutlineColorFocus, t.toggleOutlineWidth, t.toggleFocusShadowColor);
+
+  },
+
+  activeBackground: function activeBackground() {
+    return (0, _Emotion.css)(_templateObject25 || (_templateObject25 = (0, _taggedTemplateLiteralLoose2.default)(["\n      background: inherit;\n      bottom: 0;\n      left: 0;\n      position: absolute;\n      top: 0;\n      transition: 0.2s ease-in;\n      width: 10px;\n    "])));
+
+
+
+
+
+
+
+
+  },
+
+  disabledBackground: function disabledBackground(t) {
+    return (0, _Emotion.css)(_templateObject26 || (_templateObject26 = (0, _taggedTemplateLiteralLoose2.default)(["\n      box-shadow: inset 0 0 0 1px ", ";\n      width: 0;\n    "])),
+    t.toggleBorderColorDisabled);
+
+
+  },
+
+  activeBackgroundLoading: function activeBackgroundLoading(t) {
+    return (0, _Emotion.css)(_templateObject27 || (_templateObject27 = (0, _taggedTemplateLiteralLoose2.default)(["\n      background: ", ";\n    "])),
+    t.toggleBgActive);
+
+  },
+
+  isWarning: function isWarning(t) {
+    return (0, _Emotion.css)(_templateObject28 || (_templateObject28 = (0, _taggedTemplateLiteralLoose2.default)(["\n      box-shadow: 0 0 0 1px ", ", 0 0 0 ", " ", ";\n    "])),
+    t.toggleOutlineColorFocus, t.toggleOutlineWidth, t.toggleShadowColorWarning);
+
+  },
+
+  isError: function isError(t) {
+    return (0, _Emotion.css)(_templateObject29 || (_templateObject29 = (0, _taggedTemplateLiteralLoose2.default)(["\n      box-shadow: 0 0 0 1px ", ", 0 0 0 ", " ", ";\n    "])),
+    t.toggleOutlineColorFocus, t.toggleOutlineWidth, t.toggleShadowColorError);
+
+  },
+
+  button: function button(t) {
+    return (0, _Emotion.css)(_templateObject30 || (_templateObject30 = (0, _taggedTemplateLiteralLoose2.default)(["\n      position: absolute;\n      left: 0;\n      top: 0;\n      background: ", ";\n      line-height: ", ";\n    "])),
+
+
+
+    t.toggleBaseBg,
+    t.toggleHeight);
+
+  },
+  buttonSmall: function buttonSmall(t) {
+    return (0, _Emotion.css)(_templateObject31 || (_templateObject31 = (0, _taggedTemplateLiteralLoose2.default)(["\n      ", ";\n    "])),
+    (0, _Toggle.buttonSizeMixin)(
+    t.labGrotesqueBaselineCompensation,
+    t.toggleFontSizeSmall,
+    t.toggleHeightSmall,
+    t.toggleWidthSmall,
+    t.toggleBorderRadiusSmall,
+    t.toggleButtonOffsetY));
+
+
+  },
+  buttonMedium: function buttonMedium(t) {
+    return (0, _Emotion.css)(_templateObject32 || (_templateObject32 = (0, _taggedTemplateLiteralLoose2.default)(["\n      ", ";\n    "])),
+    (0, _Toggle.buttonSizeMixin)(
+    t.labGrotesqueBaselineCompensation,
+    t.toggleFontSizeMedium,
+    t.toggleHeightMedium,
+    t.toggleWidthMedium,
+    t.toggleBorderRadiusMedium,
+    t.toggleButtonOffsetY));
+
+
+  },
+  buttonLarge: function buttonLarge(t) {
+    return (0, _Emotion.css)(_templateObject33 || (_templateObject33 = (0, _taggedTemplateLiteralLoose2.default)(["\n      ", ";\n    "])),
+    (0, _Toggle.buttonSizeMixin)(
+    t.labGrotesqueBaselineCompensation,
+    t.toggleFontSizeLarge,
+    t.toggleHeightLarge,
+    t.toggleWidthLarge,
+    t.toggleBorderRadiusLarge,
+    t.toggleButtonOffsetY));
+
+
+  },
+
+  buttonRight: function buttonRight() {
+    return (0, _Emotion.css)(_templateObject34 || (_templateObject34 = (0, _taggedTemplateLiteralLoose2.default)(["\n      right: 0;\n      left: auto;\n    "])));
+
+
+
+  },
+
+  disabled: function disabled() {
+    return (0, _Emotion.css)(_templateObject35 || (_templateObject35 = (0, _taggedTemplateLiteralLoose2.default)(["\n      cursor: default;\n    "])));
+
+
+  },
+
+  rootLeft: function rootLeft() {
+    return (0, _Emotion.css)(_templateObject36 || (_templateObject36 = (0, _taggedTemplateLiteralLoose2.default)(["\n      flex-direction: row-reverse;\n    "])));
+
+
+  },
+
+  caption: function caption(t) {
+    return (0, _Emotion.css)(_templateObject37 || (_templateObject37 = (0, _taggedTemplateLiteralLoose2.default)(["\n      color: ", ";\n      padding: 0 0 0 ", ";\n    "])),
+    t.toggleTextColor,
+    t.toggleCaptionGap);
+
+  },
+  captionSmall: function captionSmall(t) {
+    return (0, _Emotion.css)(_templateObject38 || (_templateObject38 = (0, _taggedTemplateLiteralLoose2.default)(["\n      ", ";\n    "])),
+    (0, _Toggle.captionSizeMixin)(t.toggleFontSizeSmall, t.toggleHeightSmall));
+
+  },
+  captionMedium: function captionMedium(t) {
+    return (0, _Emotion.css)(_templateObject39 || (_templateObject39 = (0, _taggedTemplateLiteralLoose2.default)(["\n      ", ";\n    "])),
+    (0, _Toggle.captionSizeMixin)(t.toggleFontSizeMedium, t.toggleHeightMedium));
+
+  },
+  captionLarge: function captionLarge(t) {
+    return (0, _Emotion.css)(_templateObject40 || (_templateObject40 = (0, _taggedTemplateLiteralLoose2.default)(["\n      ", ";\n    "])),
+    (0, _Toggle.captionSizeMixin)(t.toggleFontSizeLarge, t.toggleHeightLarge));
+
+  },
+
+  disabledCaption: function disabledCaption(t) {
+    return (0, _Emotion.css)(_templateObject41 || (_templateObject41 = (0, _taggedTemplateLiteralLoose2.default)(["\n      color: ", ";\n    "])),
+    t.textColorDisabled);
+
+  },
+
+  captionLeft: function captionLeft(t) {
+    return (0, _Emotion.css)(_templateObject42 || (_templateObject42 = (0, _taggedTemplateLiteralLoose2.default)(["\n      color: ", ";\n      padding: 0 ", " 0 0;\n    "])),
+    t.toggleTextColor,
+    t.toggleCaptionGap);
+
+  } });exports.styles = styles;

package/cjs/components/Toggle/Toggle.styles.js.map

@@ -0,0 +1 @@
+{"version":3,"sources":["Toggle.styles.ts"],"names":["globalClasses","handle","container","disabled","containerDisabled","containerLoading","background","styles","root","t","css","toggleBgHover","rootSmall","toggleFontSizeSmall","toggleHeightSmall","toggleWidthSmall","rootMedium","toggleFontSizeMedium","toggleHeightMedium","toggleWidthMedium","rootLarge","toggleFontSizeLarge","toggleHeightLarge","toggleWidthLarge","activeHandleSmall","toggleHandleSizeSmall","toggleBorderWidth","toggleHandleActiveWidthIncrement","activeHandleMedium","toggleHandleSizeMedium","activeHandleLarge","toggleHandleSizeLarge","disableAnimation","toggleHandleBg","toggleHandleBoxShadowOld","toggleHandleLeft","toggleHandleTop","handleSmall","toggleHandleBorderRadiusSmall","handleMedium","toggleHandleBorderRadiusMedium","handleLarge","toggleHandleBorderRadiusLarge","handleDisabled","toggleDisabledHandleBg","input","toggleBgChecked","toggleBorderColorDisabledChecked","toggleBgDisabledChecked","toggleBorderColor","toggleCheckedBg","toggleCheckedBgHover","inputSmall","inputMedium","inputLarge","input2022","toggleContainerBg","toggleContainerBoxShadow","toggleHandleBoxShadow","toggleContainerBgChecked","toggleContainerBoxShadowChecked","toggleHandleBgChecked","toggleHandleBoxShadowChecked","toggleContainerBgHover","toggleContainerBoxShadowHover","toggleHandleBgHover","toggleHandleBoxShadowHover","toggleContainerBgCheckedHover","toggleContainerBoxShadowCheckedHover","toggleHandleBgCheckedHover","toggleHandleBoxShadowCheckedHover","toggleContainerBgDisabled","toggleContainerBoxShadowDisabled","toggleHandleBgDisabled","toggleHandleBoxShadowDisabled","toggleContainerBgDisabledChecked","toggleContainerBoxShadowDisabledChecked","toggleHandleBgDisabledChecked","toggleHandleBoxShadowDisabledChecked","containerSmall","toggleBorderRadiusSmall","containerMedium","toggleBorderRadiusMedium","containerLarge","toggleBorderRadiusLarge","toggleBgDisabled","toggleBorderColorDisabled","focused","toggleOutlineColorFocus","toggleOutlineWidth","toggleFocusShadowColor","activeBackground","disabledBackground","activeBackgroundLoading","toggleBgActive","isWarning","toggleShadowColorWarning","isError","toggleShadowColorError","button","toggleBaseBg","toggleHeight","buttonSmall","labGrotesqueBaselineCompensation","toggleButtonOffsetY","buttonMedium","buttonLarge","buttonRight","rootLeft","caption","toggleTextColor","toggleCaptionGap","captionSmall","captionMedium","captionLarge","disabledCaption","textColorDisabled","captionLeft"],"mappings":"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","sourcesContent":["import { css, memoizeStyle, prefix } from '../../lib/theming/Emotion';\nimport { Theme } from '../../lib/theming/Theme';\n\nimport {\n  activeHandleSizeMixin,\n  buttonSizeMixin,\n  captionSizeMixin,\n  containerSizeMixin,\n  handleMixin,\n  inputSizeMixin,\n  toggleSizeMixin,\n} from './Toggle.mixins';\n\nexport const globalClasses = prefix('toggle')({\n  handle: 'handle',\n  container: 'container',\n  disabled: 'disabled',\n  containerDisabled: 'container-disabled',\n  containerLoading: 'container-loading',\n  background: 'background',\n});\n\nexport const styles = memoizeStyle({\n  root(t: Theme) {\n    return css`\n      display: inline-flex;\n      cursor: pointer;\n      align-items: baseline;\n      position: relative;\n\n      &::before {\n        // non-breaking space.\n        // makes a correct space for absolutely positioned button,\n        // and also height and baseline for toggle without caption.\n        content: '\\\\00A0';\n        display: inline-block;\n        flex: 0 0 auto;\n      }\n\n      &:hover .${globalClasses.handle} {\n        background: ${t.toggleBgHover};\n      }\n    `;\n  },\n  rootSmall(t: Theme) {\n    return css`\n      ${toggleSizeMixin(t.toggleFontSizeSmall, t.toggleHeightSmall, t.toggleWidthSmall)};\n    `;\n  },\n  rootMedium(t: Theme) {\n    return css`\n      ${toggleSizeMixin(t.toggleFontSizeMedium, t.toggleHeightMedium, t.toggleWidthMedium)};\n    `;\n  },\n  rootLarge(t: Theme) {\n    return css`\n      ${toggleSizeMixin(t.toggleFontSizeLarge, t.toggleHeightLarge, t.toggleWidthLarge)};\n    `;\n  },\n\n  activeHandleSmall(t: Theme) {\n    return css`\n      ${activeHandleSizeMixin(\n        t.toggleHandleSizeSmall,\n        t.toggleBorderWidth,\n        t.toggleHandleActiveWidthIncrement,\n        t.toggleWidthSmall,\n      )};\n    `;\n  },\n  activeHandleMedium(t: Theme) {\n    return css`\n      ${activeHandleSizeMixin(\n        t.toggleHandleSizeMedium,\n        t.toggleBorderWidth,\n        t.toggleHandleActiveWidthIncrement,\n        t.toggleWidthMedium,\n      )};\n    `;\n  },\n  activeHandleLarge(t: Theme) {\n    return css`\n      ${activeHandleSizeMixin(\n        t.toggleHandleSizeLarge,\n        t.toggleBorderWidth,\n        t.toggleHandleActiveWidthIncrement,\n        t.toggleWidthLarge,\n      )};\n    `;\n  },\n\n  disableAnimation() {\n    return css`\n      &,\n      * {\n        transition: none !important;\n      }\n    `;\n  },\n\n  handle(t: Theme) {\n    return css`\n      background: ${t.toggleHandleBg};\n      bottom: ${t.toggleBorderWidth};\n      box-shadow: ${t.toggleHandleBoxShadowOld};\n      left: ${t.toggleHandleLeft};\n      position: absolute;\n      top: ${t.toggleHandleTop};\n      transition: 0.2s ease-in;\n    `;\n  },\n  handleSmall(t: Theme) {\n    return css`\n      ${handleMixin(t.toggleHandleSizeSmall, t.toggleHandleBorderRadiusSmall)};\n    `;\n  },\n  handleMedium(t: Theme) {\n    return css`\n      ${handleMixin(t.toggleHandleSizeMedium, t.toggleHandleBorderRadiusMedium)};\n    `;\n  },\n  handleLarge(t: Theme) {\n    return css`\n      ${handleMixin(t.toggleHandleSizeLarge, t.toggleHandleBorderRadiusLarge)};\n    `;\n  },\n\n  handleDisabled(t: Theme) {\n    return css`\n      background: ${t.toggleDisabledHandleBg} !important; // override root hover/active styles\n    `;\n  },\n\n  input(t: Theme) {\n    return css`\n      position: absolute;\n      opacity: 0;\n\n      &:focus {\n        outline: none;\n      }\n      &:checked ~ .${globalClasses.container} {\n        box-shadow: inset 0 0 0 ${t.toggleBorderWidth} ${t.toggleBgChecked};\n        background: ${t.toggleBgChecked};\n        transition: background 0s 0.2s;\n      }\n      &:checked ~ .${globalClasses.containerDisabled} {\n        box-shadow: inset 0 0 0 ${t.toggleBorderWidth} ${t.toggleBorderColorDisabledChecked};\n        background: ${t.toggleBgDisabledChecked};\n        transition: background 0s 0.2s;\n      }\n      &:checked ~ .${globalClasses.containerLoading} {\n        background: ${t.toggleBorderColor};\n        box-shadow: inset 0 0 0 ${t.toggleBorderWidth} ${t.toggleBorderColor};\n      }\n      &:checked ~ .${globalClasses.container} .${globalClasses.background} {\n        width: 70%;\n        background: ${t.toggleBgChecked};\n      }\n      &:checked ~ .${globalClasses.containerDisabled} .${globalClasses.background} {\n        width: 70%;\n        background: ${t.toggleBgDisabledChecked};\n        box-shadow: inset 0 0 0 1px ${t.toggleBorderColorDisabledChecked};\n      }\n      &:checked ~ .${globalClasses.handle} {\n        background: ${t.toggleCheckedBg};\n        &:hover {\n          background: ${t.toggleCheckedBgHover};\n        }\n      }\n    `;\n  },\n  inputSmall(t: Theme) {\n    return css`\n      ${inputSizeMixin(t.toggleHeightSmall, t.toggleWidthSmall)};\n    `;\n  },\n  inputMedium(t: Theme) {\n    return css`\n      ${inputSizeMixin(t.toggleHeightMedium, t.toggleWidthMedium)};\n    `;\n  },\n  inputLarge(t: Theme) {\n    return css`\n      ${inputSizeMixin(t.toggleHeightLarge, t.toggleWidthLarge)};\n    `;\n  },\n\n  input2022(t: Theme) {\n    return css`\n      &:enabled {\n        ~ .${globalClasses.container}, ~ .${globalClasses.handle} {\n          transition: 0.2s ease-in;\n        }\n        :not(:checked) {\n          ~ .${globalClasses.container} {\n            background: ${t.toggleContainerBg};\n            box-shadow: ${t.toggleContainerBoxShadow};\n          }\n          ~ .${globalClasses.handle} {\n            background: ${t.toggleHandleBg};\n            box-shadow: ${t.toggleHandleBoxShadow};\n          }\n        }\n        :checked {\n          ~ .${globalClasses.container} {\n            background: ${t.toggleContainerBgChecked};\n            box-shadow: ${t.toggleContainerBoxShadowChecked};\n          }\n          ~ .${globalClasses.handle} {\n            background: ${t.toggleHandleBgChecked};\n            box-shadow: ${t.toggleHandleBoxShadowChecked};\n          }\n        }\n      }\n      &:enabled:hover {\n        :not(:checked) {\n          ~ .${globalClasses.container} {\n            background: ${t.toggleContainerBgHover};\n            box-shadow: ${t.toggleContainerBoxShadowHover};\n          }\n          ~ .${globalClasses.handle} {\n            background: ${t.toggleHandleBgHover};\n            box-shadow: ${t.toggleHandleBoxShadowHover};\n          }\n        }\n        :checked {\n          ~ .${globalClasses.container} {\n            background: ${t.toggleContainerBgCheckedHover};\n            box-shadow: ${t.toggleContainerBoxShadowCheckedHover};\n          }\n          ~ .${globalClasses.handle} {\n            background: ${t.toggleHandleBgCheckedHover};\n            box-shadow: ${t.toggleHandleBoxShadowCheckedHover};\n          }\n        }\n      }\n      &:disabled {\n        :not(:checked) {\n          ~ .${globalClasses.container} {\n            background: ${t.toggleContainerBgDisabled};\n            box-shadow: ${t.toggleContainerBoxShadowDisabled};\n          }\n          ~ .${globalClasses.handle} {\n            background: ${t.toggleHandleBgDisabled} !important;\n            box-shadow: ${t.toggleHandleBoxShadowDisabled};\n          }\n        }\n        :checked {\n          ~ .${globalClasses.container} {\n            background: ${t.toggleContainerBgDisabledChecked};\n            box-shadow: ${t.toggleContainerBoxShadowDisabledChecked};\n          }\n          ~ .${globalClasses.handle} {\n            background: ${t.toggleHandleBgDisabledChecked} !important;\n            box-shadow: ${t.toggleHandleBoxShadowDisabledChecked};\n          }\n        }\n      }\n    `;\n  },\n\n  container(t: Theme) {\n    return css`\n      box-shadow: inset 0 0 0 ${t.toggleBorderWidth} ${t.toggleBorderColor};\n      height: 100%;\n      overflow: hidden;\n      position: absolute;\n      width: 100%;\n      /* fixes overflow issue in Safari: https://bugs.webkit.org/show_bug.cgi?id=98538 */\n      z-index: 0;\n    `;\n  },\n  containerSmall(t: Theme) {\n    return css`\n      ${containerSizeMixin(t.toggleBorderRadiusSmall)};\n    `;\n  },\n  containerMedium(t: Theme) {\n    return css`\n      ${containerSizeMixin(t.toggleBorderRadiusMedium)};\n    `;\n  },\n  containerLarge(t: Theme) {\n    return css`\n      ${containerSizeMixin(t.toggleBorderRadiusLarge)};\n    `;\n  },\n\n  containerDisabled(t: Theme) {\n    return css`\n      background: ${t.toggleBgDisabled};\n      box-shadow: inset 0 0 0 1px ${t.toggleBorderColorDisabled};\n    `;\n  },\n\n  focused(t: Theme) {\n    return css`\n      box-shadow: 0 0 0 1px ${t.toggleOutlineColorFocus}, 0 0 0 ${t.toggleOutlineWidth} ${t.toggleFocusShadowColor};\n    `;\n  },\n\n  activeBackground() {\n    return css`\n      background: inherit;\n      bottom: 0;\n      left: 0;\n      position: absolute;\n      top: 0;\n      transition: 0.2s ease-in;\n      width: 10px;\n    `;\n  },\n\n  disabledBackground(t: Theme) {\n    return css`\n      box-shadow: inset 0 0 0 1px ${t.toggleBorderColorDisabled};\n      width: 0;\n    `;\n  },\n\n  activeBackgroundLoading(t: Theme) {\n    return css`\n      background: ${t.toggleBgActive};\n    `;\n  },\n\n  isWarning(t: Theme) {\n    return css`\n      box-shadow: 0 0 0 1px ${t.toggleOutlineColorFocus}, 0 0 0 ${t.toggleOutlineWidth} ${t.toggleShadowColorWarning};\n    `;\n  },\n\n  isError(t: Theme) {\n    return css`\n      box-shadow: 0 0 0 1px ${t.toggleOutlineColorFocus}, 0 0 0 ${t.toggleOutlineWidth} ${t.toggleShadowColorError};\n    `;\n  },\n\n  button(t: Theme) {\n    return css`\n      position: absolute;\n      left: 0;\n      top: 0;\n      background: ${t.toggleBaseBg};\n      line-height: ${t.toggleHeight};\n    `;\n  },\n  buttonSmall(t: Theme) {\n    return css`\n      ${buttonSizeMixin(\n        t.labGrotesqueBaselineCompensation,\n        t.toggleFontSizeSmall,\n        t.toggleHeightSmall,\n        t.toggleWidthSmall,\n        t.toggleBorderRadiusSmall,\n        t.toggleButtonOffsetY,\n      )};\n    `;\n  },\n  buttonMedium(t: Theme) {\n    return css`\n      ${buttonSizeMixin(\n        t.labGrotesqueBaselineCompensation,\n        t.toggleFontSizeMedium,\n        t.toggleHeightMedium,\n        t.toggleWidthMedium,\n        t.toggleBorderRadiusMedium,\n        t.toggleButtonOffsetY,\n      )};\n    `;\n  },\n  buttonLarge(t: Theme) {\n    return css`\n      ${buttonSizeMixin(\n        t.labGrotesqueBaselineCompensation,\n        t.toggleFontSizeLarge,\n        t.toggleHeightLarge,\n        t.toggleWidthLarge,\n        t.toggleBorderRadiusLarge,\n        t.toggleButtonOffsetY,\n      )};\n    `;\n  },\n\n  buttonRight() {\n    return css`\n      right: 0;\n      left: auto;\n    `;\n  },\n\n  disabled() {\n    return css`\n      cursor: default;\n    `;\n  },\n\n  rootLeft() {\n    return css`\n      flex-direction: row-reverse;\n    `;\n  },\n\n  caption(t: Theme) {\n    return css`\n      color: ${t.toggleTextColor};\n      padding: 0 0 0 ${t.toggleCaptionGap};\n    `;\n  },\n  captionSmall(t: Theme) {\n    return css`\n      ${captionSizeMixin(t.toggleFontSizeSmall, t.toggleHeightSmall)};\n    `;\n  },\n  captionMedium(t: Theme) {\n    return css`\n      ${captionSizeMixin(t.toggleFontSizeMedium, t.toggleHeightMedium)};\n    `;\n  },\n  captionLarge(t: Theme) {\n    return css`\n      ${captionSizeMixin(t.toggleFontSizeLarge, t.toggleHeightLarge)};\n    `;\n  },\n\n  disabledCaption(t: Theme) {\n    return css`\n      color: ${t.textColorDisabled};\n    `;\n  },\n\n  captionLeft(t: Theme) {\n    return css`\n      color: ${t.toggleTextColor};\n      padding: 0 ${t.toggleCaptionGap} 0 0;\n    `;\n  },\n});\n"]}

package/cjs/components/Toggle/index.d.ts

@@ -0,0 +1 @@
+export * from './Toggle';

package/cjs/components/Toggle/index.js

@@ -0,0 +1 @@
+"use strict";exports.__esModule = true;var _Toggle = require("./Toggle");Object.keys(_Toggle).forEach(function (key) {if (key === "default" || key === "__esModule") return;if (key in exports && exports[key] === _Toggle[key]) return;exports[key] = _Toggle[key];});

package/cjs/components/Toggle/index.js.map

@@ -0,0 +1 @@
+{"version":3,"sources":["index.tsx"],"names":[],"mappings":"uCAAA","sourcesContent":["export * from './Toggle';\n"]}

package/cjs/components/Token/Token.d.ts

@@ -0,0 +1,48 @@
+import React, { AriaAttributes } from 'react';
+import { CommonProps } from '../../internal/CommonWrapper';
+import { SizeProp } from '../../lib/types/props';
+import { colorStyles } from './Token.styles';
+export declare type TokenColorName = keyof typeof colorStyles;
+export interface TokenColors {
+    idle: TokenColorName;
+    active?: TokenColorName;
+}
+export declare type TokenSize = SizeProp;
+export interface TokenProps extends Pick<AriaAttributes, 'aria-describedby'>, CommonProps {
+    colors?: TokenColors;
+    isActive?: boolean;
+    /**
+     * Состояние валидации при ошибке.
+     */
+    error?: boolean;
+    /**
+     * Состояние валидации при предупреждении.
+     */
+    warning?: boolean;
+    disabled?: boolean;
+    /**
+     * Размер
+     */
+    size?: TokenSize;
+    onClick?: React.MouseEventHandler<HTMLDivElement>;
+    onDoubleClick?: React.MouseEventHandler<HTMLDivElement>;
+    onRemove?: React.MouseEventHandler<HTMLElement>;
+    onMouseEnter?: React.MouseEventHandler<HTMLDivElement>;
+    onMouseLeave?: React.MouseEventHandler<HTMLDivElement>;
+    onFocus?: React.FocusEventHandler<HTMLDivElement>;
+    onBlur?: React.FocusEventHandler<HTMLDivElement>;
+}
+export declare const TokenDataTids: {
+    readonly root: "Token__root";
+    readonly removeIcon: "Token__removeIcon";
+};
+export declare class Token extends React.Component<TokenProps> {
+    static __KONTUR_REACT_UI__: string;
+    static displayName: string;
+    private theme;
+    private setRootNode;
+    private readonly locale;
+    render(): JSX.Element;
+    private renderMain;
+    private onRemoveClick;
+}