@semcore/feedback-form 6.42.2-prerelease.0 → 6.43.0-prerelease.0

package/lib/esm/FeedbackForm.mjs

@@ -3,19 +3,17 @@ import _objectSpread from "@babel/runtime/helpers/esm/objectSpread2";
 import _objectWithoutProperties from "@babel/runtime/helpers/esm/objectWithoutProperties";
 import _classCallCheck from "@babel/runtime/helpers/esm/classCallCheck";
 import _createClass from "@babel/runtime/helpers/esm/createClass";
-import _assertThisInitialized from "@babel/runtime/helpers/esm/assertThisInitialized";
+import _callSuper from "@babel/runtime/helpers/esm/callSuper";
 import _inherits from "@babel/runtime/helpers/esm/inherits";
-import _createSuper from "@babel/runtime/helpers/esm/createSuper";
 import _defineProperty from "@babel/runtime/helpers/esm/defineProperty";
-import { sstyled } from "@semcore/utils/lib/core/index";
-import createComponent, { sstyled as sstyled$1, Component, assignProps } from "@semcore/core";
-import React from "react";
-import { Form, Field } from "react-final-form";
-import createFocusDecorator from "final-form-focus";
+import { sstyled, Component, assignProps, createComponent } from "@semcore/core";
+import { Box } from "@semcore/base-components";
 import Button from "@semcore/button";
-import SpinContainer from "@semcore/spin-container";
 import { NoticeSmart } from "@semcore/notice";
-import { Box } from "@semcore/flex-box";
+import SpinContainer from "@semcore/spin-container";
+import createFocusDecorator from "final-form-focus";
+import React from "react";
+import { Form, Field } from "react-final-form";
 import { FeedbackItem } from "./component/feedback-item/FeedbackItem.mjs";
 import { SubmitButton } from "./component/submit-button/SubmitButton.mjs";
 var _excluded = ["Children", "styles", "forwardRef", "loading", "background", "theme"];
@@ -24,33 +22,32 @@ var style = (
   /*__reshadow_css_start__*/
   (sstyled.insert(
     /*__inner_css_start__*/
-    `.___SFeedbackForm_z5f3m_gg_{max-width:320px}.___SCancel_z5f3m_gg_,.___SSubmit_z5f3m_gg_{display:inline-flex;margin-right:var(--intergalactic-spacing-2x, 8px)}.___SNotice_z5f3m_gg_{padding:var(--intergalactic-spacing-3x, 12px) var(--intergalactic-spacing-4x, 16px);border-width:1px 0 0;border-top-style:solid;border-radius:0 0 var(--intergalactic-surface-rounded, 6px) var(--intergalactic-surface-rounded, 6px)}.___SSuccess_z5f3m_gg_{display:flex;align-items:center;flex-direction:column;width:320px;padding:var(--intergalactic-spacing-10x, 40px);box-sizing:border-box;outline:0}.___SEmail_z5f3m_gg_{margin-bottom:calc(var(--intergalactic-spacing-4x, 16px) + var(--intergalactic-spacing-05x, 2px));width:80px;height:80px;background-image:url("data:image/svg+xml,%3Csvg width='80' height='80' viewBox='0 0 80 80' fill='none' xmlns='http://www.w3.org/2000/svg'%3E%3Cpath d='M28.1632 6.00003C27.9554 5.99875 27.7493 6.03875 27.5571 6.11772C27.3648 6.19668 27.1902 6.31304 27.0432 6.46003L14.1332 19.38C7.645 25.8687 4 34.669 4 43.845C4 53.0211 7.645 61.8213 14.1332 68.31C17.3463 71.5242 21.1611 74.0738 25.3597 75.8134C29.5583 77.5529 34.0585 78.4482 38.6032 78.4482C43.1479 78.4482 47.6481 77.5529 51.8467 75.8134C56.0454 74.0738 59.8602 71.5242 63.0732 68.31L75.9832 55.4C76.1316 55.2536 76.2495 55.0792 76.3301 54.887C76.4108 54.6948 76.4526 54.4885 76.4532 54.28V6.89003C76.4506 6.65307 76.3546 6.42671 76.1861 6.26009C76.0176 6.09346 75.7902 6.00002 75.5532 6.00003H28.1632Z' fill='%2345E0A8'/%3E%3Cpath d='M29 45.2852L29.2 45.6352C35.39 42.1852 53.39 31.9652 56.73 35.1052C55.6 32.0052 39.7 35.4352 29 45.2852Z' fill='white'/%3E%3Cpath d='M28.44 31.6343C26.63 37.6343 19.23 56.1043 15 61.9443L18 62.8543L19.58 61.5343C23.8 51.9843 29.58 35.5343 29.89 30.0743C29.39 29.8143 28.93 30.2143 28.44 31.6343Z' fill='white'/%3E%3Cpath d='M15 62.0078C19.23 56.1678 26.63 37.7378 28.44 31.6678C30.25 25.5978 33.49 37.6678 31.67 42.7878' stroke='black' stroke-width='0.75' stroke-linecap='round' stroke-linejoin='round'/%3E%3Cpath d='M28 45.9424C38.68 35.5824 55.27 31.9424 56.43 35.1024C57.12 36.9924 43 41.3624 38.02 47.4224' stroke='black' stroke-width='0.75' stroke-linecap='round' stroke-linejoin='round'/%3E%3Cpath d='M44.45 21.93C41.21 20.77 35.86 19.04 33 18.24C37.12 16.41 70 4.24 72.67 3C71.75 7.11 67.75 21.28 65.96 27.93C61.13 26.25 56.23 24.78 53.03 23.74C51.0298 26.3907 49.2219 29.1812 47.62 32.09C46.44 28.23 45.29 23.77 44.45 21.93Z' fill='white' stroke='black' stroke-width='0.75' stroke-linecap='round' stroke-linejoin='round'/%3E%3Cpath d='M45 22.08L61.74 11' stroke='black' stroke-width='0.75' stroke-linecap='round' stroke-linejoin='round'/%3E%3Cpath d='M53 23.73L72.64 3' stroke='black' stroke-width='0.75' stroke-linecap='round' stroke-linejoin='round'/%3E%3Cpath d='M48 32.58L55.86 25' stroke='black' stroke-width='0.75' stroke-linecap='round' stroke-linejoin='round'/%3E%3Cpath d='M48.23 30.77L51.69 25.13L52.66 24L54.73 24.61L55.16 24.48L51.8 27.91L49.33 30.18L48 31.29L48.23 30.77Z' fill='black'/%3E%3Cpath d='M33.81 22L23 27.12' stroke='white' stroke-width='0.75' stroke-linecap='round' stroke-linejoin='round'/%3E%3Cpath d='M40.89 23L34 27.37' stroke='white' stroke-width='0.75' stroke-linecap='round' stroke-linejoin='round'/%3E%3Cpath d='M62.04 29L58 38.85' stroke='white' stroke-width='0.75' stroke-linecap='round' stroke-linejoin='round'/%3E%3Cpath d='M46.68 41C50.29 43.42 44.81 49.52 43 51.12' stroke='black' stroke-width='0.75' stroke-linecap='round' stroke-linejoin='round'/%3E%3Cpath d='M47.17 44C51.31 46.09 48.33 51.76 46 54.6' stroke='black' stroke-width='0.75' stroke-linecap='round' stroke-linejoin='round'/%3E%3Cpath d='M48.86 49C54.37 53.48 36.31 72.72 35 73.78' stroke='black' stroke-width='0.75' stroke-linecap='round' stroke-linejoin='round'/%3E%3Cmask id='mask0_11950_117175' style='mask-type:alpha' maskUnits='userSpaceOnUse' x='4' y='6' width='73' height='73'%3E%3Cpath d='M28.1632 6.00003C27.9554 5.99875 27.7493 6.03875 27.5571 6.11772C27.3648 6.19668 27.1902 6.31304 27.0432 6.46003L14.1332 19.38C7.645 25.8687 4 34.669 4 43.845C4 53.0211 7.645 61.8213 14.1332 68.31C17.3463 71.5242 21.1611 74.0738 25.3597 75.8134C29.5583 77.5529 34.0585 78.4482 38.6032 78.4482C43.1479 78.4482 47.6481 77.5529 51.8467 75.8134C56.0454 74.0738 59.8602 71.5242 63.0732 68.31L75.9832 55.4C76.1316 55.2536 76.2495 55.0792 76.3301 54.887C76.4108 54.6948 76.4526 54.4885 76.4532 54.28V6.89003C76.4506 6.65307 76.3546 6.42671 76.1861 6.26009C76.0176 6.09346 75.7902 6.00002 75.5532 6.00003H28.1632Z' fill='%2345DFA7'/%3E%3C/mask%3E%3Cg mask='url(%23mask0_11950_117175)'%3E%3Cpath d='M5 74.6871C7.49 72.3471 13.24 63.6871 14.52 61.2471C28.18 59.1271 34.71 71.2471 34.98 74.7671C32.7234 79.651 30.1305 84.3723 27.22 88.8971' fill='black'/%3E%3Cpath d='M5 74.6871C7.49 72.3471 13.24 63.6871 14.52 61.2471C28.18 59.1271 34.71 71.2471 34.98 74.7671C32.7234 79.651 30.1305 84.3723 27.22 88.8971' stroke='black' stroke-width='0.75' stroke-linecap='round' stroke-linejoin='round'/%3E%3C/g%3E%3C/svg%3E%0A")}`,
+    `.___SFeedbackForm_1l8mm_gg_{max-width:320px}.___SCancel_1l8mm_gg_,.___SSubmit_1l8mm_gg_{display:inline-flex;margin-right:var(--intergalactic-spacing-2x, 8px)}.___SNotice_1l8mm_gg_{padding:var(--intergalactic-spacing-3x, 12px) var(--intergalactic-spacing-4x, 16px);border-width:1px 0 0;border-top-style:solid;border-radius:0 0 var(--intergalactic-surface-rounded, calc(6px + 2px)) var(--intergalactic-surface-rounded, calc(6px + 2px))}.___SSuccess_1l8mm_gg_{display:flex;align-items:center;flex-direction:column;width:320px;padding:var(--intergalactic-spacing-10x, 40px);box-sizing:border-box;outline:0}.___SEmail_1l8mm_gg_{margin-bottom:calc(var(--intergalactic-spacing-4x, 16px));width:80px;height:80px;background-image:url("data:image/svg+xml,%3Csvg width='80' height='80' viewBox='0 0 80 80' fill='none' xmlns='http://www.w3.org/2000/svg'%3E%3Cpath d='M28.1632 6.00003C27.9554 5.99875 27.7493 6.03875 27.5571 6.11772C27.3648 6.19668 27.1902 6.31304 27.0432 6.46003L14.1332 19.38C7.645 25.8687 4 34.669 4 43.845C4 53.0211 7.645 61.8213 14.1332 68.31C17.3463 71.5242 21.1611 74.0738 25.3597 75.8134C29.5583 77.5529 34.0585 78.4482 38.6032 78.4482C43.1479 78.4482 47.6481 77.5529 51.8467 75.8134C56.0454 74.0738 59.8602 71.5242 63.0732 68.31L75.9832 55.4C76.1316 55.2536 76.2495 55.0792 76.3301 54.887C76.4108 54.6948 76.4526 54.4885 76.4532 54.28V6.89003C76.4506 6.65307 76.3546 6.42671 76.1861 6.26009C76.0176 6.09346 75.7902 6.00002 75.5532 6.00003H28.1632Z' fill='%2345E0A8'/%3E%3Cpath d='M29 45.2852L29.2 45.6352C35.39 42.1852 53.39 31.9652 56.73 35.1052C55.6 32.0052 39.7 35.4352 29 45.2852Z' fill='white'/%3E%3Cpath d='M28.44 31.6343C26.63 37.6343 19.23 56.1043 15 61.9443L18 62.8543L19.58 61.5343C23.8 51.9843 29.58 35.5343 29.89 30.0743C29.39 29.8143 28.93 30.2143 28.44 31.6343Z' fill='white'/%3E%3Cpath d='M15 62.0078C19.23 56.1678 26.63 37.7378 28.44 31.6678C30.25 25.5978 33.49 37.6678 31.67 42.7878' stroke='black' stroke-width='0.75' stroke-linecap='round' stroke-linejoin='round'/%3E%3Cpath d='M28 45.9424C38.68 35.5824 55.27 31.9424 56.43 35.1024C57.12 36.9924 43 41.3624 38.02 47.4224' stroke='black' stroke-width='0.75' stroke-linecap='round' stroke-linejoin='round'/%3E%3Cpath d='M44.45 21.93C41.21 20.77 35.86 19.04 33 18.24C37.12 16.41 70 4.24 72.67 3C71.75 7.11 67.75 21.28 65.96 27.93C61.13 26.25 56.23 24.78 53.03 23.74C51.0298 26.3907 49.2219 29.1812 47.62 32.09C46.44 28.23 45.29 23.77 44.45 21.93Z' fill='white' stroke='black' stroke-width='0.75' stroke-linecap='round' stroke-linejoin='round'/%3E%3Cpath d='M45 22.08L61.74 11' stroke='black' stroke-width='0.75' stroke-linecap='round' stroke-linejoin='round'/%3E%3Cpath d='M53 23.73L72.64 3' stroke='black' stroke-width='0.75' stroke-linecap='round' stroke-linejoin='round'/%3E%3Cpath d='M48 32.58L55.86 25' stroke='black' stroke-width='0.75' stroke-linecap='round' stroke-linejoin='round'/%3E%3Cpath d='M48.23 30.77L51.69 25.13L52.66 24L54.73 24.61L55.16 24.48L51.8 27.91L49.33 30.18L48 31.29L48.23 30.77Z' fill='black'/%3E%3Cpath d='M33.81 22L23 27.12' stroke='white' stroke-width='0.75' stroke-linecap='round' stroke-linejoin='round'/%3E%3Cpath d='M40.89 23L34 27.37' stroke='white' stroke-width='0.75' stroke-linecap='round' stroke-linejoin='round'/%3E%3Cpath d='M62.04 29L58 38.85' stroke='white' stroke-width='0.75' stroke-linecap='round' stroke-linejoin='round'/%3E%3Cpath d='M46.68 41C50.29 43.42 44.81 49.52 43 51.12' stroke='black' stroke-width='0.75' stroke-linecap='round' stroke-linejoin='round'/%3E%3Cpath d='M47.17 44C51.31 46.09 48.33 51.76 46 54.6' stroke='black' stroke-width='0.75' stroke-linecap='round' stroke-linejoin='round'/%3E%3Cpath d='M48.86 49C54.37 53.48 36.31 72.72 35 73.78' stroke='black' stroke-width='0.75' stroke-linecap='round' stroke-linejoin='round'/%3E%3Cmask id='mask0_11950_117175' style='mask-type:alpha' maskUnits='userSpaceOnUse' x='4' y='6' width='73' height='73'%3E%3Cpath d='M28.1632 6.00003C27.9554 5.99875 27.7493 6.03875 27.5571 6.11772C27.3648 6.19668 27.1902 6.31304 27.0432 6.46003L14.1332 19.38C7.645 25.8687 4 34.669 4 43.845C4 53.0211 7.645 61.8213 14.1332 68.31C17.3463 71.5242 21.1611 74.0738 25.3597 75.8134C29.5583 77.5529 34.0585 78.4482 38.6032 78.4482C43.1479 78.4482 47.6481 77.5529 51.8467 75.8134C56.0454 74.0738 59.8602 71.5242 63.0732 68.31L75.9832 55.4C76.1316 55.2536 76.2495 55.0792 76.3301 54.887C76.4108 54.6948 76.4526 54.4885 76.4532 54.28V6.89003C76.4506 6.65307 76.3546 6.42671 76.1861 6.26009C76.0176 6.09346 75.7902 6.00002 75.5532 6.00003H28.1632Z' fill='%2345DFA7'/%3E%3C/mask%3E%3Cg mask='url(%23mask0_11950_117175)'%3E%3Cpath d='M5 74.6871C7.49 72.3471 13.24 63.6871 14.52 61.2471C28.18 59.1271 34.71 71.2471 34.98 74.7671C32.7234 79.651 30.1305 84.3723 27.22 88.8971' fill='black'/%3E%3Cpath d='M5 74.6871C7.49 72.3471 13.24 63.6871 14.52 61.2471C28.18 59.1271 34.71 71.2471 34.98 74.7671C32.7234 79.651 30.1305 84.3723 27.22 88.8971' stroke='black' stroke-width='0.75' stroke-linecap='round' stroke-linejoin='round'/%3E%3C/g%3E%3C/svg%3E%0A")}`,
     /*__inner_css_end__*/
-    "z5f3m_gg_"
+    "1l8mm_gg_"
   ), /*__reshadow_css_end__*/
   {
-    "__SFeedbackForm": "___SFeedbackForm_z5f3m_gg_",
-    "__SSubmit": "___SSubmit_z5f3m_gg_",
-    "__SCancel": "___SCancel_z5f3m_gg_",
-    "__SNotice": "___SNotice_z5f3m_gg_",
-    "__SSuccess": "___SSuccess_z5f3m_gg_",
-    "__SEmail": "___SEmail_z5f3m_gg_"
+    "__SFeedbackForm": "___SFeedbackForm_1l8mm_gg_",
+    "__SSubmit": "___SSubmit_1l8mm_gg_",
+    "__SCancel": "___SCancel_1l8mm_gg_",
+    "__SNotice": "___SNotice_1l8mm_gg_",
+    "__SSuccess": "___SSuccess_1l8mm_gg_",
+    "__SEmail": "___SEmail_1l8mm_gg_"
   })
 );
-var FeedbackForm = /* @__PURE__ */ function(_Component) {
-  _inherits(FeedbackForm2, _Component);
-  var _super = _createSuper(FeedbackForm2);
+var FeedbackForm = /* @__PURE__ */ (function(_Component) {
   function FeedbackForm2() {
     var _this;
     _classCallCheck(this, FeedbackForm2);
     for (var _len = arguments.length, args = new Array(_len), _key = 0; _key < _len; _key++) {
       args[_key] = arguments[_key];
     }
-    _this = _super.call.apply(_super, [this].concat(args));
-    _defineProperty(_assertThisInitialized(_this), "focusDecorator", createFocusDecorator());
+    _this = _callSuper(this, FeedbackForm2, [].concat(args));
+    _defineProperty(_this, "focusDecorator", createFocusDecorator());
     return _this;
   }
-  _createClass(FeedbackForm2, [{
+  _inherits(FeedbackForm2, _Component);
+  return _createClass(FeedbackForm2, [{
     key: "getItemProps",
     value: function getItemProps() {
       var validateOnBlur = this.asProps.validateOnBlur;
@@ -67,7 +64,7 @@ var FeedbackForm = /* @__PURE__ */ function(_Component) {
         decorators: [this.focusDecorator]
       }, other), function(api) {
         var _ref4;
-        return _ref4 = sstyled$1(styles), /* @__PURE__ */ React.createElement(SpinContainer, _ref4.cn("SpinContainer", {
+        return _ref4 = sstyled(styles), /* @__PURE__ */ React.createElement(SpinContainer, _ref4.cn("SpinContainer", {
           "background": background,
           "theme": theme,
           "size": "xl",
@@ -83,8 +80,7 @@ var FeedbackForm = /* @__PURE__ */ function(_Component) {
       });
     }
   }]);
-  return FeedbackForm2;
-}(Component);
+})(Component);
 _defineProperty(FeedbackForm, "displayName", "FeedbackForm");
 _defineProperty(FeedbackForm, "style", style);
 _defineProperty(FeedbackForm, "FinalForm", {
@@ -120,7 +116,7 @@ function Success(props) {
   var Children = props.Children, styles = props.styles;
   var SSuccess = Box;
   var SEmail = "div";
-  return _ref5 = sstyled$1(styles), /* @__PURE__ */ React.createElement(SSuccess, _ref5.cn("SSuccess", _objectSpread({}, assignProps({
+  return _ref5 = sstyled(styles), /* @__PURE__ */ React.createElement(SSuccess, _ref5.cn("SSuccess", _objectSpread({}, assignProps({
     "tabIndex": -1
   }, _ref))), /* @__PURE__ */ React.createElement(SEmail, _ref5.cn("SEmail", {
     "aria-hidden": true
@@ -131,7 +127,7 @@ function Cancel(props) {
   var _ref2 = arguments[0], _ref6;
   var styles = props.styles;
   var SCancel = Button;
-  return _ref6 = sstyled$1(styles), /* @__PURE__ */ React.createElement(SCancel, _ref6.cn("SCancel", _objectSpread({}, assignProps({
+  return _ref6 = sstyled(styles), /* @__PURE__ */ React.createElement(SCancel, _ref6.cn("SCancel", _objectSpread({}, assignProps({
     "type": "reset",
     "use": "secondary",
     "theme": "muted"
@@ -141,12 +137,12 @@ function Notice(props) {
   var _ref3 = arguments[0], _ref7;
   var styles = props.styles, _props$theme = props.theme, theme = _props$theme === void 0 ? "muted" : _props$theme, _props$use = props.use, use = _props$use === void 0 ? "secondary" : _props$use;
   var SNotice = NoticeSmart;
-  return _ref7 = sstyled$1(styles), /* @__PURE__ */ React.createElement(SNotice, _ref7.cn("SNotice", _objectSpread({}, assignProps({
+  return _ref7 = sstyled(styles), /* @__PURE__ */ React.createElement(SNotice, _ref7.cn("SNotice", _objectSpread({}, assignProps({
     "use:theme": theme,
     "use:use": use
   }, _ref3))));
 }
-const FeedbackForm$1 = createComponent(FeedbackForm, {
+const FeedbackForm_default = createComponent(FeedbackForm, {
   Item: FeedbackItem,
   Success,
   Submit: SubmitButton,
@@ -154,5 +150,5 @@ const FeedbackForm$1 = createComponent(FeedbackForm, {
   Notice
 });
 export {
-  FeedbackForm$1 as default
+  FeedbackForm_default as default
 };

package/lib/esm/component/checkbox-button/CheckboxButton.mjs

@@ -2,57 +2,69 @@ import _objectSpread from "@babel/runtime/helpers/esm/objectSpread2";
 import _objectWithoutProperties from "@babel/runtime/helpers/esm/objectWithoutProperties";
 import _classCallCheck from "@babel/runtime/helpers/esm/classCallCheck";
 import _createClass from "@babel/runtime/helpers/esm/createClass";
+import _callSuper from "@babel/runtime/helpers/esm/callSuper";
 import _inherits from "@babel/runtime/helpers/esm/inherits";
-import _createSuper from "@babel/runtime/helpers/esm/createSuper";
 import _defineProperty from "@babel/runtime/helpers/esm/defineProperty";
-import { sstyled } from "@semcore/utils/lib/core/index";
-import createComponent, { sstyled as sstyled$1, assignProps, Component } from "@semcore/core";
-import React from "react";
-import { Box } from "@semcore/flex-box";
+import { sstyled, assignProps, Component, createComponent } from "@semcore/core";
+import { Box } from "@semcore/base-components";
 import Checkbox from "@semcore/checkbox";
+import React from "react";
 var _excluded = ["styles", "id", "label", "type", "focused"];
 /*!__reshadow-styles__:"../../style/checkbox-button.shadow.css"*/
 var style = (
   /*__reshadow_css_start__*/
   (sstyled.insert(
     /*__inner_css_start__*/
-    ".___SCheckboxButton_ly07f_gg_{margin-top:var(--intergalactic-spacing-2x, 8px);border:1px solid var(--intergalactic-border-primary, #c4c7cf);border-radius:var(--intergalactic-rounded-medium, 6px)}.___SCheckboxButton_ly07f_gg_ label{width:100%;padding:var(--intergalactic-spacing-3x, 12px);box-sizing:border-box}.___SCheckboxButton_ly07f_gg_.__checked_ly07f_gg_{cursor:pointer;border-color:var(--intergalactic-border-info-active, #006dca);background-color:rgba(0,143,248,.1)}@media (hover:hover){.___SCheckboxButton_ly07f_gg_:hover{cursor:pointer;border-color:var(--intergalactic-border-info-active, #006dca);background-color:rgba(0,143,248,.1)}.___SCheckboxButton_ly07f_gg_.__checked_ly07f_gg_:hover{background-color:rgba(0,143,248,.2)}}",
+    ".___SCheckboxButton_hai4d_gg_{margin-top:var(--intergalactic-spacing-2x, 8px);border:1px solid var(--intergalactic-border-primary, rgba(0, 12, 8, 0.161));border-radius:var(--intergalactic-rounded-medium, 6px)}@supports (color:color(display-p3 0 0 0%)){.___SCheckboxButton_hai4d_gg_{border:1px solid var(--intergalactic-border-primary, rgba(0, 12, 8, 0.161))}@media (color-gamut:p3){.___SCheckboxButton_hai4d_gg_{border:1px solid var(--intergalactic-border-primary, color(display-p3 0.00798 0.04498 0.03219 / 0.161))}}}.___SCheckboxButton_hai4d_gg_ label{width:100%;padding:var(--intergalactic-spacing-3x, 12px);box-sizing:border-box}.___SCheckboxButton_hai4d_gg_.__checked_hai4d_gg_{cursor:pointer;border-color:var(--intergalactic-border-info-active, rgba(0, 22, 195, 0.386));background-color:rgba(0,143,248,.1)}@supports (color:color(display-p3 0 0 0%)){.___SCheckboxButton_hai4d_gg_.__checked_hai4d_gg_{border-color:var(--intergalactic-border-info-active, rgba(0, 22, 195, 0.386))}@media (color-gamut:p3){.___SCheckboxButton_hai4d_gg_.__checked_hai4d_gg_{border-color:var(--intergalactic-border-info-active, color(display-p3 0.01805 0.08334 0.73488 / 0.386))}}}@media (hover:hover){.___SCheckboxButton_hai4d_gg_:hover{cursor:pointer;border-color:var(--intergalactic-border-info-active, rgba(0, 22, 195, 0.386));background-color:rgba(0,143,248,.1)}@supports (color:color(display-p3 0 0 0%)){.___SCheckboxButton_hai4d_gg_:hover{border-color:var(--intergalactic-border-info-active, rgba(0, 22, 195, 0.386))}@media (color-gamut:p3){.___SCheckboxButton_hai4d_gg_:hover{border-color:var(--intergalactic-border-info-active, color(display-p3 0.01805 0.08334 0.73488 / 0.386))}}}.___SCheckboxButton_hai4d_gg_.__checked_hai4d_gg_:hover{background-color:rgba(0,143,248,.2)}}",
     /*__inner_css_end__*/
-    "ly07f_gg_"
+    "hai4d_gg_"
   ), /*__reshadow_css_end__*/
   {
-    "__SCheckboxButton": "___SCheckboxButton_ly07f_gg_",
-    "_checked": "__checked_ly07f_gg_"
+    "__SCheckboxButton": "___SCheckboxButton_hai4d_gg_",
+    "_checked": "__checked_hai4d_gg_"
   })
 );
-var CheckboxButtonRoot = /* @__PURE__ */ function(_Component) {
-  _inherits(CheckboxButtonRoot2, _Component);
-  var _super = _createSuper(CheckboxButtonRoot2);
+var CheckboxButtonRoot = /* @__PURE__ */ (function(_Component) {
   function CheckboxButtonRoot2() {
+    var _this;
     _classCallCheck(this, CheckboxButtonRoot2);
-    return _super.apply(this, arguments);
+    for (var _len = arguments.length, args = new Array(_len), _key = 0; _key < _len; _key++) {
+      args[_key] = arguments[_key];
+    }
+    _this = _callSuper(this, CheckboxButtonRoot2, [].concat(args));
+    _defineProperty(_this, "checkboxRef", /* @__PURE__ */ React.createRef());
+    return _this;
   }
-  _createClass(CheckboxButtonRoot2, [{
+  _inherits(CheckboxButtonRoot2, _Component);
+  return _createClass(CheckboxButtonRoot2, [{
+    key: "componentDidMount",
+    value: function componentDidMount() {
+      var _this2 = this;
+      var focused = this.asProps.focused;
+      if (focused) {
+        setTimeout(function() {
+          var _this2$checkboxRef$cu;
+          (_this2$checkboxRef$cu = _this2.checkboxRef.current) === null || _this2$checkboxRef$cu === void 0 || _this2$checkboxRef$cu.focus();
+        }, 20);
+      }
+    }
+  }, {
     key: "render",
     value: function render() {
       var _ref = this.asProps, _ref2;
-      var _this$asProps = this.asProps, styles = _this$asProps.styles, id = _this$asProps.id, label = _this$asProps.label;
-      _this$asProps.type;
-      var focused = _this$asProps.focused, other = _objectWithoutProperties(_this$asProps, _excluded);
-      var autoFocus = focused ? 20 : false;
+      var _this$asProps = this.asProps, styles = _this$asProps.styles, id = _this$asProps.id, label = _this$asProps.label, _type = _this$asProps.type, focused = _this$asProps.focused, other = _objectWithoutProperties(_this$asProps, _excluded);
       var SCheckboxButton = Box;
-      return _ref2 = sstyled$1(styles), /* @__PURE__ */ React.createElement(SCheckboxButton, _ref2.cn("SCheckboxButton", _objectSpread({}, assignProps({
+      return _ref2 = sstyled(styles), /* @__PURE__ */ React.createElement(SCheckboxButton, _ref2.cn("SCheckboxButton", _objectSpread({}, assignProps({
         "__excludeProps": ["onChange", "id", "type"]
       }, _ref))), /* @__PURE__ */ React.createElement(Checkbox, _ref2.cn("Checkbox", _objectSpread({}, other)), /* @__PURE__ */ React.createElement(Checkbox.Value, {
-        autoFocus,
+        ref: this.checkboxRef,
         "aria-labelledby": id
       }), /* @__PURE__ */ React.createElement(Checkbox.Text, {
         id
       }, label)));
     }
   }]);
-  return CheckboxButtonRoot2;
-}(Component);
+})(Component);
 _defineProperty(CheckboxButtonRoot, "style", style);
 var CheckboxButton = createComponent(CheckboxButtonRoot);
 export {

package/lib/esm/component/feedback-item/FeedbackItem.mjs

@@ -1,13 +1,13 @@
 import _extends from "@babel/runtime/helpers/esm/extends";
 import _objectSpread from "@babel/runtime/helpers/esm/objectSpread2";
 import _objectWithoutProperties from "@babel/runtime/helpers/esm/objectWithoutProperties";
+import { assignProps } from "@semcore/core";
+import pick from "@semcore/core/lib/utils/pick";
+import propsForElement from "@semcore/core/lib/utils/propsForElement";
+import uniqueIDEnhancement from "@semcore/core/lib/utils/uniqueID";
+import Tooltip from "@semcore/tooltip";
 import React from "react";
 import { Field } from "react-final-form";
-import Tooltip from "@semcore/tooltip";
-import pick from "@semcore/utils/lib/pick";
-import uniqueIDEnhancement from "@semcore/utils/lib/uniqueID";
-import { assignProps } from "@semcore/utils/lib/core";
-import propsForElement from "@semcore/utils/lib/propsForElement";
 var _excluded = ["Children", "tag", "uid", "tooltipProps"], _excluded2 = ["input", "meta"];
 var deafultTooltipPropsList = ["title", "theme", "strategy", "modifiers", "placement", "interaction", "timeout", "visible", "defaultVisible", "onVisibleChange", "offset", "preventOverflow", "arrow", "flip", "computeStyles", "eventListeners", "onFirstUpdate"];
 function FeedbackItem(_ref) {
@@ -23,7 +23,7 @@ function FeedbackItem(_ref) {
     var popperId = "".concat(uid, "-error-description");
     var ariaDescribedBy = props["aria-describedby"];
     var inputProps = assignProps(_objectSpread(_objectSpread({}, propsForElement(other)), {}, {
-      state: errorState ? "invalid" : "normal",
+      "state": errorState ? "invalid" : "normal",
       "aria-invalid": errorState ? true : false,
       "aria-describedby": meta.active ? errorState ? popperId : ariaDescribedBy : void 0
     }), input);

package/lib/esm/component/feedback-rating/FeedbackRating.mjs

@@ -3,77 +3,74 @@ import _objectWithoutProperties from "@babel/runtime/helpers/esm/objectWithoutPr
 import _extends from "@babel/runtime/helpers/esm/extends";
 import _classCallCheck from "@babel/runtime/helpers/esm/classCallCheck";
 import _createClass from "@babel/runtime/helpers/esm/createClass";
-import _assertThisInitialized from "@babel/runtime/helpers/esm/assertThisInitialized";
+import _callSuper from "@babel/runtime/helpers/esm/callSuper";
 import _inherits from "@babel/runtime/helpers/esm/inherits";
-import _createSuper from "@babel/runtime/helpers/esm/createSuper";
 import _defineProperty from "@babel/runtime/helpers/esm/defineProperty";
-import { sstyled } from "@semcore/utils/lib/core/index";
-import createComponent, { sstyled as sstyled$1, assignProps, Component } from "@semcore/core";
-import React from "react";
-import { Field, Form } from "react-final-form";
-import createFocusDecorator from "final-form-focus";
-import SpinContainer from "@semcore/spin-container";
-import i18nEnhance from "@semcore/utils/lib/enhances/i18nEnhance";
-import uniqueIDEnhancement from "@semcore/utils/lib/uniqueID";
-import Notice from "@semcore/notice";
+import { sstyled, assignProps, Component, createComponent } from "@semcore/core";
+import { Flex, Box } from "@semcore/base-components";
+import i18nEnhance from "@semcore/core/lib/utils/enhances/i18nEnhance";
+import uniqueIDEnhancement from "@semcore/core/lib/utils/uniqueID";
 import CheckM from "@semcore/icon/Check/m";
 import WarnM from "@semcore/icon/Warning/m";
-import { Text } from "@semcore/typography";
 import FeedbackIllustration from "@semcore/illustration/Feedback";
+import Input from "@semcore/input";
 import Link from "@semcore/link";
-import SliderRating from "../slider-rating/SliderRating.mjs";
 import Modal from "@semcore/modal";
+import SemcoreNotice from "@semcore/notice";
+import { NoticeBubbleManager, NoticeBubbleContainer } from "@semcore/notice-bubble";
+import SpinContainer from "@semcore/spin-container";
 import Textarea from "@semcore/textarea";
-import { Flex, Box } from "@semcore/flex-box";
+import { Text } from "@semcore/typography";
+import createFocusDecorator from "final-form-focus";
+import React from "react";
+import { Field, Form } from "react-final-form";
+import { localizedMessages } from "../../translations/__intergalactic-dynamic-locales.mjs";
+import CheckboxButton from "../checkbox-button/CheckboxButton.mjs";
 import { FeedbackItem } from "../feedback-item/FeedbackItem.mjs";
+import SliderRating from "../slider-rating/SliderRating.mjs";
 import { SubmitButton } from "../submit-button/SubmitButton.mjs";
-import CheckboxButton from "../checkbox-button/CheckboxButton.mjs";
-import Input from "@semcore/input";
-import { localizedMessages } from "../../translations/__intergalactic-dynamic-locales.mjs";
-import { NoticeBubbleManager, NoticeBubbleContainer } from "@semcore/notice-bubble";
-var _excluded = ["header", "submitText", "formConfig", "notificationText", "notificationTitle", "learnMoreLink", "Children", "styles", "forwardRef", "status", "theme", "background", "rating", "visible", "onVisibleChange", "notificationVisible", "onNotificationClose", "getI18nText", "errorFeedbackEmail", "modalWidth"];
+var _excluded = ["header", "submitText", "formConfig", "notificationText", "notificationTitle", "learnMoreLink", "Children", "styles", "forwardRef", "status", "theme", "background", "rating", "visible", "onVisibleChange", "notificationVisible", "onNotificationClose", "getI18nText", "errorFeedbackEmail", "modalWidth", "Illustration", "Notice"];
 /*!__reshadow-styles__:"../../style/feedback-rating.shadow.css"*/
 var style = (
   /*__reshadow_css_start__*/
   (sstyled.insert(
     /*__inner_css_start__*/
-    ".___SFeedbackRating_kxbac_gg_ ul{margin:0;padding:0;list-style:none}.___SFeedbackRating_kxbac_gg_ li{list-style:none}",
+    ".___SFeedbackRating_13l9c_gg_ ul{margin:0;padding:0;list-style:none}.___SFeedbackRating_13l9c_gg_ li{list-style:none}.___SFeedbackRating_13l9c_gg_ .___SHeader_13l9c_gg_{font-size:var(--intergalactic-fs-300, 16px);line-height:var(--intergalactic-lh-300, 150%);font-weight:var(--intergalactic-bold, 700);margin:var(--intergalactic-spacing-4x, 16px)0;text-align:center}",
     /*__inner_css_end__*/
-    "kxbac_gg_"
+    "13l9c_gg_"
   ), /*__reshadow_css_end__*/
   {
-    "__SFeedbackRating": "___SFeedbackRating_kxbac_gg_"
+    "__SFeedbackRating": "___SFeedbackRating_13l9c_gg_",
+    "__SHeader": "___SHeader_13l9c_gg_"
   })
 );
-var FeedbackRatingRoot = /* @__PURE__ */ function(_Component) {
-  _inherits(FeedbackRatingRoot2, _Component);
-  var _super = _createSuper(FeedbackRatingRoot2);
+var FeedbackRatingRoot = /* @__PURE__ */ (function(_Component) {
   function FeedbackRatingRoot2() {
     var _this;
     _classCallCheck(this, FeedbackRatingRoot2);
     for (var _len = arguments.length, args = new Array(_len), _key = 0; _key < _len; _key++) {
       args[_key] = arguments[_key];
     }
-    _this = _super.call.apply(_super, [this].concat(args));
-    _defineProperty(_assertThisInitialized(_this), "state", {
+    _this = _callSuper(this, FeedbackRatingRoot2, [].concat(args));
+    _defineProperty(_this, "state", {
       error: false
     });
-    _defineProperty(_assertThisInitialized(_this), "manager", new NoticeBubbleManager());
-    _defineProperty(_assertThisInitialized(_this), "focusDecorator", createFocusDecorator());
-    _defineProperty(_assertThisInitialized(_this), "handleChangeRating", function(rating) {
+    _defineProperty(_this, "manager", new NoticeBubbleManager());
+    _defineProperty(_this, "focusDecorator", createFocusDecorator());
+    _defineProperty(_this, "handleChangeRating", function(rating) {
       if (rating > 0) {
         _this.asProps.onVisibleChange(true, rating);
       }
     });
-    _defineProperty(_assertThisInitialized(_this), "handelCloseModal", function() {
+    _defineProperty(_this, "handelCloseModal", function() {
       _this.asProps.onVisibleChange(false, _this.asProps.rating);
     });
-    _defineProperty(_assertThisInitialized(_this), "handleChange", function(fn) {
-      return function(value, e) {
+    _defineProperty(_this, "handleChange", function(fn) {
+      return function(_value, e) {
         fn(e);
       };
     });
-    _defineProperty(_assertThisInitialized(_this), "renderCheckbox", function(config, index) {
+    _defineProperty(_this, "renderCheckbox", function(config, index) {
       var initialValue = _this.props.initialValues[config.key];
       return /* @__PURE__ */ React.createElement(Field, {
         name: config.key,
@@ -92,7 +89,7 @@ var FeedbackRatingRoot = /* @__PURE__ */ function(_Component) {
         }));
       });
     });
-    _defineProperty(_assertThisInitialized(_this), "renderTextField", function(config) {
+    _defineProperty(_this, "renderTextField", function(config) {
       var _config$description;
       var initialValue = _this.props.initialValues[config.key];
       var label = typeof config.label === "string" ? /* @__PURE__ */ React.createElement(Text, {
@@ -101,12 +98,12 @@ var FeedbackRatingRoot = /* @__PURE__ */ function(_Component) {
       }, config.label) : config.label;
       var isDescriptionReactFragment = ((_config$description = config.description) === null || _config$description === void 0 ? void 0 : _config$description.type) === React.Fragment;
       return /* @__PURE__ */ React.createElement(Flex, {
+        key: config.key,
         direction: "column"
       }, /* @__PURE__ */ React.createElement(Flex, {
         tag: "label",
         mt: 4,
-        htmlFor: config.key,
-        key: config.key
+        htmlFor: config.key
       }, label), /* @__PURE__ */ React.createElement(FeedbackRating.Item, {
         name: config.key,
         validate: config.validate,
@@ -148,7 +145,8 @@ var FeedbackRatingRoot = /* @__PURE__ */ function(_Component) {
     });
     return _this;
   }
-  _createClass(FeedbackRatingRoot2, [{
+  _inherits(FeedbackRatingRoot2, _Component);
+  return _createClass(FeedbackRatingRoot2, [{
     key: "headerId",
     get: function get() {
       var uid = this.asProps.uid;
@@ -206,11 +204,7 @@ var FeedbackRatingRoot = /* @__PURE__ */ function(_Component) {
     key: "render",
     value: function render() {
       var _ref = this.asProps, _ref2 = this.asProps, _ref4, _this3 = this;
-      var _this$asProps2 = this.asProps, header = _this$asProps2.header, submitText = _this$asProps2.submitText, formConfig = _this$asProps2.formConfig, notificationText = _this$asProps2.notificationText, notificationTitle = _this$asProps2.notificationTitle, learnMoreLink = _this$asProps2.learnMoreLink;
-      _this$asProps2.Children;
-      var styles = _this$asProps2.styles, forwardRef = _this$asProps2.forwardRef, status = _this$asProps2.status, theme = _this$asProps2.theme, background = _this$asProps2.background, rating = _this$asProps2.rating, visible = _this$asProps2.visible;
-      _this$asProps2.onVisibleChange;
-      var notificationVisible = _this$asProps2.notificationVisible, onNotificationClose = _this$asProps2.onNotificationClose, getI18nText = _this$asProps2.getI18nText, errorFeedbackEmail = _this$asProps2.errorFeedbackEmail, modalWidth = _this$asProps2.modalWidth, other = _objectWithoutProperties(_this$asProps2, _excluded);
+      var _this$asProps2 = this.asProps, header = _this$asProps2.header, submitText = _this$asProps2.submitText, formConfig = _this$asProps2.formConfig, notificationText = _this$asProps2.notificationText, notificationTitle = _this$asProps2.notificationTitle, learnMoreLink = _this$asProps2.learnMoreLink, _Children = _this$asProps2.Children, styles = _this$asProps2.styles, forwardRef = _this$asProps2.forwardRef, status = _this$asProps2.status, theme = _this$asProps2.theme, background = _this$asProps2.background, rating = _this$asProps2.rating, visible = _this$asProps2.visible, _onVisibleChange = _this$asProps2.onVisibleChange, notificationVisible = _this$asProps2.notificationVisible, onNotificationClose = _this$asProps2.onNotificationClose, getI18nText = _this$asProps2.getI18nText, errorFeedbackEmail = _this$asProps2.errorFeedbackEmail, modalWidth = _this$asProps2.modalWidth, Illustration = _this$asProps2.Illustration, NoticeComponent = _this$asProps2.Notice, other = _objectWithoutProperties(_this$asProps2, _excluded);
       var SFeedbackRating = Modal;
       var checkboxFields = formConfig.filter(function(item) {
         return item.type === "checkbox";
@@ -219,30 +213,29 @@ var FeedbackRatingRoot = /* @__PURE__ */ function(_Component) {
         return item.type === "textarea" || item.type === "input" || item.type === "email";
       });
       var notificationId = this.getNoticeTextId();
-      return _ref4 = sstyled$1(styles), /* @__PURE__ */ React.createElement(Box, assignProps({}, _ref2), /* @__PURE__ */ React.createElement(Notice, _ref4.cn("Notice", {
+      return _ref4 = sstyled(styles), /* @__PURE__ */ React.createElement(Box, assignProps({}, _ref2), /* @__PURE__ */ React.createElement(NoticeComponent, _ref4.cn("NoticeComponent", {
         "visible": notificationVisible,
         "aria-label": getI18nText("leaveFeedback"),
         "tag": Flex,
         "alignItems": notificationTitle ? "flex-start" : "center"
-      }), /* @__PURE__ */ React.createElement(Notice.Label, {
+      }), /* @__PURE__ */ React.createElement(NoticeComponent.Label, {
         mr: 3,
         "aria-hidden": true
-      }, /* @__PURE__ */ React.createElement(FeedbackIllustration, _ref4.cn("FeedbackIllustration", {}))), /* @__PURE__ */ React.createElement(Notice.Content, null, notificationTitle ? /* @__PURE__ */ React.createElement(Notice.Title, null, notificationTitle) : null, /* @__PURE__ */ React.createElement(Notice.Text, {
+      }, /* @__PURE__ */ React.createElement(Illustration, _ref4.cn("Illustration", {}))), /* @__PURE__ */ React.createElement(NoticeComponent.Content, null, notificationTitle ? /* @__PURE__ */ React.createElement(NoticeComponent.Title, null, notificationTitle) : null, /* @__PURE__ */ React.createElement(NoticeComponent.Text, {
+        gap: 3,
         tag: Flex,
         alignItems: notificationTitle ? "flex-start" : "center"
       }, /* @__PURE__ */ React.createElement(Text, _ref4.cn("Text", {
-        "mr": 3,
         "id": notificationId
-      }), notificationText), /* @__PURE__ */ React.createElement(Notice.Actions, {
+      }), notificationText), /* @__PURE__ */ React.createElement(NoticeComponent.Actions, {
         mt: 0
       }, /* @__PURE__ */ React.createElement(SliderRating, _ref4.cn("SliderRating", {
         "value": rating,
         "onChange": this.handleChangeRating,
         "aria-labelledby": notificationId
       }))), learnMoreLink && /* @__PURE__ */ React.createElement(Link, _ref4.cn("Link", {
-        "ml": 3,
         "href": learnMoreLink
-      }), getI18nText("learnMore")))), /* @__PURE__ */ React.createElement(Notice.Close, {
+      }), getI18nText("learnMore")))), /* @__PURE__ */ React.createElement(NoticeComponent.Close, {
         onClick: onNotificationClose
       })), /* @__PURE__ */ React.createElement(SFeedbackRating, _ref4.cn("SFeedbackRating", _objectSpread({}, assignProps({
         "visible": visible,
@@ -254,7 +247,7 @@ var FeedbackRatingRoot = /* @__PURE__ */ function(_Component) {
         "decorators": [this.focusDecorator]
       }, other)), function(api) {
         var _ref5;
-        return _ref5 = sstyled$1(styles), /* @__PURE__ */ React.createElement(SpinContainer, _ref5.cn("SpinContainer", {
+        return _ref5 = sstyled(styles), /* @__PURE__ */ React.createElement(SpinContainer, _ref5.cn("SpinContainer", {
           "background": background,
           "theme": theme,
           "size": "xl",
@@ -288,11 +281,11 @@ var FeedbackRatingRoot = /* @__PURE__ */ function(_Component) {
           return _this3.renderCheckbox(formConfigItem, index);
         })), textFields.map(function(formConfigItem) {
           return _this3.renderTextField(formConfigItem);
-        }), _this3.state.error && /* @__PURE__ */ React.createElement(Notice, _ref5.cn("Notice", {
+        }), _this3.state.error && /* @__PURE__ */ React.createElement(SemcoreNotice, _ref5.cn("SemcoreNotice", {
           "theme": "warning",
           "mt": 4,
           "mb": 4
-        }), /* @__PURE__ */ React.createElement(Notice.Label, null, /* @__PURE__ */ React.createElement(WarnM, _ref5.cn("WarnM", {}))), /* @__PURE__ */ React.createElement(Notice.Content, null, getI18nText("errorMessage", {
+        }), /* @__PURE__ */ React.createElement(SemcoreNotice.Label, null, /* @__PURE__ */ React.createElement(WarnM, _ref5.cn("WarnM", {}))), /* @__PURE__ */ React.createElement(SemcoreNotice.Content, null, getI18nText("errorMessage", {
           // todo: Brauer Ilia - think how to fix type
           // @ts-ignore
           email: /* @__PURE__ */ React.createElement(Link, _ref5.cn("Link", {
@@ -310,8 +303,7 @@ var FeedbackRatingRoot = /* @__PURE__ */ function(_Component) {
       })));
     }
   }]);
-  return FeedbackRatingRoot2;
-}(Component);
+})(Component);
 _defineProperty(FeedbackRatingRoot, "displayName", "FeedbackRatingForm");
 _defineProperty(FeedbackRatingRoot, "style", style);
 _defineProperty(FeedbackRatingRoot, "enhance", [i18nEnhance(localizedMessages), uniqueIDEnhancement()]);
@@ -319,7 +311,9 @@ _defineProperty(FeedbackRatingRoot, "defaultProps", {
   onSubmit: function onSubmit() {
   },
   i18n: localizedMessages,
-  locale: "en"
+  locale: "en",
+  Illustration: FeedbackIllustration,
+  Notice: SemcoreNotice
 });
 _defineProperty(FeedbackRatingRoot, "validate", {
   description: function description(error) {
@@ -344,14 +338,8 @@ _defineProperty(FeedbackRatingRoot, "validate", {
 function Header(props) {
   var _ref3 = arguments[0], _ref6;
   var styles = props.styles;
-  var SHeader = Text;
-  return _ref6 = sstyled$1(styles), /* @__PURE__ */ React.createElement(SHeader, _ref6.cn("SHeader", _objectSpread({}, assignProps({
-    "size": 300,
-    "tag": "h2",
-    "mb": 4,
-    "mt": 4,
-    "textAlign": "center"
-  }, _ref3))));
+  var SHeader = Modal.Title;
+  return _ref6 = sstyled(styles), /* @__PURE__ */ React.createElement(SHeader, _ref6.cn("SHeader", _objectSpread({}, assignProps({}, _ref3))));
 }
 var FeedbackRating = createComponent(FeedbackRatingRoot, {
   Header,