@matchain/matchid-sdk-react 0.1.13 → 0.1.15

This diff represents the content of publicly available package versions that have been released to one of the supported registries. The information contained in this diff is provided for informational purposes only and reflects changes between package versions as they appear in their respective public registries.
Files changed (8) hide show
  1. package/dist/index.css +9 -1
  2. package/dist/index.d.mts +4 -2
  3. package/dist/index.d.ts +4 -2
  4. package/dist/index.js +9 -4
  5. package/dist/index.js.map +1 -1
  6. package/dist/index.mjs +9 -4
  7. package/dist/index.mjs.map +1 -1
  8. package/package.json +1 -1
package/dist/index.css CHANGED
@@ -57,6 +57,7 @@ body {
57
57
  /**field component**/
58
58
  --matchid-field-color: var(--matchid-text-color);
59
59
  --matchid-field-error-color: var(--matchid-red-600);
60
+ --matchid-field-required-color:#E60808;
60
61
  /**button component**/
61
62
  --matchid-btn-border-color: var(--matchid-black);
62
63
  --matchid-btn-color: var(--matchid-black);
@@ -185,13 +186,16 @@ body {
185
186
  .matchid-modal-header {
186
187
  padding-bottom: 24px;
187
188
  margin-bottom: 24px;
188
- border-bottom: 1px solid var(--matchid-modal-header-border-color, #E3E3E3);
189
189
  height: 54px;
190
190
  display: flex;
191
191
  align-items: center;
192
192
  justify-content: space-between;
193
193
  }
194
194
 
195
+ .matchid-modal-header-border{
196
+ border-bottom: 1px solid var(--matchid-modal-header-border-color, #E3E3E3);
197
+ }
198
+
195
199
  .matchid-modal-header-content {
196
200
  display: flex;
197
201
  align-items: center;
@@ -272,6 +276,10 @@ body {
272
276
  font-weight: 600;
273
277
  }
274
278
 
279
+ .matchid-field-required{
280
+ color: var(--matchid-field-required-color);
281
+ }
282
+
275
283
  .matchid-field-error{
276
284
  font-size: 14px;
277
285
  font-weight: 600;
package/dist/index.d.mts CHANGED
@@ -50,6 +50,7 @@ type ModalWithHeaderProps = ModalProps & {
50
50
  onClose?: () => void,
51
51
  title?: string
52
52
  showClose?: boolean
53
+ showBorder?: boolean
53
54
  }
54
55
 
55
56
  type InputProps = {
@@ -158,9 +159,10 @@ declare const useMatch: () => MatchContextType;
158
159
 
159
160
  declare function EmailModal({ isOpen, width, onClose, onBack, onLogin }: EmailModalProps): react_jsx_runtime.JSX.Element;
160
161
 
161
- declare function Field({ label, children, error }: {
162
+ declare function Field({ label, children, error, required }: {
162
163
  label: ReactNode;
163
164
  error?: ReactNode;
165
+ required?: boolean;
164
166
  } & PropsWithChildren): react_jsx_runtime.JSX.Element;
165
167
 
166
168
  declare function Input({ onChange, type, after, ...props }: InputProps): react_jsx_runtime.JSX.Element;
@@ -170,7 +172,7 @@ declare function Button({ size, disabled, loading, children, onClick, highlight,
170
172
  declare function LoginBox({ methods, inModal }: LoginBoxProps): react_jsx_runtime.JSX.Element;
171
173
 
172
174
  declare function Modal({ children, isOpen, width }: ModalProps): react_jsx_runtime.JSX.Element;
173
- declare function ModalWithHeader({ children, onBack, onClose, title, showClose, ...props }: ModalWithHeaderProps): react_jsx_runtime.JSX.Element;
175
+ declare function ModalWithHeader({ children, onBack, onClose, title, showBorder, showClose, ...props }: ModalWithHeaderProps): react_jsx_runtime.JSX.Element;
174
176
 
175
177
  declare function LoginButton({ loginRender, methods, onLoginClick, ...props }: Omit<ButtonProps, 'onClick' | 'highlight'> & {
176
178
  loginRender?: () => JSX.Element;
package/dist/index.d.ts CHANGED
@@ -50,6 +50,7 @@ type ModalWithHeaderProps = ModalProps & {
50
50
  onClose?: () => void,
51
51
  title?: string
52
52
  showClose?: boolean
53
+ showBorder?: boolean
53
54
  }
54
55
 
55
56
  type InputProps = {
@@ -158,9 +159,10 @@ declare const useMatch: () => MatchContextType;
158
159
 
159
160
  declare function EmailModal({ isOpen, width, onClose, onBack, onLogin }: EmailModalProps): react_jsx_runtime.JSX.Element;
160
161
 
161
- declare function Field({ label, children, error }: {
162
+ declare function Field({ label, children, error, required }: {
162
163
  label: ReactNode;
163
164
  error?: ReactNode;
165
+ required?: boolean;
164
166
  } & PropsWithChildren): react_jsx_runtime.JSX.Element;
165
167
 
166
168
  declare function Input({ onChange, type, after, ...props }: InputProps): react_jsx_runtime.JSX.Element;
@@ -170,7 +172,7 @@ declare function Button({ size, disabled, loading, children, onClick, highlight,
170
172
  declare function LoginBox({ methods, inModal }: LoginBoxProps): react_jsx_runtime.JSX.Element;
171
173
 
172
174
  declare function Modal({ children, isOpen, width }: ModalProps): react_jsx_runtime.JSX.Element;
173
- declare function ModalWithHeader({ children, onBack, onClose, title, showClose, ...props }: ModalWithHeaderProps): react_jsx_runtime.JSX.Element;
175
+ declare function ModalWithHeader({ children, onBack, onClose, title, showBorder, showClose, ...props }: ModalWithHeaderProps): react_jsx_runtime.JSX.Element;
174
176
 
175
177
  declare function LoginButton({ loginRender, methods, onLoginClick, ...props }: Omit<ButtonProps, 'onClick' | 'highlight'> & {
176
178
  loginRender?: () => JSX.Element;
package/dist/index.js CHANGED
@@ -414,11 +414,12 @@ function ModalWithHeader({
414
414
  onBack,
415
415
  onClose,
416
416
  title,
417
+ showBorder = true,
417
418
  showClose = true,
418
419
  ...props
419
420
  }) {
420
421
  return /* @__PURE__ */ (0, import_jsx_runtime20.jsxs)(Modal, { ...props, children: [
421
- /* @__PURE__ */ (0, import_jsx_runtime20.jsxs)("div", { className: `matchid-modal-header`, children: [
422
+ /* @__PURE__ */ (0, import_jsx_runtime20.jsxs)("div", { className: `matchid-modal-header ${showBorder ? "matchid-modal-header-border" : ""}`, children: [
422
423
  /* @__PURE__ */ (0, import_jsx_runtime20.jsxs)("div", { className: "matchid-modal-header-content", children: [
423
424
  onBack && /* @__PURE__ */ (0, import_jsx_runtime20.jsx)(ArrowLeftIcon, { className: "matchid-modal-header-back", onClick: onBack }),
424
425
  /* @__PURE__ */ (0, import_jsx_runtime20.jsx)("span", { className: "matchid-modal-header-title", children: title })
@@ -461,10 +462,14 @@ var import_jsx_runtime22 = require("react/jsx-runtime");
461
462
  function Field({
462
463
  label,
463
464
  children,
464
- error
465
+ error,
466
+ required
465
467
  }) {
466
468
  return /* @__PURE__ */ (0, import_jsx_runtime22.jsxs)("div", { className: "matchid-field-box", children: [
467
- /* @__PURE__ */ (0, import_jsx_runtime22.jsx)("div", { className: "matchid-field-label", children: label }),
469
+ /* @__PURE__ */ (0, import_jsx_runtime22.jsxs)("div", { className: "matchid-field-label", children: [
470
+ required && /* @__PURE__ */ (0, import_jsx_runtime22.jsx)("span", { className: "matchid-field-required", children: "*" }),
471
+ label
472
+ ] }),
468
473
  children,
469
474
  error && /* @__PURE__ */ (0, import_jsx_runtime22.jsx)("div", { className: "matchid-field-error", children: error })
470
475
  ] });
@@ -1373,7 +1378,7 @@ function useWalletInit({
1373
1378
  console.error("not found iframe");
1374
1379
  return false;
1375
1380
  };
1376
- window.waitMatchUntilWalletMessage = async (method, data, timeout = 1e4) => {
1381
+ window.waitMatchUntilWalletMessage = async (method, data, timeout = 3e4) => {
1377
1382
  return new Promise((resolve, reject) => {
1378
1383
  const messageId = window.sendMatchWalletMessage(method, data);
1379
1384
  if (!messageId) {