@skbkontur/react-ui 0.0.0-aaf2aabecb → 0.0.0-bb4cbfe9c6

package/internal/ThemePlayground/Playground.styles/Playground.styles.js

@@ -1,240 +1,67 @@
 import _taggedTemplateLiteralLoose from "@babel/runtime/helpers/esm/taggedTemplateLiteralLoose";
 
-function _templateObject18() {
-  var data = _taggedTemplateLiteralLoose(["\n      color: ", ";\n    "]);
+var _templateObject, _templateObject2, _templateObject3, _templateObject4, _templateObject5, _templateObject6, _templateObject7, _templateObject8, _templateObject9, _templateObject10, _templateObject11, _templateObject12, _templateObject13, _templateObject14, _templateObject15, _templateObject16, _templateObject17, _templateObject18, _templateObject19, _templateObject20;
 
-  _templateObject18 = function _templateObject18() {
-    return data;
-  };
-
-  return data;
-}
-
-function _templateObject17() {
-  var data = _taggedTemplateLiteralLoose(["\n      color: ", ";\n    "]);
-
-  _templateObject17 = function _templateObject17() {
-    return data;
-  };
-
-  return data;
-}
-
-function _templateObject16() {
-  var data = _taggedTemplateLiteralLoose(["\n      background: ", ";\n    "]);
-
-  _templateObject16 = function _templateObject16() {
-    return data;
-  };
-
-  return data;
-}
-
-function _templateObject15() {
-  var data = _taggedTemplateLiteralLoose(["\n      color: ", ";\n    "]);
-
-  _templateObject15 = function _templateObject15() {
-    return data;
-  };
-
-  return data;
-}
-
-function _templateObject14() {
-  var data = _taggedTemplateLiteralLoose(["\n      &:after {\n        box-shadow: 0 2px 10px 0px ", ";\n      }\n    "]);
-
-  _templateObject14 = function _templateObject14() {
-    return data;
-  };
-
-  return data;
-}
-
-function _templateObject13() {
-  var data = _taggedTemplateLiteralLoose(["\n      width: 210px;\n    "]);
-
-  _templateObject13 = function _templateObject13() {
-    return data;
-  };
-
-  return data;
-}
-
-function _templateObject12() {
-  var data = _taggedTemplateLiteralLoose(["\n      margin: 0 -32px;\n      padding: 11px 32px;\n      position: relative;\n\n      &::after {\n        content: '';\n        position: absolute;\n        bottom: 0;\n        left: 0;\n        height: 1px;\n        width: 100%;\n        z-index: -1;\n      }\n    "]);
-
-  _templateObject12 = function _templateObject12() {
-    return data;
-  };
-
-  return data;
-}
-
-function _templateObject11() {
-  var data = _taggedTemplateLiteralLoose(["\n      height: 300px;\n      margin: auto;\n    "]);
-
-  _templateObject11 = function _templateObject11() {
-    return data;
-  };
-
-  return data;
-}
-
-function _templateObject10() {
-  var data = _taggedTemplateLiteralLoose(["\n      width: 500px;\n    "]);
-
-  _templateObject10 = function _templateObject10() {
-    return data;
-  };
-
-  return data;
-}
-
-function _templateObject9() {
-  var data = _taggedTemplateLiteralLoose(["\n      position: relative;\n      z-index: 1;\n      padding-left: 10px;\n      width: 240px;\n      display: flex;\n    "]);
-
-  _templateObject9 = function _templateObject9() {
-    return data;
-  };
-
-  return data;
-}
-
-function _templateObject8() {
-  var data = _taggedTemplateLiteralLoose(["\n      position: relative;\n      z-index: 1;\n    "]);
-
-  _templateObject8 = function _templateObject8() {
-    return data;
-  };
-
-  return data;
-}
-
-function _templateObject7() {
-  var data = _taggedTemplateLiteralLoose(["\n      margin-left: auto;\n    "]);
-
-  _templateObject7 = function _templateObject7() {
-    return data;
-  };
-
-  return data;
-}
-
-function _templateObject6() {
-  var data = _taggedTemplateLiteralLoose(["\n      height: 16px;\n      width: 16px;\n    "]);
-
-  _templateObject6 = function _templateObject6() {
-    return data;
-  };
-
-  return data;
-}
-
-function _templateObject5() {
-  var data = _taggedTemplateLiteralLoose(["\n      margin-bottom: 5px;\n      white-space: nowrap;\n      overflow: hidden;\n      text-overflow: ellipsis;\n      width: 250px;\n      position: relative;\n      z-index: 1;\n      line-height: 34px;\n      color: ", ";\n    "]);
-
-  _templateObject5 = function _templateObject5() {
-    return data;
-  };
-
-  return data;
-}
-
-function _templateObject4() {
-  var data = _taggedTemplateLiteralLoose(["\n      padding-left: 30px;\n      padding-bottom: 30px;\n    "]);
-
-  _templateObject4 = function _templateObject4() {
-    return data;
-  };
-
-  return data;
-}
-
-function _templateObject3() {
-  var data = _taggedTemplateLiteralLoose(["\n      max-width: 700px;\n      color: ", ";\n    "]);
-
-  _templateObject3 = function _templateObject3() {
-    return data;
-  };
-
-  return data;
-}
-
-function _templateObject2() {
-  var data = _taggedTemplateLiteralLoose(["\n      width: 110px;\n      color: ", ";\n    "]);
-
-  _templateObject2 = function _templateObject2() {
-    return data;
-  };
-
-  return data;
-}
-
-function _templateObject() {
-  var data = _taggedTemplateLiteralLoose(["\n      margin: -16px;\n      padding: 32px;\n    "]);
-
-  _templateObject = function _templateObject() {
-    return data;
-  };
-
-  return data;
-}
-
-import { css, memoizeStyle } from "..\\..\\..\\lib\\theming\\Emotion";
-var styles = {
+import { css, memoizeStyle } from "../../../lib/theming/Emotion";
+export var styles = memoizeStyle({
   playground: function playground() {
-    return css(_templateObject());
+    return css(_templateObject || (_templateObject = _taggedTemplateLiteralLoose(["\n      margin: -16px;\n      padding: 32px;\n    "])));
   },
   title: function title(t) {
-    return css(_templateObject2(), t.textColorDefault);
+    return css(_templateObject2 || (_templateObject2 = _taggedTemplateLiteralLoose(["\n      width: 110px;\n      color: ", ";\n    "])), t.textColorDefault);
   },
   componentsGroup: function componentsGroup(t) {
-    return css(_templateObject3(), t.textColorDefault);
+    return css(_templateObject3 || (_templateObject3 = _taggedTemplateLiteralLoose(["\n      max-width: 700px;\n      color: ", ";\n    "])), t.textColorDefault);
   },
   sidePageBody: function sidePageBody() {
-    return css(_templateObject4());
+    return css(_templateObject4 || (_templateObject4 = _taggedTemplateLiteralLoose(["\n      padding: 0 30px 30px;\n    "])));
+  },
+  variable: function variable(t) {
+    return css(_templateObject5 || (_templateObject5 = _taggedTemplateLiteralLoose(["\n      display: flex;\n      align-items: center;\n      margin-bottom: 16px;\n\n      &:focus {\n        outline: 1px solid ", ";\n        outline-offset: 8px;\n      }\n    "])), t.borderColorFocus);
   },
   variableName: function variableName(t) {
-    return css(_templateObject5(), t.textColorDefault);
+    return css(_templateObject6 || (_templateObject6 = _taggedTemplateLiteralLoose(["\n      white-space: nowrap;\n      overflow: hidden;\n      text-overflow: ellipsis;\n      width: 250px;\n      position: relative;\n      z-index: 1;\n      line-height: 34px;\n      color: ", ";\n      flex: 1 1 auto;\n    "])), t.textColorDefault);
+  },
+  deprecated: function deprecated() {
+    return css(_templateObject7 || (_templateObject7 = _taggedTemplateLiteralLoose(["\n      text-decoration: line-through;\n    "])));
   },
   colorIcon: function colorIcon() {
-    return css(_templateObject6());
+    return css(_templateObject8 || (_templateObject8 = _taggedTemplateLiteralLoose(["\n      height: 16px;\n      width: 16px;\n    "])));
   },
   baseLinkWrapper: function baseLinkWrapper() {
-    return css(_templateObject7());
+    return css(_templateObject9 || (_templateObject9 = _taggedTemplateLiteralLoose(["\n      margin-left: auto;\n    "])));
   },
   linkRoot: function linkRoot() {
-    return css(_templateObject8());
+    return css(_templateObject10 || (_templateObject10 = _taggedTemplateLiteralLoose(["\n      position: relative;\n      z-index: 1;\n    "])));
   },
   baseVariableRoot: function baseVariableRoot() {
-    return css(_templateObject9());
+    return css(_templateObject11 || (_templateObject11 = _taggedTemplateLiteralLoose(["\n      position: relative;\n      z-index: 1;\n      padding-left: 10px;\n      width: 240px;\n      display: flex;\n    "])));
   },
   loaderWrapper: function loaderWrapper() {
-    return css(_templateObject10());
+    return css(_templateObject12 || (_templateObject12 = _taggedTemplateLiteralLoose(["\n      width: 500px;\n    "])));
   },
   loader: function loader() {
-    return css(_templateObject11());
+    return css(_templateObject13 || (_templateObject13 = _taggedTemplateLiteralLoose(["\n      height: 300px;\n      margin: auto;\n    "])));
   },
-  tabsWrapper: function tabsWrapper() {
-    return css(_templateObject12());
+  tabsWrapper: function tabsWrapper(t) {
+    return css(_templateObject14 || (_templateObject14 = _taggedTemplateLiteralLoose(["\n      margin: 0 -32px;\n      padding: 11px 32px;\n      position: relative;\n      color: ", ";\n\n      &::after {\n        content: '';\n        position: absolute;\n        bottom: 0;\n        left: 0;\n        height: 1px;\n        width: 100%;\n        z-index: -1;\n      }\n    "])), t.textColorDefault);
   },
   tooltipContent: function tooltipContent() {
-    return css(_templateObject13());
+    return css(_templateObject15 || (_templateObject15 = _taggedTemplateLiteralLoose(["\n      width: 210px;\n    "])));
   },
   stickyTabsWrapper: function stickyTabsWrapper(t) {
-    return css(_templateObject14(), t.textColorDefault);
+    return css(_templateObject16 || (_templateObject16 = _taggedTemplateLiteralLoose(["\n      &:after {\n        box-shadow: 0 2px 10px 0px ", ";\n      }\n    "])), t.textColorDefault);
   },
   tabsInnerWrapper: function tabsInnerWrapper(t) {
-    return css(_templateObject15(), t.textColorDefault);
+    return css(_templateObject17 || (_templateObject17 = _taggedTemplateLiteralLoose(["\n      color: ", ";\n    "])), t.textColorDefault);
   },
   playgroundWrapper: function playgroundWrapper(t) {
-    return css(_templateObject16(), t.bgDefault);
+    return css(_templateObject18 || (_templateObject18 = _taggedTemplateLiteralLoose(["\n      background: ", ";\n    "])), t.bgDefault);
   },
   editorHeaderWrapper: function editorHeaderWrapper(t) {
-    return css(_templateObject17(), t.textColorDefault);
+    return css(_templateObject19 || (_templateObject19 = _taggedTemplateLiteralLoose(["\n      color: ", ";\n    "])), t.textColorDefault);
   },
   editorGroupHeader: function editorGroupHeader(t) {
-    return css(_templateObject18(), t.textColorDefault);
+    return css(_templateObject20 || (_templateObject20 = _taggedTemplateLiteralLoose(["\n      color: ", ";\n    "])), t.textColorDefault);
   }
-};
-export var jsStyles = memoizeStyle(styles);
+});

package/internal/ThemePlayground/Playground.styles/Playground.styles.js.map

@@ -1 +1 @@
-{"version":3,"sources":["Playground.styles.ts"],"names":["css","memoizeStyle","styles","playground","title","t","textColorDefault","componentsGroup","sidePageBody","variableName","colorIcon","baseLinkWrapper","linkRoot","baseVariableRoot","loaderWrapper","loader","tabsWrapper","tooltipContent","stickyTabsWrapper","tabsInnerWrapper","playgroundWrapper","bgDefault","editorHeaderWrapper","editorGroupHeader","jsStyles"],"mappings":"k9HAAA,SAASA,GAAT,EAAcC,YAAd,QAAkC,2BAAlC;;;AAGA,IAAMC,MAAM,GAAG;AACbC,EAAAA,UADa,wBACA;AACX,WAAOH,GAAP;;;;AAID,GANY;;AAQbI,EAAAA,KARa,iBAQPC,CARO,EAQG;AACd,WAAOL,GAAP;;AAEWK,IAAAA,CAAC,CAACC,gBAFb;;AAID,GAbY;;AAebC,EAAAA,eAfa,2BAeGF,CAfH,EAea;AACxB,WAAOL,GAAP;;AAEWK,IAAAA,CAAC,CAACC,gBAFb;;AAID,GApBY;;AAsBbE,EAAAA,YAtBa,0BAsBE;AACb,WAAOR,GAAP;;;;AAID,GA3BY;;AA6BbS,EAAAA,YA7Ba,wBA6BAJ,CA7BA,EA6BU;AACrB,WAAOL,GAAP;;;;;;;;;AASWK,IAAAA,CAAC,CAACC,gBATb;;AAWD,GAzCY;;AA2CbI,EAAAA,SA3Ca,uBA2CD;AACV,WAAOV,GAAP;;;;AAID,GAhDY;;AAkDbW,EAAAA,eAlDa,6BAkDK;AAChB,WAAOX,GAAP;;;AAGD,GAtDY;;AAwDbY,EAAAA,QAxDa,sBAwDF;AACT,WAAOZ,GAAP;;;;AAID,GA7DY;;AA+Dba,EAAAA,gBA/Da,8BA+DM;AACjB,WAAOb,GAAP;;;;;;;AAOD,GAvEY;;AAyEbc,EAAAA,aAzEa,2BAyEG;AACd,WAAOd,GAAP;;;AAGD,GA7EY;;AA+Ebe,EAAAA,MA/Ea,oBA+EJ;AACP,WAAOf,GAAP;;;;AAID,GApFY;;AAsFbgB,EAAAA,WAtFa,yBAsFC;AACZ,WAAOhB,GAAP;;;;;;;;;;;;;;;AAeD,GAtGY;;AAwGbiB,EAAAA,cAxGa,4BAwGI;AACf,WAAOjB,GAAP;;;AAGD,GA5GY;;AA8GbkB,EAAAA,iBA9Ga,6BA8GKb,CA9GL,EA8Ge;AAC1B,WAAOL,GAAP;;AAEiCK,IAAAA,CAAC,CAACC,gBAFnC;;;AAKD,GApHY;AAqHba,EAAAA,gBArHa,4BAqHId,CArHJ,EAqHc;AACzB,WAAOL,GAAP;AACWK,IAAAA,CAAC,CAACC,gBADb;;AAGD,GAzHY;AA0Hbc,EAAAA,iBA1Ha,6BA0HKf,CA1HL,EA0He;AAC1B,WAAOL,GAAP;AACgBK,IAAAA,CAAC,CAACgB,SADlB;;AAGD,GA9HY;AA+HbC,EAAAA,mBA/Ha,+BA+HOjB,CA/HP,EA+HiB;AAC5B,WAAOL,GAAP;AACWK,IAAAA,CAAC,CAACC,gBADb;;AAGD,GAnIY;AAoIbiB,EAAAA,iBApIa,6BAoIKlB,CApIL,EAoIe;AAC1B,WAAOL,GAAP;AACWK,IAAAA,CAAC,CAACC,gBADb;;AAGD,GAxIY,EAAf;;;AA2IA,OAAO,IAAMkB,QAAQ,GAAGvB,YAAY,CAACC,MAAD,CAA7B","sourcesContent":["import { css, memoizeStyle } from '../../lib/theming/Emotion';\r\nimport { Theme } from '../../lib/theming/Theme';\r\n\r\nconst styles = {\r\n  playground() {\r\n    return css`\r\n      margin: -16px;\r\n      padding: 32px;\r\n    `;\r\n  },\r\n\r\n  title(t: Theme) {\r\n    return css`\r\n      width: 110px;\r\n      color: ${t.textColorDefault};\r\n    `;\r\n  },\r\n\r\n  componentsGroup(t: Theme) {\r\n    return css`\r\n      max-width: 700px;\r\n      color: ${t.textColorDefault};\r\n    `;\r\n  },\r\n\r\n  sidePageBody() {\r\n    return css`\r\n      padding-left: 30px;\r\n      padding-bottom: 30px;\r\n    `;\r\n  },\r\n\r\n  variableName(t: Theme) {\r\n    return css`\r\n      margin-bottom: 5px;\r\n      white-space: nowrap;\r\n      overflow: hidden;\r\n      text-overflow: ellipsis;\r\n      width: 250px;\r\n      position: relative;\r\n      z-index: 1;\r\n      line-height: 34px;\r\n      color: ${t.textColorDefault};\r\n    `;\r\n  },\r\n\r\n  colorIcon() {\r\n    return css`\r\n      height: 16px;\r\n      width: 16px;\r\n    `;\r\n  },\r\n\r\n  baseLinkWrapper() {\r\n    return css`\r\n      margin-left: auto;\r\n    `;\r\n  },\r\n\r\n  linkRoot() {\r\n    return css`\r\n      position: relative;\r\n      z-index: 1;\r\n    `;\r\n  },\r\n\r\n  baseVariableRoot() {\r\n    return css`\r\n      position: relative;\r\n      z-index: 1;\r\n      padding-left: 10px;\r\n      width: 240px;\r\n      display: flex;\r\n    `;\r\n  },\r\n\r\n  loaderWrapper() {\r\n    return css`\r\n      width: 500px;\r\n    `;\r\n  },\r\n\r\n  loader() {\r\n    return css`\r\n      height: 300px;\r\n      margin: auto;\r\n    `;\r\n  },\r\n\r\n  tabsWrapper() {\r\n    return css`\r\n      margin: 0 -32px;\r\n      padding: 11px 32px;\r\n      position: relative;\r\n\r\n      &::after {\r\n        content: '';\r\n        position: absolute;\r\n        bottom: 0;\r\n        left: 0;\r\n        height: 1px;\r\n        width: 100%;\r\n        z-index: -1;\r\n      }\r\n    `;\r\n  },\r\n\r\n  tooltipContent() {\r\n    return css`\r\n      width: 210px;\r\n    `;\r\n  },\r\n\r\n  stickyTabsWrapper(t: Theme) {\r\n    return css`\r\n      &:after {\r\n        box-shadow: 0 2px 10px 0px ${t.textColorDefault};\r\n      }\r\n    `;\r\n  },\r\n  tabsInnerWrapper(t: Theme) {\r\n    return css`\r\n      color: ${t.textColorDefault};\r\n    `;\r\n  },\r\n  playgroundWrapper(t: Theme) {\r\n    return css`\r\n      background: ${t.bgDefault};\r\n    `;\r\n  },\r\n  editorHeaderWrapper(t: Theme) {\r\n    return css`\r\n      color: ${t.textColorDefault};\r\n    `;\r\n  },\r\n  editorGroupHeader(t: Theme) {\r\n    return css`\r\n      color: ${t.textColorDefault};\r\n    `;\r\n  },\r\n};\r\n\r\nexport const jsStyles = memoizeStyle(styles);\r\n"]}
+{"version":3,"sources":["Playground.styles.ts"],"names":["css","memoizeStyle","styles","playground","title","t","textColorDefault","componentsGroup","sidePageBody","variable","borderColorFocus","variableName","deprecated","colorIcon","baseLinkWrapper","linkRoot","baseVariableRoot","loaderWrapper","loader","tabsWrapper","tooltipContent","stickyTabsWrapper","tabsInnerWrapper","playgroundWrapper","bgDefault","editorHeaderWrapper","editorGroupHeader"],"mappings":"qdAAA,SAASA,GAAT,EAAcC,YAAd,QAAkC,2BAAlC;;;AAGA,OAAO,IAAMC,MAAM,GAAGD,YAAY,CAAC;AACjCE,EAAAA,UADiC,wBACpB;AACX,WAAOH,GAAP;;;;AAID,GANgC;;AAQjCI,EAAAA,KARiC,iBAQ3BC,CAR2B,EAQjB;AACd,WAAOL,GAAP;;AAEWK,IAAAA,CAAC,CAACC,gBAFb;;AAID,GAbgC;;AAejCC,EAAAA,eAfiC,2BAejBF,CAfiB,EAeP;AACxB,WAAOL,GAAP;;AAEWK,IAAAA,CAAC,CAACC,gBAFb;;AAID,GApBgC;;AAsBjCE,EAAAA,YAtBiC,0BAsBlB;AACb,WAAOR,GAAP;;;AAGD,GA1BgC;;AA4BjCS,EAAAA,QA5BiC,oBA4BxBJ,CA5BwB,EA4Bd;AACjB,WAAOL,GAAP;;;;;;AAMyBK,IAAAA,CAAC,CAACK,gBAN3B;;;;AAUD,GAvCgC;;AAyCjCC,EAAAA,YAzCiC,wBAyCpBN,CAzCoB,EAyCV;AACrB,WAAOL,GAAP;;;;;;;;AAQWK,IAAAA,CAAC,CAACC,gBARb;;;AAWD,GArDgC;;AAuDjCM,EAAAA,UAvDiC,wBAuDpB;AACX,WAAOZ,GAAP;;;AAGD,GA3DgC;;AA6DjCa,EAAAA,SA7DiC,uBA6DrB;AACV,WAAOb,GAAP;;;;AAID,GAlEgC;;AAoEjCc,EAAAA,eApEiC,6BAoEf;AAChB,WAAOd,GAAP;;;AAGD,GAxEgC;;AA0EjCe,EAAAA,QA1EiC,sBA0EtB;AACT,WAAOf,GAAP;;;;AAID,GA/EgC;;AAiFjCgB,EAAAA,gBAjFiC,8BAiFd;AACjB,WAAOhB,GAAP;;;;;;;AAOD,GAzFgC;;AA2FjCiB,EAAAA,aA3FiC,2BA2FjB;AACd,WAAOjB,GAAP;;;AAGD,GA/FgC;;AAiGjCkB,EAAAA,MAjGiC,oBAiGxB;AACP,WAAOlB,GAAP;;;;AAID,GAtGgC;;AAwGjCmB,EAAAA,WAxGiC,uBAwGrBd,CAxGqB,EAwGX;AACpB,WAAOL,GAAP;;;;AAIWK,IAAAA,CAAC,CAACC,gBAJb;;;;;;;;;;;;AAgBD,GAzHgC;;AA2HjCc,EAAAA,cA3HiC,4BA2HhB;AACf,WAAOpB,GAAP;;;AAGD,GA/HgC;;AAiIjCqB,EAAAA,iBAjIiC,6BAiIfhB,CAjIe,EAiIL;AAC1B,WAAOL,GAAP;;AAEiCK,IAAAA,CAAC,CAACC,gBAFnC;;;AAKD,GAvIgC;AAwIjCgB,EAAAA,gBAxIiC,4BAwIhBjB,CAxIgB,EAwIN;AACzB,WAAOL,GAAP;AACWK,IAAAA,CAAC,CAACC,gBADb;;AAGD,GA5IgC;AA6IjCiB,EAAAA,iBA7IiC,6BA6IflB,CA7Ie,EA6IL;AAC1B,WAAOL,GAAP;AACgBK,IAAAA,CAAC,CAACmB,SADlB;;AAGD,GAjJgC;AAkJjCC,EAAAA,mBAlJiC,+BAkJbpB,CAlJa,EAkJH;AAC5B,WAAOL,GAAP;AACWK,IAAAA,CAAC,CAACC,gBADb;;AAGD,GAtJgC;AAuJjCoB,EAAAA,iBAvJiC,6BAuJfrB,CAvJe,EAuJL;AAC1B,WAAOL,GAAP;AACWK,IAAAA,CAAC,CAACC,gBADb;;AAGD,GA3JgC,EAAD,CAA3B","sourcesContent":["import { css, memoizeStyle } from '../../lib/theming/Emotion';\nimport { Theme } from '../../lib/theming/Theme';\n\nexport const styles = memoizeStyle({\n  playground() {\n    return css`\n      margin: -16px;\n      padding: 32px;\n    `;\n  },\n\n  title(t: Theme) {\n    return css`\n      width: 110px;\n      color: ${t.textColorDefault};\n    `;\n  },\n\n  componentsGroup(t: Theme) {\n    return css`\n      max-width: 700px;\n      color: ${t.textColorDefault};\n    `;\n  },\n\n  sidePageBody() {\n    return css`\n      padding: 0 30px 30px;\n    `;\n  },\n\n  variable(t: Theme) {\n    return css`\n      display: flex;\n      align-items: center;\n      margin-bottom: 16px;\n\n      &:focus {\n        outline: 1px solid ${t.borderColorFocus};\n        outline-offset: 8px;\n      }\n    `;\n  },\n\n  variableName(t: Theme) {\n    return css`\n      white-space: nowrap;\n      overflow: hidden;\n      text-overflow: ellipsis;\n      width: 250px;\n      position: relative;\n      z-index: 1;\n      line-height: 34px;\n      color: ${t.textColorDefault};\n      flex: 1 1 auto;\n    `;\n  },\n\n  deprecated() {\n    return css`\n      text-decoration: line-through;\n    `;\n  },\n\n  colorIcon() {\n    return css`\n      height: 16px;\n      width: 16px;\n    `;\n  },\n\n  baseLinkWrapper() {\n    return css`\n      margin-left: auto;\n    `;\n  },\n\n  linkRoot() {\n    return css`\n      position: relative;\n      z-index: 1;\n    `;\n  },\n\n  baseVariableRoot() {\n    return css`\n      position: relative;\n      z-index: 1;\n      padding-left: 10px;\n      width: 240px;\n      display: flex;\n    `;\n  },\n\n  loaderWrapper() {\n    return css`\n      width: 500px;\n    `;\n  },\n\n  loader() {\n    return css`\n      height: 300px;\n      margin: auto;\n    `;\n  },\n\n  tabsWrapper(t: Theme) {\n    return css`\n      margin: 0 -32px;\n      padding: 11px 32px;\n      position: relative;\n      color: ${t.textColorDefault};\n\n      &::after {\n        content: '';\n        position: absolute;\n        bottom: 0;\n        left: 0;\n        height: 1px;\n        width: 100%;\n        z-index: -1;\n      }\n    `;\n  },\n\n  tooltipContent() {\n    return css`\n      width: 210px;\n    `;\n  },\n\n  stickyTabsWrapper(t: Theme) {\n    return css`\n      &:after {\n        box-shadow: 0 2px 10px 0px ${t.textColorDefault};\n      }\n    `;\n  },\n  tabsInnerWrapper(t: Theme) {\n    return css`\n      color: ${t.textColorDefault};\n    `;\n  },\n  playgroundWrapper(t: Theme) {\n    return css`\n      background: ${t.bgDefault};\n    `;\n  },\n  editorHeaderWrapper(t: Theme) {\n    return css`\n      color: ${t.textColorDefault};\n    `;\n  },\n  editorGroupHeader(t: Theme) {\n    return css`\n      color: ${t.textColorDefault};\n    `;\n  },\n});\n"]}

package/internal/ThemePlayground/Playground.styles/package.json

@@ -1,6 +1,6 @@
 {
-  "main": "..\\..\\..\\cjs\\internal\\ThemePlayground\\Playground.styles.js",
+  "main": "../../../cjs/internal/ThemePlayground/Playground.styles.js",
   "module": "Playground.styles",
-  "types": "..\\Playground.styles.d.ts",
+  "types": "../Playground.styles.d.ts",
   "sideEffects": false
 }

package/internal/ThemePlayground/Playground.styles.d.ts

@@ -1,20 +1,23 @@
-export declare const jsStyles: {
+import { Theme } from '../../lib/theming/Theme';
+export declare const styles: {
     playground(): string;
-    title(t: Readonly<typeof import("../themes/DefaultTheme").DefaultTheme> | Readonly<typeof import("../themes/FlatTheme").FlatTheme>): string;
-    componentsGroup(t: Readonly<typeof import("../themes/DefaultTheme").DefaultTheme> | Readonly<typeof import("../themes/FlatTheme").FlatTheme>): string;
+    title(t: Theme): string;
+    componentsGroup(t: Theme): string;
     sidePageBody(): string;
-    variableName(t: Readonly<typeof import("../themes/DefaultTheme").DefaultTheme> | Readonly<typeof import("../themes/FlatTheme").FlatTheme>): string;
+    variable(t: Theme): string;
+    variableName(t: Theme): string;
+    deprecated(): string;
     colorIcon(): string;
     baseLinkWrapper(): string;
     linkRoot(): string;
     baseVariableRoot(): string;
     loaderWrapper(): string;
     loader(): string;
-    tabsWrapper(): string;
+    tabsWrapper(t: Theme): string;
     tooltipContent(): string;
-    stickyTabsWrapper(t: Readonly<typeof import("../themes/DefaultTheme").DefaultTheme> | Readonly<typeof import("../themes/FlatTheme").FlatTheme>): string;
-    tabsInnerWrapper(t: Readonly<typeof import("../themes/DefaultTheme").DefaultTheme> | Readonly<typeof import("../themes/FlatTheme").FlatTheme>): string;
-    playgroundWrapper(t: Readonly<typeof import("../themes/DefaultTheme").DefaultTheme> | Readonly<typeof import("../themes/FlatTheme").FlatTheme>): string;
-    editorHeaderWrapper(t: Readonly<typeof import("../themes/DefaultTheme").DefaultTheme> | Readonly<typeof import("../themes/FlatTheme").FlatTheme>): string;
-    editorGroupHeader(t: Readonly<typeof import("../themes/DefaultTheme").DefaultTheme> | Readonly<typeof import("../themes/FlatTheme").FlatTheme>): string;
+    stickyTabsWrapper(t: Theme): string;
+    tabsInnerWrapper(t: Theme): string;
+    playgroundWrapper(t: Theme): string;
+    editorHeaderWrapper(t: Theme): string;
+    editorGroupHeader(t: Theme): string;
 };

package/internal/ThemePlayground/RadioPlayground/RadioPlayground.js

@@ -1,8 +1,7 @@
-import _inheritsLoose from "@babel/runtime/helpers/esm/inheritsLoose";
 import React from 'react';
-import { Gapped } from "..\\..\\..\\components\\Gapped";
-import { Radio } from "..\\..\\..\\components\\Radio";
-import { getComponentsFromPropsList } from "..\\helpers";
+import { Gapped } from "../../../components/Gapped";
+import { Radio } from "../../../components/Radio";
+import { getComponentsFromPropsList } from "../helpers";
 var propsList = [{
   value: '',
   children: 'Default',
@@ -27,25 +26,12 @@ var propsList = [{
   children: 'Warning',
   warning: true
 }];
-export var RadioPlayground =
-/*#__PURE__*/
-function (_React$Component) {
-  _inheritsLoose(RadioPlayground, _React$Component);
-
-  function RadioPlayground() {
-    return _React$Component.apply(this, arguments) || this;
-  }
-
-  var _proto = RadioPlayground.prototype;
-
-  _proto.render = function render() {
-    return React.createElement(Gapped, {
-      vertical: true
-    }, getComponentsFromPropsList(React.createElement(Radio, {
-      value: '',
-      checked: true
-    }), propsList));
-  };
-
-  return RadioPlayground;
-}(React.Component);
+export var RadioPlayground = function RadioPlayground() {
+  return /*#__PURE__*/React.createElement(Gapped, {
+    gap: 0,
+    vertical: true
+  }, getComponentsFromPropsList( /*#__PURE__*/React.createElement(Radio, {
+    value: '',
+    checked: true
+  }), propsList));
+};

package/internal/ThemePlayground/RadioPlayground/RadioPlayground.js.map

@@ -1 +1 @@
-{"version":3,"sources":["RadioPlayground.tsx"],"names":["React","Gapped","Radio","getComponentsFromPropsList","propsList","value","children","checked","disabled","focused","error","warning","RadioPlayground","render","Component"],"mappings":"sEAAA,OAAOA,KAAP,MAAkB,OAAlB;;AAEA,SAASC,MAAT,QAAuB,yBAAvB;AACA,SAASC,KAAT,QAAkC,wBAAlC;;AAEA,SAASC,0BAAT,QAA2C,WAA3C;;AAEA,IAAMC,SAA+B,GAAG;AACtC,EAAEC,KAAK,EAAE,EAAT,EAAaC,QAAQ,EAAE,SAAvB,EAAkCC,OAAO,EAAE,KAA3C,EADsC;AAEtC,EAAEF,KAAK,EAAE,EAAT,EAAaC,QAAQ,EAAE,SAAvB,EAFsC;AAGtC,EAAED,KAAK,EAAE,EAAT,EAAaC,QAAQ,EAAE,UAAvB,EAAmCE,QAAQ,EAAE,IAA7C,EAHsC;AAItC,EAAEH,KAAK,EAAE,EAAT,EAAaC,QAAQ,EAAE,SAAvB,EAAkCG,OAAO,EAAE,IAA3C,EAJsC;AAKtC,EAAEJ,KAAK,EAAE,EAAT,EAAaC,QAAQ,EAAE,OAAvB,EAAgCI,KAAK,EAAE,IAAvC,EALsC;AAMtC,EAAEL,KAAK,EAAE,EAAT,EAAaC,QAAQ,EAAE,SAAvB,EAAkCK,OAAO,EAAE,IAA3C,EANsC,CAAxC;;;AASA,WAAaC,eAAb;AACSC,EAAAA,MADT,GACE,kBAAgB;AACd,WAAO,oBAAC,MAAD,IAAQ,QAAQ,MAAhB,IAAkBV,0BAA0B,CAAC,oBAAC,KAAD,IAAO,KAAK,EAAE,EAAd,EAAkB,OAAO,MAAzB,GAAD,EAA+BC,SAA/B,CAA5C,CAAP;AACD,GAHH,0BAAqCJ,KAAK,CAACc,SAA3C","sourcesContent":["import React from 'react';\r\n\r\nimport { Gapped } from '../../components/Gapped';\r\nimport { Radio, RadioProps } from '../../components/Radio';\r\n\r\nimport { getComponentsFromPropsList } from './helpers';\r\n\r\nconst propsList: RadioProps<string>[] = [\r\n  { value: '', children: 'Default', checked: false },\r\n  { value: '', children: 'Checked' },\r\n  { value: '', children: 'Disabled', disabled: true },\r\n  { value: '', children: 'Focused', focused: true },\r\n  { value: '', children: 'Error', error: true },\r\n  { value: '', children: 'Warning', warning: true },\r\n];\r\n\r\nexport class RadioPlayground extends React.Component<{}, {}> {\r\n  public render() {\r\n    return <Gapped vertical>{getComponentsFromPropsList(<Radio value={''} checked />, propsList)}</Gapped>;\r\n  }\r\n}\r\n"]}
+{"version":3,"sources":["RadioPlayground.tsx"],"names":["React","Gapped","Radio","getComponentsFromPropsList","propsList","value","children","checked","disabled","focused","error","warning","RadioPlayground"],"mappings":"AAAA,OAAOA,KAAP,MAAkB,OAAlB;;AAEA,SAASC,MAAT,QAAuB,yBAAvB;AACA,SAASC,KAAT,QAAkC,wBAAlC;;AAEA,SAASC,0BAAT,QAA2C,WAA3C;;AAEA,IAAMC,SAA+B,GAAG;AACtC,EAAEC,KAAK,EAAE,EAAT,EAAaC,QAAQ,EAAE,SAAvB,EAAkCC,OAAO,EAAE,KAA3C,EADsC;AAEtC,EAAEF,KAAK,EAAE,EAAT,EAAaC,QAAQ,EAAE,SAAvB,EAFsC;AAGtC,EAAED,KAAK,EAAE,EAAT,EAAaC,QAAQ,EAAE,UAAvB,EAAmCE,QAAQ,EAAE,IAA7C,EAHsC;AAItC,EAAEH,KAAK,EAAE,EAAT,EAAaC,QAAQ,EAAE,SAAvB,EAAkCG,OAAO,EAAE,IAA3C,EAJsC;AAKtC,EAAEJ,KAAK,EAAE,EAAT,EAAaC,QAAQ,EAAE,OAAvB,EAAgCI,KAAK,EAAE,IAAvC,EALsC;AAMtC,EAAEL,KAAK,EAAE,EAAT,EAAaC,QAAQ,EAAE,SAAvB,EAAkCK,OAAO,EAAE,IAA3C,EANsC,CAAxC;;;AASA,OAAO,IAAMC,eAAe,GAAG,SAAlBA,eAAkB,GAAM;AACnC;AACE,wBAAC,MAAD,IAAQ,GAAG,EAAE,CAAb,EAAgB,QAAQ,MAAxB;AACGT,IAAAA,0BAA0B,eAAC,oBAAC,KAAD,IAAO,KAAK,EAAE,EAAd,EAAkB,OAAO,MAAzB,GAAD,EAA+BC,SAA/B,CAD7B,CADF;;;AAKD,CANM","sourcesContent":["import React from 'react';\n\nimport { Gapped } from '../../components/Gapped';\nimport { Radio, RadioProps } from '../../components/Radio';\n\nimport { getComponentsFromPropsList } from './helpers';\n\nconst propsList: RadioProps<string>[] = [\n  { value: '', children: 'Default', checked: false },\n  { value: '', children: 'Checked' },\n  { value: '', children: 'Disabled', disabled: true },\n  { value: '', children: 'Focused', focused: true },\n  { value: '', children: 'Error', error: true },\n  { value: '', children: 'Warning', warning: true },\n];\n\nexport const RadioPlayground = () => {\n  return (\n    <Gapped gap={0} vertical>\n      {getComponentsFromPropsList(<Radio value={''} checked />, propsList)}\n    </Gapped>\n  );\n};\n"]}

package/internal/ThemePlayground/RadioPlayground/package.json

@@ -1,6 +1,6 @@
 {
-  "main": "..\\..\\..\\cjs\\internal\\ThemePlayground\\RadioPlayground.js",
+  "main": "../../../cjs/internal/ThemePlayground/RadioPlayground.js",
   "module": "RadioPlayground",
-  "types": "..\\RadioPlayground.d.ts",
+  "types": "../RadioPlayground.d.ts",
   "sideEffects": false
 }

package/internal/ThemePlayground/RadioPlayground.d.ts

@@ -1,4 +1 @@
-import React from 'react';
-export declare class RadioPlayground extends React.Component<{}, {}> {
-    render(): JSX.Element;
-}
+export declare const RadioPlayground: () => JSX.Element;

package/internal/ThemePlayground/SelectPlayground/SelectPlayground.js

@@ -1,10 +1,8 @@
 import _extends from "@babel/runtime/helpers/esm/extends";
 import _inheritsLoose from "@babel/runtime/helpers/esm/inheritsLoose";
 import React from 'react';
-import { Select } from "..\\..\\..\\components\\Select";
-export var SelectPlayground =
-/*#__PURE__*/
-function (_React$Component) {
+import { Select } from "../../../components/Select";
+export var SelectPlayground = /*#__PURE__*/function (_React$Component) {
   _inheritsLoose(SelectPlayground, _React$Component);
 
   function SelectPlayground() {
@@ -32,7 +30,7 @@ function (_React$Component) {
   var _proto = SelectPlayground.prototype;
 
   _proto.render = function render() {
-    return React.createElement(Select, _extends({}, this.props, {
+    return /*#__PURE__*/React.createElement(Select, _extends({}, this.props, {
       value: this.state.value,
       items: this.selectItems,
       onValueChange: this.handleChange

package/internal/ThemePlayground/SelectPlayground/SelectPlayground.js.map

@@ -1 +1 @@
-{"version":3,"sources":["SelectPlayground.tsx"],"names":["React","Select","SelectPlayground","state","value","capitalize","props","size","selectItems","handleChange","setState","render","Component","input","charAt","toUpperCase","slice"],"mappings":"gIAAA,OAAOA,KAAP,MAAkB,OAAlB;;AAEA,SAASC,MAAT,QAAoC,yBAApC;;AAEA,WAAaC,gBAAb;AACSC,IAAAA,KADT,GACiB;AACbC,MAAAA,KAAK,EAAEC,UAAU,CAAC,MAAKC,KAAL,CAAWC,IAAZ,CADJ,EADjB;;AAImBC,IAAAA,WAJnB,GAIiC,CAAC,OAAD,EAAU,QAAV,EAAoB,OAApB,CAJjC;;;;;;;;;;;;;AAiBUC,IAAAA,YAjBV,GAiByB,UAACL,KAAD,EAAmB;AACxC,YAAKM,QAAL,CAAc;AACZN,QAAAA,KAAK,EAALA,KADY,EAAd;;AAGD,KArBH,8DAMSO,MANT,GAME,kBAAgB,CACd,OACE,oBAAC,MAAD,eACM,KAAKL,KADX,IAEE,KAAK,EAAE,KAAKH,KAAL,CAAWC,KAFpB,EAGE,KAAK,EAAE,KAAKI,WAHd,EAIE,aAAa,EAAE,KAAKC,YAJtB,IADF,CAQD,CAfH,2BAAsCT,KAAK,CAACY,SAA5C;;;AAwBA,IAAMP,UAAU,GAAG,SAAbA,UAAa,CAACQ,KAAD,EAAwB,KAAvBA,KAAuB,cAAvBA,KAAuB,GAAf,EAAe;AACzC,SAAOA,KAAK,CAACC,MAAN,CAAa,CAAb,EAAgBC,WAAhB,KAAgCF,KAAK,CAACG,KAAN,CAAY,CAAZ,CAAvC;AACD,CAFD","sourcesContent":["import React from 'react';\r\n\r\nimport { Select, SelectProps } from '../../components/Select';\r\n\r\nexport class SelectPlayground extends React.Component<SelectProps<string, string>, { value: string | undefined }> {\r\n  public state = {\r\n    value: capitalize(this.props.size),\r\n  };\r\n  private readonly selectItems = ['Small', 'Medium', 'Large'];\r\n\r\n  public render() {\r\n    return (\r\n      <Select<string, string>\r\n        {...this.props}\r\n        value={this.state.value}\r\n        items={this.selectItems}\r\n        onValueChange={this.handleChange}\r\n      />\r\n    );\r\n  }\r\n\r\n  private handleChange = (value: string) => {\r\n    this.setState({\r\n      value,\r\n    });\r\n  };\r\n}\r\n\r\nconst capitalize = (input = ''): string => {\r\n  return input.charAt(0).toUpperCase() + input.slice(1);\r\n};\r\n"]}
+{"version":3,"sources":["SelectPlayground.tsx"],"names":["React","Select","SelectPlayground","state","value","capitalize","props","size","selectItems","handleChange","setState","render","Component","input","charAt","toUpperCase","slice"],"mappings":"gIAAA,OAAOA,KAAP,MAAkB,OAAlB;;AAEA,SAASC,MAAT,QAAoC,yBAApC;;AAEA,WAAaC,gBAAb;AACSC,IAAAA,KADT,GACiB;AACbC,MAAAA,KAAK,EAAEC,UAAU,CAAC,MAAKC,KAAL,CAAWC,IAAZ,CADJ,EADjB;;AAImBC,IAAAA,WAJnB,GAIiC,CAAC,OAAD,EAAU,QAAV,EAAoB,OAApB,CAJjC;;;;;;;;;;;;;AAiBUC,IAAAA,YAjBV,GAiByB,UAACL,KAAD,EAAmB;AACxC,YAAKM,QAAL,CAAc;AACZN,QAAAA,KAAK,EAALA,KADY,EAAd;;AAGD,KArBH,8DAMSO,MANT,GAME,kBAAgB,CACd,oBACE,oBAAC,MAAD,eACM,KAAKL,KADX,IAEE,KAAK,EAAE,KAAKH,KAAL,CAAWC,KAFpB,EAGE,KAAK,EAAE,KAAKI,WAHd,EAIE,aAAa,EAAE,KAAKC,YAJtB,IADF,CAQD,CAfH,2BAAsCT,KAAK,CAACY,SAA5C;;;AAwBA,IAAMP,UAAU,GAAG,SAAbA,UAAa,CAACQ,KAAD,EAAwB,KAAvBA,KAAuB,cAAvBA,KAAuB,GAAf,EAAe;AACzC,SAAOA,KAAK,CAACC,MAAN,CAAa,CAAb,EAAgBC,WAAhB,KAAgCF,KAAK,CAACG,KAAN,CAAY,CAAZ,CAAvC;AACD,CAFD","sourcesContent":["import React from 'react';\n\nimport { Select, SelectProps } from '../../components/Select';\n\nexport class SelectPlayground extends React.Component<SelectProps<string, string>, { value: string | undefined }> {\n  public state = {\n    value: capitalize(this.props.size),\n  };\n  private readonly selectItems = ['Small', 'Medium', 'Large'];\n\n  public render() {\n    return (\n      <Select<string, string>\n        {...this.props}\n        value={this.state.value}\n        items={this.selectItems}\n        onValueChange={this.handleChange}\n      />\n    );\n  }\n\n  private handleChange = (value: string) => {\n    this.setState({\n      value,\n    });\n  };\n}\n\nconst capitalize = (input = ''): string => {\n  return input.charAt(0).toUpperCase() + input.slice(1);\n};\n"]}

package/internal/ThemePlayground/SelectPlayground/package.json

@@ -1,6 +1,6 @@
 {
-  "main": "..\\..\\..\\cjs\\internal\\ThemePlayground\\SelectPlayground.js",
+  "main": "../../../cjs/internal/ThemePlayground/SelectPlayground.js",
   "module": "SelectPlayground",
-  "types": "..\\SelectPlayground.d.ts",
+  "types": "../SelectPlayground.d.ts",
   "sideEffects": false
 }

package/internal/ThemePlayground/ShowcaseGroup/ShowcaseGroup.js

@@ -1,17 +1,23 @@
 import React from 'react';
-import { Checkbox } from "..\\..\\..\\components\\Checkbox";
-import { Gapped } from "..\\..\\..\\components\\Gapped";
-import { Button } from "..\\..\\..\\components\\Button";
-import { Input } from "..\\..\\..\\components\\Input";
-import { Toggle } from "..\\..\\..\\components\\Toggle";
-import { Radio } from "..\\..\\..\\components\\Radio";
+import { Checkbox } from "../../../components/Checkbox";
+import { Gapped } from "../../../components/Gapped";
+import { Button } from "../../../components/Button";
+import { Input } from "../../../components/Input";
+import { Toggle } from "../../../components/Toggle";
+import { Radio } from "../../../components/Radio";
+import { ThemeContext } from "../../../lib/theming/ThemeContext";
 export var ShowcaseGroup = function ShowcaseGroup(props) {
-  return React.createElement("div", null, props.title && React.createElement("h2", null, props.title), React.createElement(Gapped, {
+  var theme = React.useContext(ThemeContext);
+  return /*#__PURE__*/React.createElement("div", null, props.title && /*#__PURE__*/React.createElement("h2", {
+    style: {
+      color: theme.textColorDefault
+    }
+  }, props.title), /*#__PURE__*/React.createElement(Gapped, {
     gap: 10
-  }, React.createElement(Button, null, "Button"), React.createElement(Input, null), React.createElement(Toggle, null), React.createElement(Radio, {
+  }, /*#__PURE__*/React.createElement(Button, null, "Button"), /*#__PURE__*/React.createElement(Input, null), /*#__PURE__*/React.createElement(Toggle, null), /*#__PURE__*/React.createElement(Radio, {
     value: '',
     checked: true
-  }, "Radio"), React.createElement(Checkbox, {
+  }, "Radio"), /*#__PURE__*/React.createElement(Checkbox, {
     checked: true
   }, "Checkbox")));
 };

package/internal/ThemePlayground/ShowcaseGroup/ShowcaseGroup.js.map

@@ -1 +1 @@
-{"version":3,"sources":["ShowcaseGroup.tsx"],"names":["React","Checkbox","Gapped","Button","Input","Toggle","Radio","ShowcaseGroup","props","title"],"mappings":"AAAA,OAAOA,KAAP,MAAkB,OAAlB;;AAEA,SAASC,QAAT,QAAyB,2BAAzB;AACA,SAASC,MAAT,QAAuB,yBAAvB;AACA,SAASC,MAAT,QAAuB,yBAAvB;AACA,SAASC,KAAT,QAAsB,wBAAtB;AACA,SAASC,MAAT,QAAuB,yBAAvB;AACA,SAASC,KAAT,QAAsB,wBAAtB;;;;;AAKA,OAAO,IAAMC,aAAa,GAAG,SAAhBA,aAAgB,CAACC,KAAD;AAC3B;AACGA,IAAAA,KAAK,CAACC,KAAN,IAAe,gCAAKD,KAAK,CAACC,KAAX,CADlB;AAEE,wBAAC,MAAD,IAAQ,GAAG,EAAE,EAAb;AACE,wBAAC,MAAD,iBADF;AAEE,wBAAC,KAAD,OAFF;AAGE,wBAAC,MAAD,OAHF;AAIE,wBAAC,KAAD,IAAO,KAAK,EAAE,EAAd,EAAkB,OAAO,MAAzB,YAJF;;;AAOE,wBAAC,QAAD,IAAU,OAAO,MAAjB,eAPF,CAFF,CAD2B,GAAtB","sourcesContent":["import React from 'react';\r\n\r\nimport { Checkbox } from '../../components/Checkbox';\r\nimport { Gapped } from '../../components/Gapped';\r\nimport { Button } from '../../components/Button';\r\nimport { Input } from '../../components/Input';\r\nimport { Toggle } from '../../components/Toggle';\r\nimport { Radio } from '../../components/Radio';\r\n\r\ninterface ShowcaseGroupProps {\r\n  title?: string;\r\n}\r\nexport const ShowcaseGroup = (props: ShowcaseGroupProps) => (\r\n  <div>\r\n    {props.title && <h2>{props.title}</h2>}\r\n    <Gapped gap={10}>\r\n      <Button>Button</Button>\r\n      <Input />\r\n      <Toggle />\r\n      <Radio value={''} checked>\r\n        Radio\r\n      </Radio>\r\n      <Checkbox checked>Checkbox</Checkbox>\r\n    </Gapped>\r\n  </div>\r\n);\r\n"]}
+{"version":3,"sources":["ShowcaseGroup.tsx"],"names":["React","Checkbox","Gapped","Button","Input","Toggle","Radio","ThemeContext","ShowcaseGroup","props","theme","useContext","title","color","textColorDefault"],"mappings":"AAAA,OAAOA,KAAP,MAAkB,OAAlB;;AAEA,SAASC,QAAT,QAAyB,2BAAzB;AACA,SAASC,MAAT,QAAuB,yBAAvB;AACA,SAASC,MAAT,QAAuB,yBAAvB;AACA,SAASC,KAAT,QAAsB,wBAAtB;AACA,SAASC,MAAT,QAAuB,yBAAvB;AACA,SAASC,KAAT,QAAsB,wBAAtB;AACA,SAASC,YAAT,QAA6B,gCAA7B;;;;;AAKA,OAAO,IAAMC,aAAa,GAAG,SAAhBA,aAAgB,CAACC,KAAD,EAA+B;AAC1D,MAAMC,KAAK,GAAGV,KAAK,CAACW,UAAN,CAAiBJ,YAAjB,CAAd;;AAEA;AACE;AACGE,IAAAA,KAAK,CAACG,KAAN,iBAAe,4BAAI,KAAK,EAAE,EAAEC,KAAK,EAAEH,KAAK,CAACI,gBAAf,EAAX,IAA+CL,KAAK,CAACG,KAArD,CADlB;AAEE,wBAAC,MAAD,IAAQ,GAAG,EAAE,EAAb;AACE,wBAAC,MAAD,iBADF;AAEE,wBAAC,KAAD,OAFF;AAGE,wBAAC,MAAD,OAHF;AAIE,wBAAC,KAAD,IAAO,KAAK,EAAE,EAAd,EAAkB,OAAO,MAAzB,YAJF;;;AAOE,wBAAC,QAAD,IAAU,OAAO,MAAjB,eAPF,CAFF,CADF;;;;AAcD,CAjBM","sourcesContent":["import React from 'react';\n\nimport { Checkbox } from '../../components/Checkbox';\nimport { Gapped } from '../../components/Gapped';\nimport { Button } from '../../components/Button';\nimport { Input } from '../../components/Input';\nimport { Toggle } from '../../components/Toggle';\nimport { Radio } from '../../components/Radio';\nimport { ThemeContext } from '../../lib/theming/ThemeContext';\n\ninterface ShowcaseGroupProps {\n  title?: string;\n}\nexport const ShowcaseGroup = (props: ShowcaseGroupProps) => {\n  const theme = React.useContext(ThemeContext);\n\n  return (\n    <div>\n      {props.title && <h2 style={{ color: theme.textColorDefault }}>{props.title}</h2>}\n      <Gapped gap={10}>\n        <Button>Button</Button>\n        <Input />\n        <Toggle />\n        <Radio value={''} checked>\n          Radio\n        </Radio>\n        <Checkbox checked>Checkbox</Checkbox>\n      </Gapped>\n    </div>\n  );\n};\n"]}

package/internal/ThemePlayground/ShowcaseGroup/package.json

@@ -1,6 +1,6 @@
 {
-  "main": "..\\..\\..\\cjs\\internal\\ThemePlayground\\ShowcaseGroup.js",
+  "main": "../../../cjs/internal/ThemePlayground/ShowcaseGroup.js",
   "module": "ShowcaseGroup",
-  "types": "..\\ShowcaseGroup.d.ts",
+  "types": "../ShowcaseGroup.d.ts",
   "sideEffects": false
 }

package/internal/ThemePlayground/ShowcaseGroup.d.ts

@@ -1,4 +1,3 @@
-/// <reference types="react" />
 interface ShowcaseGroupProps {
     title?: string;
 }

package/internal/ThemePlayground/SwitcherPlayground/SwitcherPlayground.js

@@ -1,11 +1,9 @@
 import _extends from "@babel/runtime/helpers/esm/extends";
 import _inheritsLoose from "@babel/runtime/helpers/esm/inheritsLoose";
 import React from 'react';
-import { Switcher } from "..\\..\\..\\components\\Switcher";
+import { Switcher } from "../../../components/Switcher";
 var defaultItems = ['Default', 'Error'];
-export var SwitcherPlayground =
-/*#__PURE__*/
-function (_React$Component) {
+export var SwitcherPlayground = /*#__PURE__*/function (_React$Component) {
   _inheritsLoose(SwitcherPlayground, _React$Component);
 
   function SwitcherPlayground() {
@@ -34,7 +32,7 @@ function (_React$Component) {
   var _proto = SwitcherPlayground.prototype;
 
   _proto.render = function render() {
-    return React.createElement(Switcher, _extends({
+    return /*#__PURE__*/React.createElement(Switcher, _extends({
       value: this.state.value,
       onValueChange: this.handleValueChange,
       items: this.props.items || defaultItems,

package/internal/ThemePlayground/SwitcherPlayground/SwitcherPlayground.js.map

@@ -1 +1 @@
-{"version":3,"sources":["SwitcherPlayground.tsx"],"names":["React","Switcher","defaultItems","SwitcherPlayground","state","value","error","handleValueChange","setState","render","props","items","Component"],"mappings":"gIAAA,OAAOA,KAAP,MAAkB,OAAlB;;AAEA,SAASC,QAAT,QAAyB,2BAAzB;;AAEA,IAAMC,YAAY,GAAG,CAAC,SAAD,EAAY,OAAZ,CAArB;;AAEA,WAAaC,kBAAb;;;;AAISC,IAAAA,KAJT,GAIiB;AACbC,MAAAA,KAAK,EAAE,EADM;AAEbC,MAAAA,KAAK,EAAE,KAFM,EAJjB;;;;;;;;;;;;;;;AAqBUC,IAAAA,iBArBV,GAqB8B,UAACF,KAAD,EAAmB;AAC7C,YAAKG,QAAL,CAAc,EAAEH,KAAK,EAALA,KAAF,EAASC,KAAK,EAAED,KAAK,KAAK,OAA1B,EAAd;AACD,KAvBH,gEASSI,MATT,GASE,kBAAgB,CACd,OACE,oBAAC,QAAD,aACE,KAAK,EAAE,KAAKL,KAAL,CAAWC,KADpB,EAEE,aAAa,EAAE,KAAKE,iBAFtB,EAGE,KAAK,EAAE,KAAKG,KAAL,CAAWC,KAAX,IAAoBT,YAH7B,EAIE,KAAK,EAAE,KAAKE,KAAL,CAAWE,KAJpB,IAKM,KAAKI,KALX,EADF,CASD,CAnBH,6BAAwCV,KAAK,CAACY,SAA9C","sourcesContent":["import React from 'react';\r\n\r\nimport { Switcher } from '../../components/Switcher';\r\n\r\nconst defaultItems = ['Default', 'Error'];\r\n\r\nexport class SwitcherPlayground extends React.Component<\r\n  { items?: string[]; disabled?: boolean },\r\n  { value: string; error: boolean }\r\n> {\r\n  public state = {\r\n    value: '',\r\n    error: false,\r\n  };\r\n\r\n  public render() {\r\n    return (\r\n      <Switcher\r\n        value={this.state.value}\r\n        onValueChange={this.handleValueChange}\r\n        items={this.props.items || defaultItems}\r\n        error={this.state.error}\r\n        {...this.props}\r\n      />\r\n    );\r\n  }\r\n\r\n  private handleValueChange = (value: string) => {\r\n    this.setState({ value, error: value === 'Error' });\r\n  };\r\n}\r\n"]}
+{"version":3,"sources":["SwitcherPlayground.tsx"],"names":["React","Switcher","defaultItems","SwitcherPlayground","state","value","error","handleValueChange","setState","render","props","items","Component"],"mappings":"gIAAA,OAAOA,KAAP,MAAkB,OAAlB;;AAEA,SAASC,QAAT,QAAyB,2BAAzB;;AAEA,IAAMC,YAAY,GAAG,CAAC,SAAD,EAAY,OAAZ,CAArB;;AAEA,WAAaC,kBAAb;;;;AAISC,IAAAA,KAJT,GAIiB;AACbC,MAAAA,KAAK,EAAE,EADM;AAEbC,MAAAA,KAAK,EAAE,KAFM,EAJjB;;;;;;;;;;;;;;;AAqBUC,IAAAA,iBArBV,GAqB8B,UAACF,KAAD,EAAmB;AAC7C,YAAKG,QAAL,CAAc,EAAEH,KAAK,EAALA,KAAF,EAASC,KAAK,EAAED,KAAK,KAAK,OAA1B,EAAd;AACD,KAvBH,gEASSI,MATT,GASE,kBAAgB,CACd,oBACE,oBAAC,QAAD,aACE,KAAK,EAAE,KAAKL,KAAL,CAAWC,KADpB,EAEE,aAAa,EAAE,KAAKE,iBAFtB,EAGE,KAAK,EAAE,KAAKG,KAAL,CAAWC,KAAX,IAAoBT,YAH7B,EAIE,KAAK,EAAE,KAAKE,KAAL,CAAWE,KAJpB,IAKM,KAAKI,KALX,EADF,CASD,CAnBH,6BAAwCV,KAAK,CAACY,SAA9C","sourcesContent":["import React from 'react';\n\nimport { Switcher } from '../../components/Switcher';\n\nconst defaultItems = ['Default', 'Error'];\n\nexport class SwitcherPlayground extends React.Component<\n  { items?: string[]; disabled?: boolean },\n  { value: string; error: boolean }\n> {\n  public state = {\n    value: '',\n    error: false,\n  };\n\n  public render() {\n    return (\n      <Switcher\n        value={this.state.value}\n        onValueChange={this.handleValueChange}\n        items={this.props.items || defaultItems}\n        error={this.state.error}\n        {...this.props}\n      />\n    );\n  }\n\n  private handleValueChange = (value: string) => {\n    this.setState({ value, error: value === 'Error' });\n  };\n}\n"]}

package/internal/ThemePlayground/SwitcherPlayground/package.json

@@ -1,6 +1,6 @@
 {
-  "main": "..\\..\\..\\cjs\\internal\\ThemePlayground\\SwitcherPlayground.js",
+  "main": "../../../cjs/internal/ThemePlayground/SwitcherPlayground.js",
   "module": "SwitcherPlayground",
-  "types": "..\\SwitcherPlayground.d.ts",
+  "types": "../SwitcherPlayground.d.ts",
   "sideEffects": false
 }