chore: extract utils package

package.json

@@ -100,7 +100,9 @@
     "autoprefixer": "10.4.5",
     "typescript": "^5.1.6",
     "is-ipfs": "0.6.3",
-    "lerna": "5.5.1"
+    "lerna": "5.5.1",
+    "multiformats": "^9.9.0",
+    "ws": "^8.18.0"
   },
   "volta": {
     "node": "16.16.0",

packages/common/package.json

@@ -24,8 +24,7 @@
   },
   "homepage": "https://github.com/bosonprotocol/core-components/tree/main/packages/common#readme",
   "files": [
-    "dist/*",
-    "src/*"
+    "dist/*"
   ],
   "publishConfig": {
     "access": "public"

packages/core-sdk/package.json

@@ -28,8 +28,7 @@
   },
   "homepage": "https://github.com/bosonprotocol/core-components/tree/main/packages/contracts-sdk#readme",
   "files": [
-    "dist/*",
-    "src/*"
+    "dist/*"
   ],
   "publishConfig": {
     "access": "public"

packages/eth-connect-sdk/package.json

@@ -24,8 +24,7 @@
   },
   "homepage": "https://github.com/bosonprotocol/core-components/tree/main/packages/contracts-sdk#readme",
   "files": [
-    "dist/*",
-    "src/*"
+    "dist/*"
   ],
   "publishConfig": {
     "access": "public"

packages/ethers-sdk/package.json

@@ -25,8 +25,7 @@
   },
   "homepage": "https://github.com/bosonprotocol/core-components/tree/main/packages/contracts-sdk#readme",
   "files": [
-    "dist/*",
-    "src/*"
+    "dist/*"
   ],
   "publishConfig": {
     "access": "public"

packages/ipfs-storage/package.json

@@ -24,8 +24,7 @@
   },
   "homepage": "https://github.com/bosonprotocol/core-components/tree/main/packages/contracts-sdk#readme",
   "files": [
-    "dist/*",
-    "src/*"
+    "dist/*"
   ],
   "publishConfig": {
     "access": "public"
@@ -41,10 +40,11 @@
   "dependencies": {
     "@bosonprotocol/metadata-storage": "^1.0.1",
     "ipfs-http-client": "^56.0.1",
-    "multiformats": "^9.6.4",
+    "multiformats": "^9.9.0",
     "uint8arrays": "^3.0.0"
   },
   "overrides": {
-    "typescript": "^5.1.6"
+    "typescript": "^5.1.6",
+    "multiformats": "^9.9.0"
   }
 }

packages/metadata-storage/package.json

@@ -24,8 +24,7 @@
   },
   "homepage": "https://github.com/bosonprotocol/core-components/tree/main/packages/metadata#readme",
   "files": [
-    "dist/*",
-    "src/*"
+    "dist/*"
   ],
   "publishConfig": {
     "access": "public"

packages/metadata/package.json

@@ -24,8 +24,7 @@
   },
   "homepage": "https://github.com/bosonprotocol/core-components/tree/main/packages/metadata#readme",
   "files": [
-    "dist/*",
-    "src/*"
+    "dist/*"
   ],
   "publishConfig": {
     "access": "public"

packages/react-kit/package.json

@@ -5,9 +5,15 @@
   "main": "./dist/cjs/index.js",
   "module": "./dist/esm/index.js",
   "types": "./dist/cjs/index.d.ts",
+  "exports": {
+    ".": {
+      "import": "./dist/esm/index.js",
+      "require": "./dist/cjs/index.js",
+      "types": "./dist/cjs/index.d.ts"
+    }
+  },
   "files": [
-    "dist/*",
-    "src/*"
+    "dist/*"
   ],
   "publishConfig": {
     "access": "public"
@@ -19,6 +25,7 @@
     "@bosonprotocol/ethers-sdk": "^1.16.0-alpha.3",
     "@bosonprotocol/ipfs-storage": "^1.12.0",
     "@bosonprotocol/roblox-sdk": "^1.0.0-alpha.19",
+    "@bosonprotocol/utils": "^0.40.0-alpha.6",
     "@davatar/react": "1.11.1",
     "@ethersproject/units": "5.6.0",
     "@glidejs/glide": "3.6.0",
@@ -52,7 +59,7 @@
     "lodash.uniqby": "4.7.0",
     "magic-sdk": "^20.1.1",
     "multicodec": "^3.2.1",
-    "multiformats": "^13.1.0",
+    "multiformats": "^10.0.0",
     "multihashes": "^4.0.3",
     "nanoclone": "^0.2.1",
     "phosphor-react": "^1.4.1",
@@ -204,6 +211,8 @@
     "webpack-bundle-analyzer": "^4.5.0"
   },
   "overrides": {
-    "typescript": "^5.1.6"
+    "typescript": "^5.1.6",
+    "multiformats": "^9.9.0",
+    "ws": "^8.18.0"
   }
 }

packages/react-kit/src/components/avatar/SellerID.tsx

@@ -6,9 +6,9 @@ import { getCssVar } from "../../theme";
 import { subgraph } from "@bosonprotocol/core-sdk";
 import { Offer } from "../../types/offer";
 import { MediaSet } from "../../lib/lens/generated";
-import { getLensImageUrl } from "../../lib/images/images";
+import { getOfferDetails } from "@bosonprotocol/utils";
 import { getLensProfilePictureUrl } from "../../lib/lens/profile";
-import { getOfferDetails } from "../../lib/offer/getOfferDetails";
+import { getLensImageUrl } from "../../lib/images/images";
 import { useIpfsContext } from "../ipfs/IpfsContext";
 import { useAccount } from "../../hooks/connection/connection";
 

packages/react-kit/src/components/boson/BosonProvider.tsx

@@ -1,5 +1,5 @@
 import React, { ReactNode, createContext, useContext, useMemo } from "react";
-import { isTruthy } from "../../types/helpers";
+import { isTruthy } from "@bosonprotocol/utils";
 
 export type BosonProviderProps = {
   minimumDisputePeriodInDays?: number;

packages/react-kit/src/components/buttons/BaseButton.tsx

@@ -11,7 +11,7 @@ import * as Styles from "../ui/styles";
 import { colors } from "../../theme";
 import { Loading } from "../ui/loading/Loading";
 import { ButtonSize } from "../ui/buttonSize";
-import { AddDollarPrefixToKeys, AnyString } from "../../types/helpers";
+import { AddDollarPrefixToKeys, AnyString } from "@bosonprotocol/utils";
 
 type ButtonWithThemePropsType = AddDollarPrefixToKeys<{
   size: ButtonSizeProp;
@@ -40,7 +40,7 @@ const ButtonWithThemeProps = styled.button<ButtonWithThemePropsType>`
     ${(props) =>
       props.theme.svg &&
       css`
-        stroke: ${(props) => props.theme?.svg.stroke};
+        stroke: ${(props) => props.theme?.svg?.stroke};
         ${props.theme.svg.fill &&
         css`
           fill: ${props.theme.svg.fill};

packages/react-kit/src/components/connection/WalletConnectV2.ts

@@ -1,13 +1,13 @@
 import { ChainId } from "@uniswap/sdk-core";
+import { isIOS } from "@bosonprotocol/utils";
+import { getRpcUrls } from "../../lib/const/networks";
 import { L1_CHAIN_IDS, L2_CHAIN_IDS } from "../../lib/const/chains";
 import { zIndex } from "../ui/zIndex";
 import {
   URI_AVAILABLE,
   WalletConnect,
   WalletConnectConstructorArgs
 } from "@web3-react/walletconnect-v2";
-import { isIOS } from "../../lib/userAgent/userAgent";
-import { getRpcUrls } from "../../lib/const/networks";
 // import { sendAnalyticsEvent } from "analytics";
 
 export class WalletConnectV2 extends WalletConnect {

packages/react-kit/src/components/connection/index.ts

@@ -21,7 +21,7 @@ import {
 } from "./utils";
 import { WalletConnectV2 } from "./WalletConnectV2";
 import { RPC_PROVIDERS } from "../../lib/const/providers";
-import { isMobile } from "../../lib/userAgent/userAgent";
+import { isMobile } from "@bosonprotocol/utils";
 import { getRpcUrls } from "../../lib/const/networks";
 
 function onError(error: Error) {

packages/react-kit/src/components/contractualAgreement/ContractualAgreement.tsx

@@ -4,7 +4,7 @@ import ReactMarkdown from "react-markdown";
 import rehypeRaw from "rehype-raw";
 import remarkGfm from "remark-gfm";
 import { useRenderTemplate } from "../../hooks/useRenderTemplate";
-import { ProgressStatus } from "../../lib/progress/progressStatus";
+import { ProgressStatus } from "@bosonprotocol/utils";
 
 import { subgraph } from "@bosonprotocol/core-sdk";
 import { useBosonContext } from "../boson/BosonProvider";

packages/react-kit/src/components/cta/offer/CommitButton.tsx

@@ -12,7 +12,7 @@ import styled from "styled-components";
 import { Button } from "../../buttons/Button";
 import { CommitView } from "../../buttons/commit/CommitView";
 import { CommitButtonViewProps } from "../../buttons/commit/types";
-import { AddDollarPrefixToKeys } from "../../../types/helpers";
+import { AddDollarPrefixToKeys } from "@bosonprotocol/utils";
 
 const StyledButton = styled(Button)<{
   $color: CommitButtonViewProps["color"];

packages/react-kit/src/components/datepicker/SelectTime.tsx

@@ -6,7 +6,7 @@ import utc from "dayjs/plugin/utc";
 import type { Dayjs } from "dayjs";
 import React, { useCallback, useEffect, useMemo, useState } from "react";
 
-import timezones from "../../lib/const/timezones.json";
+import { timezones } from "@bosonprotocol/utils";
 import BaseSelect from "../form/BaseSelect";
 import { Grid } from "../ui/Grid";
 import { Typography } from "../ui/Typography";

packages/react-kit/src/components/detail/useOfferDataset.ts

@@ -3,7 +3,7 @@ import dayjs from "dayjs";
 import minMax from "dayjs/plugin/minMax";
 import { useMemo } from "react";
 
-import { getDateTimestamp } from "../../lib/dates/getDateTimestamp";
+import { getDateTimestamp } from "@bosonprotocol/utils";
 import { colors } from "../../theme";
 import { Offer } from "./../../types/offer";
 

packages/react-kit/src/components/error/ErrorMessage.tsx

@@ -3,7 +3,7 @@ import styled from "styled-components";
 
 import { Grid } from "../ui/Grid";
 import { GridContainer } from "../ui/GridContainer";
-import { breakpoint } from "../../lib/ui/breakpoint";
+import { breakpoint } from "@bosonprotocol/utils";
 
 const margin = "1.75rem";
 const StyledGridContainer = styled(GridContainer)`

packages/react-kit/src/components/form/BaseSelect.tsx

@@ -1,7 +1,7 @@
 /* eslint @typescript-eslint/no-explicit-any: "off" */
 import React from "react";
 import Select, { SingleValue } from "react-select";
-import { checkIfValueIsEmpty } from "../../lib/object/checkIfValueIsEmpty";
+import { checkIfValueIsEmpty } from "@bosonprotocol/utils";
 
 import { colors } from "../../theme";
 import { zIndex } from "../ui/zIndex";

packages/react-kit/src/components/form/CountrySelect.tsx

@@ -16,7 +16,7 @@ import Error from "./Error";
 import type { BaseProps, SupportedReactSelectProps } from "./types";
 import { SelectDataProps } from "./types";
 import { colors, getCssVar } from "../../theme";
-import { checkIfValueIsEmpty } from "../../lib/object/checkIfValueIsEmpty";
+import { checkIfValueIsEmpty } from "@bosonprotocol/utils";
 import { useFixSelectFont } from "../../hooks/form/useFixSelectFont";
 import { inputStyles } from "./styles";
 export type { Country as CountryCode } from "react-phone-number-input";

packages/react-kit/src/components/form/Field.styles.ts

@@ -2,7 +2,7 @@
 import styled, { CSSProperties, css } from "styled-components";
 
 import { transition } from "../../components/ui/styles";
-import { checkIfValueIsEmpty } from "../../lib/object/checkIfValueIsEmpty";
+import { checkIfValueIsEmpty } from "@bosonprotocol/utils";
 import { colors } from "../../theme";
 import { Grid } from "../ui/Grid";
 
@@ -15,35 +15,21 @@ export type InputTheme = {
   borderColor: CSSProperties["borderColor"];
   borderRadius: CSSProperties["borderRadius"];
   color: CSSProperties["color"];
-  placeholder: {
-    color: CSSProperties["color"];
-  };
-  focus: {
-    caretColor: CSSProperties["caretColor"];
-  };
-  hover: {
-    borderColor: CSSProperties["borderColor"];
-  };
+  placeholder: { color: CSSProperties["color"] };
+  focus: { caretColor: CSSProperties["caretColor"] };
+  hover: { borderColor: CSSProperties["borderColor"] };
   error: {
     borderColor: CSSProperties["borderColor"];
-    hover: {
-      borderColor: CSSProperties["borderColor"];
-    };
+    hover: { borderColor: CSSProperties["borderColor"] };
     focus: {
       borderColor: CSSProperties["borderColor"];
       caretColor: CSSProperties["caretColor"];
     };
-    placeholder: {
-      color: CSSProperties["color"];
-    };
+    placeholder: { color: CSSProperties["color"] };
   };
 };
 export type HeightSize = keyof typeof sizeToHeight;
-const sizeToHeight = {
-  small: "40px",
-  regular: "49px",
-  large: "56px"
-} as const;
+const sizeToHeight = { small: "40px", regular: "49px", large: "56px" } as const;
 export const FieldInput = styled.input<{
   $error?: any;
   $heightSize?: HeightSize;
@@ -133,12 +119,8 @@ export type FileUploadWrapperTheme = Partial<{
   borderColor: CSSProperties["borderColor"];
   borderRadius: CSSProperties["borderRadius"];
   background: CSSProperties["background"];
-  focus: Partial<{
-    borderColor: CSSProperties["borderColor"];
-  }>;
-  error: Partial<{
-    borderColor: CSSProperties["borderColor"];
-  }>;
+  focus: Partial<{ borderColor: CSSProperties["borderColor"] }>;
+  error: Partial<{ borderColor: CSSProperties["borderColor"] }>;
   media: Partial<Pick<CSSProperties, "objectFit">>;
   overrides: Partial<CSSProperties>;
 }>;
@@ -295,24 +277,16 @@ export type TextAreaTheme = {
   background: CSSProperties["backgroundColor"];
   borderColor: CSSProperties["borderColor"];
   borderRadius: CSSProperties["borderRadius"];
-  focus: {
-    caretColor: CSSProperties["caretColor"];
-  };
-  hover: {
-    borderColor: CSSProperties["borderColor"];
-  };
+  focus: { caretColor: CSSProperties["caretColor"] };
+  hover: { borderColor: CSSProperties["borderColor"] };
   error: {
     borderColor: CSSProperties["borderColor"];
-    hover: {
-      borderColor: CSSProperties["borderColor"];
-    };
+    hover: { borderColor: CSSProperties["borderColor"] };
     focus: {
       borderColor: CSSProperties["borderColor"];
       caretColor: CSSProperties["caretColor"];
     };
-    placeholder: {
-      color: CSSProperties["color"];
-    };
+    placeholder: { color: CSSProperties["color"] };
   };
 };
 export const FieldTextArea = styled.textarea<{ $error: any }>`

packages/react-kit/src/components/form/Select.tsx

@@ -10,7 +10,7 @@ import ReactSelect, {
   CSSObjectWithLabel
 } from "react-select";
 import { CSSProperties } from "react";
-import { checkIfValueIsEmpty } from "../../lib/object/checkIfValueIsEmpty";
+import { checkIfValueIsEmpty } from "@bosonprotocol/utils";
 import { colors, getCssVar } from "../../theme";
 import { zIndex } from "../ui/zIndex";
 import Error from "./Error";

packages/react-kit/src/components/form/Upload/BaseUpload.tsx

@@ -2,8 +2,8 @@ import * as Sentry from "@sentry/browser";
 import { useField } from "formik";
 import { Image, Trash, VideoCamera, FilePdf, Upload } from "phosphor-react";
 import React, { useCallback, useEffect, useRef, useState } from "react";
-import { loadAndSetMedia } from "../../../lib/base64/base64";
-import { bytesToSize } from "../../../lib/bytes/bytesToSize";
+import { loadAndSetMedia } from "@bosonprotocol/utils";
+import { bytesToSize } from "@bosonprotocol/utils";
 import { colors } from "../../../theme";
 
 import Loading from "../../ui/loading/LoadingWrapper";

packages/react-kit/src/components/form/Upload/ImageEditorModal/ImageEditorModal.tsx

@@ -1,7 +1,7 @@
 import * as Sentry from "@sentry/browser";
 import React, { useRef, useState } from "react";
 import AvatarEditor from "react-avatar-editor";
-import { dataURItoBlob } from "../../../../lib/base64/base64";
+import { dataURItoBlob } from "@bosonprotocol/utils";
 import Modal from "../../../modal/Modal";
 import { Grid } from "../../../ui/Grid";
 import { Spinner } from "../../../ui/loading/Spinner";