@taikai/rocket-kit 3.0.1 → 3.0.3

package/dist/rocket-kit.esm.js

@@ -918,7 +918,7 @@ const Icon = props => {
 const LabelStyle = /*#__PURE__*/_styled.label.withConfig({
   displayName: "styles__LabelStyle",
   componentId: "sc-pbv9we-0"
-})(["display:flex;align-items:center;font-size:", ";font-weight:", ";color:", ";svg{margin-left:", ";width:auto;height:", ";}"], typography.fontSizeXs, typography.semiBold, colors.grey200, /*#__PURE__*/rem('5px'), /*#__PURE__*/rem('16px'));
+})(["display:flex;align-items:center;font-size:", ";font-weight:", ";color:", ";svg{margin-left:", ";width:auto;height:", ";}"], typography.fontSizeXs, typography.semiBold, colors.grey500, /*#__PURE__*/rem('5px'), /*#__PURE__*/rem('16px'));
 
 const Label = props => {
   const {
@@ -1903,7 +1903,9 @@ const VideoPlayer = props => {
     controls = false,
     width = '100%',
     height = '100%',
-    onEnded
+    onEnded,
+    onReady,
+    onError
   } = props;
   return /*#__PURE__*/React.createElement(Wrapper$4, null, /*#__PURE__*/React.createElement(ReactPlayer, {
     style: {
@@ -1917,7 +1919,9 @@ const VideoPlayer = props => {
     controls: controls,
     width: width,
     height: height,
-    onEnded: onEnded
+    onEnded: onEnded,
+    onReady: onReady,
+    onError: onError
   }));
 };
 
@@ -2823,7 +2827,7 @@ const TableDnD = props => {
 const Wrapper$8 = /*#__PURE__*/_styled.div.withConfig({
   displayName: "styles__Wrapper",
   componentId: "sc-mbja2a-0"
-})(["display:inline-block;> label{margin-bottom:", ";color:", ";span{color:", ";}}&:not(:last-child){margin-bottom:", ";}"], /*#__PURE__*/rem('5px'), props => props.error ? field.errorBorderColor : colors.grey200, props => props.error ? field.errorBorderColor : field.color, /*#__PURE__*/rem('15px'));
+})(["display:inline-block;> label{margin-bottom:", ";color:", ";span{color:", ";}}&:not(:last-child){margin-bottom:", ";}"], /*#__PURE__*/rem('5px'), props => props.error ? field.errorBorderColor : colors.grey500, props => props.error ? field.errorBorderColor : field.color, /*#__PURE__*/rem('15px'));
 
 const FormGroup = props => {
   const {
@@ -5344,27 +5348,54 @@ const FieldWidthButton = props => {
     name,
     placeholder,
     value,
+    onChange,
     dataTestId,
     buttonIcon,
     buttonValue,
     buttonAction,
-    buttonDisabled
+    buttonDisabled,
+    disabled = true
   } = props;
+  const [loading, setLoading] = useState(false);
+  const [fieldValue, setFieldValue] = useState(value != null ? value : null);
+  const handleOnClickAction = async () => {
+    if ((buttonAction == null ? void 0 : buttonAction.constructor.name) !== 'AsyncFunction') {
+      buttonAction == null ? void 0 : buttonAction(fieldValue);
+      return;
+    }
+    setLoading(true);
+    await (buttonAction == null ? void 0 : buttonAction(fieldValue));
+    setLoading(false);
+  };
   return /*#__PURE__*/React.createElement(Wrapper$e, null, label && /*#__PURE__*/React.createElement(Label, {
     value: label
   }), /*#__PURE__*/React.createElement(Field, null, /*#__PURE__*/React.createElement(TextField, {
     type: type,
     name: name,
-    value: value,
+    disabled: disabled,
     placeholder: placeholder,
     dataTestId: dataTestId,
-    disabled: true
+    value: fieldValue != null ? fieldValue : undefined,
+    onChange: e => {
+      e.preventDefault();
+      if (e.target.value === '' || e.target.value === ' ') {
+        setFieldValue(null);
+        onChange == null ? void 0 : onChange(e.target.value);
+      } else {
+        setFieldValue(e.target.value);
+        onChange == null ? void 0 : onChange(e.target.value);
+      }
+    }
   }), /*#__PURE__*/React.createElement(Button, {
     color: "purple100",
+    loading: loading,
     icon: buttonIcon,
     value: buttonValue,
-    action: buttonAction,
-    disabled: buttonDisabled
+    disabled: buttonDisabled,
+    action: e => {
+      e.preventDefault();
+      handleOnClickAction();
+    }
   })));
 };