@blocklet/launcher-ux 1.8.1 → 1.8.2

package/lib/check-box/index.js

@@ -7,16 +7,20 @@ exports.default = CheckBox;
 
 var _propTypes = _interopRequireDefault(require("prop-types"));
 
-var _styledComponents = _interopRequireDefault(require("styled-components"));
+var _styled = _interopRequireDefault(require("@emotion/styled"));
 
 var _Check = _interopRequireDefault(require("@mui/icons-material/Check"));
 
 var _jsxRuntime = require("react/jsx-runtime");
 
+var _templateObject;
+
 const _excluded = ["children", "checked", "checkIconSize", "className"];
 
 function _interopRequireDefault(obj) { return obj && obj.__esModule ? obj : { default: obj }; }
 
+function _taggedTemplateLiteral(strings, raw) { if (!raw) { raw = strings.slice(0); } return Object.freeze(Object.defineProperties(strings, { raw: { value: Object.freeze(raw) } })); }
+
 function ownKeys(object, enumerableOnly) { var keys = Object.keys(object); if (Object.getOwnPropertySymbols) { var symbols = Object.getOwnPropertySymbols(object); enumerableOnly && (symbols = symbols.filter(function (sym) { return Object.getOwnPropertyDescriptor(object, sym).enumerable; })), keys.push.apply(keys, symbols); } return keys; }
 
 function _objectSpread(target) { for (var i = 1; i < arguments.length; i++) { var source = null != arguments[i] ? arguments[i] : {}; i % 2 ? ownKeys(Object(source), !0).forEach(function (key) { _defineProperty(target, key, source[key]); }) : Object.getOwnPropertyDescriptors ? Object.defineProperties(target, Object.getOwnPropertyDescriptors(source)) : ownKeys(Object(source)).forEach(function (key) { Object.defineProperty(target, key, Object.getOwnPropertyDescriptor(source, key)); }); } return target; }
@@ -61,7 +65,4 @@ CheckBox.defaultProps = {
   className: ''
 };
 
-const Content = _styledComponents.default.div.withConfig({
-  displayName: "check-box__Content",
-  componentId: "sc-7zt78z-0"
-})(["position:relative;padding:10px;border:0 solid ", ";border-radius:8px;transition:all ease 0.2s;cursor:pointer;.check-container{position:absolute;right:0;bottom:0;display:flex;justify-content:flex-end;align-items:flex-end;width:", "px;height:", "px;border-radius:0 0 7px 0;color:", ";overflow:hidden;transition:all ease 0.3s;&:after{position:absolute;z-index:0;left:", "px;top:", "px;display:block;width:0;height:0;border-top:transparent solid ", "px;border-left:transparent solid ", "px;border-bottom:", " solid ", "px;border-right:", " solid ", "px;transition:all ease 0.1s;content:'';}.check-icon{width:60%;height:60%;position:relative;z-index:2;margin:0 1px 1px 0;font-size:16px;transform:scale(0);transition:all ease 0.2s;}}&.checked{background-color:#ecfbfd;border-color:#ecfbfd;color:", ";.check-container{&:after{left:0;top:0;}.check-icon{transform:scale(1);}}}"], props => props.theme.palette.grey['100'], props => props.checkIconSize, props => props.checkIconSize, props => props.theme.palette.common.white, props => props.checkIconSize, props => props.checkIconSize, props => props.checkIconSize / 2, props => props.checkIconSize / 2, props => props.theme.palette.primary.main, props => props.checkIconSize / 2, props => props.theme.palette.primary.main, props => props.checkIconSize / 2, props => props.theme.palette.primary.main);
+const Content = _styled.default.div(_templateObject || (_templateObject = _taggedTemplateLiteral(["\n  position: relative;\n  padding: 10px;\n  border: 0 solid ", ";\n  border-radius: 8px;\n  transition: all ease 0.2s;\n  cursor: pointer;\n\n  .check-container {\n    position: absolute;\n    right: 0;\n    bottom: 0;\n    display: flex;\n    justify-content: flex-end;\n    align-items: flex-end;\n    width: ", "px;\n    height: ", "px;\n    border-radius: 0 0 7px 0;\n    color: ", ";\n    overflow: hidden;\n    transition: all ease 0.3s;\n    &:after {\n      position: absolute;\n      z-index: 0;\n      left: ", "px;\n      top: ", "px;\n      display: block;\n      width: 0;\n      height: 0;\n      border-top: transparent solid ", "px;\n      border-left: transparent solid ", "px;\n      border-bottom: ", " solid ", "px;\n      border-right: ", " solid ", "px;\n      transition: all ease 0.1s;\n      content: '';\n    }\n\n    .check-icon {\n      width: 60%;\n      height: 60%;\n      position: relative;\n      z-index: 2;\n      margin: 0 1px 1px 0;\n      font-size: 16px;\n      transform: scale(0);\n      transition: all ease 0.2s;\n    }\n  }\n\n  &.checked {\n    background-color: #ecfbfd;\n    border-color: #ecfbfd;\n    color: ", ";\n\n    .check-container {\n      &:after {\n        left: 0;\n        top: 0;\n      }\n\n      .check-icon {\n        transform: scale(1);\n      }\n    }\n  }\n"])), props => props.theme.palette.grey['100'], props => props.checkIconSize, props => props.checkIconSize, props => props.theme.palette.common.white, props => props.checkIconSize, props => props.checkIconSize, props => props.checkIconSize / 2, props => props.checkIconSize / 2, props => props.theme.palette.primary.main, props => props.checkIconSize / 2, props => props.theme.palette.primary.main, props => props.checkIconSize / 2, props => props.theme.palette.primary.main);

package/lib/progress-message/index.js

@@ -9,16 +9,20 @@ var _propTypes = _interopRequireDefault(require("prop-types"));
 
 var _react = require("react");
 
-var _styledComponents = _interopRequireDefault(require("styled-components"));
+var _styled = _interopRequireDefault(require("@emotion/styled"));
 
 var _smallCircleProgress = _interopRequireDefault(require("../small-circle-progress"));
 
 var _jsxRuntime = require("react/jsx-runtime");
 
+var _templateObject;
+
 const _excluded = ["steps", "stepIndex", "autoGrowth"];
 
 function _interopRequireDefault(obj) { return obj && obj.__esModule ? obj : { default: obj }; }
 
+function _taggedTemplateLiteral(strings, raw) { if (!raw) { raw = strings.slice(0); } return Object.freeze(Object.defineProperties(strings, { raw: { value: Object.freeze(raw) } })); }
+
 function ownKeys(object, enumerableOnly) { var keys = Object.keys(object); if (Object.getOwnPropertySymbols) { var symbols = Object.getOwnPropertySymbols(object); enumerableOnly && (symbols = symbols.filter(function (sym) { return Object.getOwnPropertyDescriptor(object, sym).enumerable; })), keys.push.apply(keys, symbols); } return keys; }
 
 function _objectSpread(target) { for (var i = 1; i < arguments.length; i++) { var source = null != arguments[i] ? arguments[i] : {}; i % 2 ? ownKeys(Object(source), !0).forEach(function (key) { _defineProperty(target, key, source[key]); }) : Object.getOwnPropertyDescriptors ? Object.defineProperties(target, Object.getOwnPropertyDescriptors(source)) : ownKeys(Object(source)).forEach(function (key) { Object.defineProperty(target, key, Object.getOwnPropertyDescriptor(source, key)); }); } return target; }
@@ -114,7 +118,4 @@ ProgressMessage.defaultProps = {
   autoGrowth: 0
 };
 
-const Container = _styledComponents.default.div.withConfig({
-  displayName: "progress-message__Container",
-  componentId: "sc-1tg6t5m-0"
-})(["display:flex;width:100%;align-items:center;justify-content:center;.progress-message{position:relative;color:", ";margin-left:8px;font-size:18px;min-height:26px;line-height:26px;font-weight:700;transition:all ease 0.3s;}.progress-message-item{position:absolute;left:0;top:0;white-space:nowrap;transition:all ease 0.3s;z-index:2;&.message-before{transform:translate(-10px,0);opacity:0;z-index:0;pointer-events:none;}&.message-after{transform:translate(10px,0);opacity:0;z-index:0;pointer-events:none;}}"], props => props.theme.palette.primary.main);
+const Container = _styled.default.div(_templateObject || (_templateObject = _taggedTemplateLiteral(["\n  display: flex;\n  width: 100%;\n  align-items: center;\n  justify-content: center;\n  .progress-message {\n    position: relative;\n    color: ", ";\n    margin-left: 8px;\n    font-size: 18px;\n    min-height: 26px;\n    line-height: 26px;\n    font-weight: 700;\n    transition: all ease 0.3s;\n  }\n  .progress-message-item {\n    position: absolute;\n    left: 0;\n    top: 0;\n    white-space: nowrap;\n    transition: all ease 0.3s;\n    z-index: 2;\n    &.message-before {\n      transform: translate(-10px, 0);\n      opacity: 0;\n      z-index: 0;\n      pointer-events: none;\n    }\n    &.message-after {\n      transform: translate(10px, 0);\n      opacity: 0;\n      z-index: 0;\n      pointer-events: none;\n    }\n  }\n"])), props => props.theme.palette.primary.main);

package/lib/small-circle-progress/index.js

@@ -7,16 +7,20 @@ exports.default = SmallCircleProgress;
 
 var _propTypes = _interopRequireDefault(require("prop-types"));
 
-var _styledComponents = _interopRequireDefault(require("styled-components"));
+var _styled = _interopRequireDefault(require("@emotion/styled"));
 
 var _CircularProgress = _interopRequireDefault(require("@mui/material/CircularProgress"));
 
 var _jsxRuntime = require("react/jsx-runtime");
 
+var _templateObject;
+
 const _excluded = ["value", "size", "style"];
 
 function _interopRequireDefault(obj) { return obj && obj.__esModule ? obj : { default: obj }; }
 
+function _taggedTemplateLiteral(strings, raw) { if (!raw) { raw = strings.slice(0); } return Object.freeze(Object.defineProperties(strings, { raw: { value: Object.freeze(raw) } })); }
+
 function ownKeys(object, enumerableOnly) { var keys = Object.keys(object); if (Object.getOwnPropertySymbols) { var symbols = Object.getOwnPropertySymbols(object); enumerableOnly && (symbols = symbols.filter(function (sym) { return Object.getOwnPropertyDescriptor(object, sym).enumerable; })), keys.push.apply(keys, symbols); } return keys; }
 
 function _objectSpread(target) { for (var i = 1; i < arguments.length; i++) { var source = null != arguments[i] ? arguments[i] : {}; i % 2 ? ownKeys(Object(source), !0).forEach(function (key) { _defineProperty(target, key, source[key]); }) : Object.getOwnPropertyDescriptors ? Object.defineProperties(target, Object.getOwnPropertyDescriptors(source)) : ownKeys(Object(source)).forEach(function (key) { Object.defineProperty(target, key, Object.getOwnPropertyDescriptor(source, key)); }); } return target; }
@@ -72,7 +76,4 @@ SmallCircleProgress.defaultProps = {
   style: {}
 };
 
-const Content = _styledComponents.default.span.withConfig({
-  displayName: "small-circle-progress__Content",
-  componentId: "sc-1q02wd1-0"
-})(["display:inline-block;position:relative;> *{position:absolute;left:0;top:0;width:100%;height:100%;}"]);
+const Content = _styled.default.span(_templateObject || (_templateObject = _taggedTemplateLiteral(["\n  display: inline-block;\n  position: relative;\n  > * {\n    position: absolute;\n    left: 0;\n    top: 0;\n    width: 100%;\n    height: 100%;\n  }\n"])));

package/package.json

@@ -1,6 +1,6 @@
 {
   "name": "@blocklet/launcher-ux",
-  "version": "1.8.1",
+  "version": "1.8.2",
   "description": "Launcher UX lib",
   "publishConfig": {
     "access": "public"
@@ -38,17 +38,18 @@
     "@mui/icons-material": "^5.6.2",
     "@mui/material": "^5.6.4",
     "prop-types": "^15.8.1",
-    "react": ">=18.1.0",
-    "styled-components": "^5.0.1"
+    "react": ">=18.1.0"
   },
   "devDependencies": {
     "@babel/cli": "^7.18.10",
     "@babel/core": "^7.18.10",
     "@babel/preset-env": "^7.18.10",
     "@babel/preset-react": "^7.18.6",
-    "@storybook/react": "^6.5.9",
-    "babel-plugin-inline-react-svg": "^2.0.1",
-    "babel-plugin-styled-components": "^1.13.3"
+    "@storybook/react": "^6.5.10",
+    "babel-plugin-inline-react-svg": "^2.0.1"
   },
-  "gitHead": "1f6716a8b318faf9b819ae59430b269401c283e4"
+  "dependencies": {
+    "@emotion/styled": "^11.10.0"
+  },
+  "gitHead": "de0a7f5a5195fd0a33810a8cc1edd266a9658b69"
 }