@worldcoin/mini-apps-ui-kit-react 1.0.0-canary.21 → 1.0.0-canary.23

package/dist/components/PasteButton/PasteButton.js

@@ -1,4 +1,5 @@
 import { jsxs, jsx } from "react/jsx-runtime";
+import haptics from "../../lib/haptics.js";
 import * as React from "react";
 import { cn } from "../../lib/utils.js";
 import { MagicWand } from "../Icons/MagicWand.js";
@@ -11,6 +12,7 @@ const PasteButton = React.forwardRef(
           const text = await navigator.clipboard.readText();
           inputRef.current.value = text;
           onPaste == null ? void 0 : onPaste(text);
+          haptics.impact("light");
         }
       } catch (error) {
         console.error("Failed to read clipboard:", error);

package/dist/components/PhoneField/GroupedCountryList.js

@@ -1,4 +1,5 @@
 import { jsxs, jsx, Fragment } from "react/jsx-runtime";
+import { withHaptics } from "../../lib/haptics.js";
 import { Magnifier } from "../Icons/Magnifier.js";
 import CountryListItem from "./CountryListItem.js";
 import { Typography } from "../Typography/Typography.js";
@@ -21,7 +22,7 @@ function GroupedCountryList({
       {
         countryCode: country.countryCode,
         countryName: country.name,
-        onClick: onSelect,
+        onClick: withHaptics(onSelect),
         isSelected: value === country.countryCode
       }
     ) }, country.countryCode)),

package/dist/components/PhoneField/constants.d.ts

@@ -1,3 +1 @@
-import { CountryData } from 'react-international-phone';
-export declare const extendedCountryDataList: CountryData[];
 export declare const DIAL_CODE_PREFIX = "+";

package/dist/components/PhoneField/constants.js

@@ -1,28 +1,4 @@
-import { countries as a } from "../../node_modules/.pnpm/countries-list@3.1.1/node_modules/countries-list/mjs/index.js";
-import { defaultCountries as R, parseCountry as M } from "../../node_modules/.pnpm/react-international-phone@4.4.0_react@18.3.1/node_modules/react-international-phone/dist/index.js";
-import { countryCodes } from "../Flag/constants.js";
-const supportedCountryCodesSet = new Set(
-  countryCodes.map((c) => c.toLowerCase())
-);
-const supportedDefaultCountryCodes = R.filter(
-  (defaultCountry) => supportedCountryCodesSet.has(M(defaultCountry).iso2)
-);
-const defaultCountryCodesSet = new Set(R.map((c) => M(c).iso2));
-const unsupportedCountryCodes = Array.from(supportedCountryCodesSet).filter(
-  (iso2) => !defaultCountryCodesSet.has(iso2)
-);
-const customCountries = Object.entries(a).filter(([iso2]) => unsupportedCountryCodes.includes(iso2.toLowerCase())).map(([iso2, country]) => {
-  const { name, phone } = country;
-  const dialCode = phone[0].toString();
-  const iso2Lower = iso2.toLowerCase();
-  return [name, iso2Lower, dialCode];
-});
-const extendedCountryDataList = [
-  ...supportedDefaultCountryCodes,
-  ...customCountries
-].sort((a2, b) => a2[0].localeCompare(b[0]));
 const DIAL_CODE_PREFIX = "+";
 export {
-  DIAL_CODE_PREFIX,
-  extendedCountryDataList
+  DIAL_CODE_PREFIX
 };

package/dist/components/PhoneField/utils.js

@@ -1,16 +1,16 @@
-import { parseCountry as M } from "../../node_modules/.pnpm/react-international-phone@4.4.0_react@18.3.1/node_modules/react-international-phone/dist/index.js";
+import { defaultCountries as R, parseCountry as M } from "../../node_modules/.pnpm/react-international-phone@4.4.0_react@18.3.1/node_modules/react-international-phone/dist/index.js";
 import { isSupportedCountryCode } from "../Flag/utils.js";
-import { extendedCountryDataList, DIAL_CODE_PREFIX } from "./constants.js";
+import { DIAL_CODE_PREFIX } from "./constants.js";
 const getValidatedCountryCode = (code, defaultCountryCode) => {
   const upperCaseCode = code.toUpperCase();
   return isSupportedCountryCode(upperCaseCode) ? upperCaseCode : defaultCountryCode;
 };
 const getCountryDataListByCodes = (countryCodes) => {
   if (!(countryCodes == null ? void 0 : countryCodes.length)) {
-    return extendedCountryDataList;
+    return R;
   }
   const countryCodeSet = new Set(countryCodes);
-  return extendedCountryDataList.filter((country) => {
+  return R.filter((country) => {
     const countryCode = M(country).iso2.toUpperCase();
     return countryCodeSet.has(countryCode);
   });

package/dist/components/Progress/Progress.js

@@ -21,7 +21,7 @@ const Progress = ({ value, asChild, max, getValueLabel, className }) => {
       children: /* @__PURE__ */ jsx(
         Indicator,
         {
-          className: "ease-[cubic-bezier(0.65, 0, 0.35, 1)] size-full bg-current transition-transform duration-[660ms]",
+          className: "ease-[cubic-bezier(0.65, 0, 0.35, 1)] size-full bg-current transition-transform duration-700",
           style: { transform: `translateX(-${100 - Math.min(value, 100)}%)` }
         }
       )

package/dist/components/RadioGroup/RadioGroup.js

@@ -1,4 +1,5 @@
 import { jsx } from "react/jsx-runtime";
+import { withHaptics } from "../../lib/haptics.js";
 import { Root as Root2 } from "../../node_modules/.pnpm/@radix-ui_react-radio-group@1.2.2_@types_react-dom@18.3.5_@types_react@18.3.18__@types_react@_2u6lfd2xt65wmbxn7lgvaxqbmy/node_modules/@radix-ui/react-radio-group/dist/index.js";
 import { cva } from "../../node_modules/.pnpm/class-variance-authority@0.7.1/node_modules/class-variance-authority/dist/index.js";
 import { forwardRef } from "react";
@@ -27,7 +28,7 @@ const RadioGroup = forwardRef(
       {
         ref,
         defaultValue,
-        onValueChange,
+        onValueChange: withHaptics(onValueChange),
         className: radioGroupVariants({ orientation }),
         disabled,
         orientation,

package/dist/components/Select/Select.js

@@ -1,6 +1,7 @@
 "use client";
 import { jsxs, jsx } from "react/jsx-runtime";
 import { DROPDOWN_CONTAINER_STYLES } from "../../lib/constants/dropdownStyles.js";
+import { withHaptics } from "../../lib/haptics.js";
 import { Root as Root2, Trigger, Value, Icon, Portal, Content as Content2, Viewport, Item, ItemText } from "../../node_modules/.pnpm/@radix-ui_react-select@2.1.4_@types_react-dom@18.3.5_@types_react@18.3.18__@types_react@18.3._atdh45n5c7sked5b6tbwgdz7re/node_modules/@radix-ui/react-select/dist/index.js";
 import { cva } from "../../node_modules/.pnpm/class-variance-authority@0.7.1/node_modules/class-variance-authority/dist/index.js";
 import { forwardRef, useState, useEffect } from "react";
@@ -21,7 +22,7 @@ const selectVariants = cva(
   {
     variants: {
       error: {
-        true: "border-error-600 focus:border-error-600 bg-gray-0"
+        true: "!border-error-600 !focus:border-error-600 !bg-gray-0"
       },
       isLabel: {
         true: "pt-6 pb-2 placeholder:text-transparent",
@@ -76,7 +77,7 @@ const Select = forwardRef(
       {
         value,
         open: isOpen,
-        onValueChange: onChange,
+        onValueChange: withHaptics(onChange),
         defaultOpen,
         onOpenChange: handleOpenChange,
         name,

package/dist/components/Switch/Switch.js

@@ -1,5 +1,6 @@
 "use client";
 import { jsx } from "react/jsx-runtime";
+import { withHaptics } from "../../lib/haptics.js";
 import { Root, Thumb } from "../../node_modules/.pnpm/@radix-ui_react-switch@1.1.2_@types_react-dom@18.3.5_@types_react@18.3.18__@types_react@18.3._udl6ccyllphugejc6sszfrese4/node_modules/@radix-ui/react-switch/dist/index.js";
 import { forwardRef } from "react";
 const Switch = forwardRef(
@@ -9,7 +10,7 @@ const Switch = forwardRef(
       {
         ref,
         checked,
-        onCheckedChange,
+        onCheckedChange: withHaptics(onCheckedChange),
         disabled,
         className: "relative inline-flex h-6 w-10 items-center rounded-full border-2 transition-all data-[state=checked]:border-gray-900 data-[state=checked]:bg-gray-900 data-[state=unchecked]:border-gray-300 data-[state=unchecked]:bg-gray-300 disabled:cursor-not-allowed disabled:opacity-20",
         ...rest,

package/dist/components/Tabs/Tabs.js

@@ -1,12 +1,13 @@
 "use client";
 import { jsx, jsxs } from "react/jsx-runtime";
+import { withHaptics } from "../../lib/haptics.js";
 import { Slot } from "../../node_modules/.pnpm/@radix-ui_react-slot@1.1.1_@types_react@18.3.18_react@18.3.1/node_modules/@radix-ui/react-slot/dist/index.js";
 import { Root as Root2, Item as Item2 } from "../../node_modules/.pnpm/@radix-ui_react-toggle-group@1.1.2_@types_react-dom@18.3.5_@types_react@18.3.18__@types_react_3smwloudr6a3igss4kifyxcwju/node_modules/@radix-ui/react-toggle-group/dist/index.js";
 import * as React from "react";
 import { cn } from "../../lib/utils.js";
 import { Typography } from "../Typography/Typography.js";
 const Tabs = React.forwardRef(
-  ({ children, className, ...props }, ref) => {
+  ({ children, className, onValueChange, ...props }, ref) => {
     return /* @__PURE__ */ jsx(
       Root2,
       {
@@ -16,6 +17,7 @@ const Tabs = React.forwardRef(
         style: {
           gridTemplateColumns: `repeat(${React.Children.count(children)}, 1fr)`
         },
+        onValueChange: withHaptics(onValueChange),
         ...props,
         children
       }

package/dist/components/Toast/use-toast.d.ts

@@ -34,16 +34,8 @@ declare const toast: ({ ...props }: Toast) => {
 };
 declare function useToast(): {
     toast: {
-        success: (props: Omit<Toast, "variant">) => {
-            id: string;
-            dismiss: () => void;
-            update: (props: ToasterToast) => void;
-        };
-        error: (props: Omit<Toast, "variant">) => {
-            id: string;
-            dismiss: () => void;
-            update: (props: ToasterToast) => void;
-        };
+        success: (props: Omit<Toast, "variant">) => void;
+        error: (props: Omit<Toast, "variant">) => void;
     };
     dismiss: (toastId?: string) => void;
     toasts: ToasterToast[];

package/dist/components/Toast/use-toast.js

@@ -1,4 +1,5 @@
 "use client";
+import haptics from "../../lib/haptics.js";
 import { useState, useEffect } from "react";
 const TOAST_LIMIT = 1;
 const TOAST_REMOVE_DELAY = 1e6;
@@ -113,8 +114,14 @@ function useToast() {
   return {
     ...state,
     toast: {
-      success: (props) => toast({ ...props, variant: "success" }),
-      error: (props) => toast({ ...props, variant: "error" })
+      success: (props) => {
+        toast({ ...props, variant: "success" });
+        haptics.notification("success");
+      },
+      error: (props) => {
+        toast({ ...props, variant: "error" });
+        haptics.notification("error");
+      }
     },
     dismiss: (toastId) => dispatch({ type: "DISMISS_TOAST", toastId })
   };

package/dist/components/ToggleGroup/ToggleGroup.js

@@ -1,9 +1,18 @@
 import { jsx } from "react/jsx-runtime";
+import { withHaptics } from "../../lib/haptics.js";
 import { Root as Root2, Item as Item2 } from "../../node_modules/.pnpm/@radix-ui_react-toggle-group@1.1.2_@types_react-dom@18.3.5_@types_react@18.3.18__@types_react_3smwloudr6a3igss4kifyxcwju/node_modules/@radix-ui/react-toggle-group/dist/index.js";
 import * as React from "react";
 import { cn } from "../../lib/utils.js";
 import { typographyVariants } from "../Typography/Typography.js";
-const ToggleGroupRoot = React.forwardRef(({ ...props }, ref) => /* @__PURE__ */ jsx(Root2, { ref, className: cn("inline-flex gap-5"), ...props }));
+const ToggleGroupRoot = React.forwardRef(({ onValueChange, ...props }, ref) => /* @__PURE__ */ jsx(
+  Root2,
+  {
+    ref,
+    className: cn("inline-flex gap-5"),
+    onValueChange: withHaptics(onValueChange),
+    ...props
+  }
+));
 ToggleGroupRoot.displayName = "ToggleGroup";
 const ToggleGroupItem = React.forwardRef(({ className, children, ...props }, ref) => /* @__PURE__ */ jsx(
   Item2,

package/dist/components/Token/icons/doge.d.ts

@@ -0,0 +1,3 @@
+import { IconProps } from './types';
+declare const DOGE: (props: IconProps) => import("react/jsx-runtime").JSX.Element;
+export default DOGE;

package/dist/components/Token/icons/doge.js

@@ -0,0 +1,29 @@
+import { jsxs, jsx } from "react/jsx-runtime";
+import { getBackgroundClass, getIconFillClass } from "./utils.js";
+const DOGE = (props) => /* @__PURE__ */ jsxs(
+  "svg",
+  {
+    width: "88",
+    height: "88",
+    viewBox: "0 0 88 88",
+    fill: "none",
+    xmlns: "http://www.w3.org/2000/svg",
+    ...props,
+    style: { color: "#988430" },
+    children: [
+      /* @__PURE__ */ jsx("rect", { width: "88", height: "88", rx: "44", className: getBackgroundClass(props) }),
+      /* @__PURE__ */ jsx(
+        "path",
+        {
+          fillRule: "evenodd",
+          clipRule: "evenodd",
+          d: "M63.871 34.1006C59.9176 23.8914 50.1446 22 50.1446 22H22.2619L22.3695 32.3989H27.9223V55.6198H22.2615V66H49.3728C55.9067 66 61.1444 59.4339 61.1444 59.4339C69.5318 47.5297 63.8705 34.1006 63.8705 34.1006H63.871ZM49.5183 52.4379C49.5183 52.4379 47.3917 55.506 45.0779 55.506H40.4495L40.3398 32.4244H46.2796C46.2796 32.4244 49.0317 32.9998 50.9543 38.4459C50.9543 38.4459 53.5033 46.2433 49.5183 52.4379Z",
+          className: getIconFillClass(props)
+        }
+      )
+    ]
+  }
+);
+export {
+  DOGE as default
+};

package/dist/components/Token/icons/index.d.ts

@@ -4,3 +4,8 @@ export { default as DAI } from './dai';
 export { default as USDC } from './usdc';
 export { default as USDT } from './usdt';
 export { default as WLD } from './wld';
+export { default as SOL } from './sol';
+export { default as SUI } from './sui';
+export { default as DOGE } from './doge';
+export { default as XRP } from './xrp';
+export { default as LINK } from './link';

package/dist/components/Token/icons/index.js

@@ -4,11 +4,21 @@ import { default as default4 } from "./dai.js";
 import { default as default5 } from "./usdc.js";
 import { default as default6 } from "./usdt.js";
 import { default as default7 } from "./wld.js";
+import { default as default8 } from "./sol.js";
+import { default as default9 } from "./sui.js";
+import { default as default10 } from "./doge.js";
+import { default as default11 } from "./xrp.js";
+import { default as default12 } from "./link.js";
 export {
   default2 as BTC,
   default4 as DAI,
+  default10 as DOGE,
   default3 as ETH,
+  default12 as LINK,
+  default8 as SOL,
+  default9 as SUI,
   default5 as USDC,
   default6 as USDT,
-  default7 as WLD
+  default7 as WLD,
+  default11 as XRP
 };

package/dist/components/Token/icons/link.d.ts

@@ -0,0 +1,3 @@
+import { IconProps } from './types';
+declare const LINK: (props: IconProps) => import("react/jsx-runtime").JSX.Element;
+export default LINK;

package/dist/components/Token/icons/link.js

@@ -0,0 +1,27 @@
+import { jsxs, jsx } from "react/jsx-runtime";
+import { getBackgroundClass, getIconFillClass } from "./utils.js";
+const LINK = (props) => /* @__PURE__ */ jsxs(
+  "svg",
+  {
+    width: "88",
+    height: "88",
+    viewBox: "0 0 88 88",
+    fill: "none",
+    xmlns: "http://www.w3.org/2000/svg",
+    ...props,
+    style: { color: "#2A5ADA" },
+    children: [
+      /* @__PURE__ */ jsx("rect", { width: "88", height: "88", rx: "44", className: getBackgroundClass(props) }),
+      /* @__PURE__ */ jsx(
+        "path",
+        {
+          d: "M44 20L39.5963 22.5321L27.5963 29.4679L23.1926 32V56L27.5963 58.5321L39.7064 65.4679L44.1101 68L48.5137 65.4679L60.4036 58.5321L64.8073 56V32L60.4036 29.4679L48.4036 22.5321L44 20ZM32 50.9358V37.0642L44 30.1284L56 37.0642V50.9358L44 57.8716L32 50.9358Z",
+          className: getIconFillClass(props)
+        }
+      )
+    ]
+  }
+);
+export {
+  LINK as default
+};

package/dist/components/Token/icons/sol.d.ts

@@ -0,0 +1,3 @@
+import { IconProps } from './types';
+declare const SOL: (props: IconProps) => import("react/jsx-runtime").JSX.Element;
+export default SOL;

package/dist/components/Token/icons/sol.js

@@ -0,0 +1,93 @@
+import { jsxs, jsx } from "react/jsx-runtime";
+import { getBackgroundClass, getIconFillClass } from "./utils.js";
+const SOL = (props) => /* @__PURE__ */ jsxs(
+  "svg",
+  {
+    width: "88",
+    height: "88",
+    viewBox: "0 0 88 88",
+    fill: "none",
+    xmlns: "http://www.w3.org/2000/svg",
+    ...props,
+    children: [
+      /* @__PURE__ */ jsx("rect", { width: "88", height: "88", rx: "44", className: getBackgroundClass(props) }),
+      /* @__PURE__ */ jsxs("g", { "clip-path": "url(#clip0_2277_732)", children: [
+        /* @__PURE__ */ jsx(
+          "path",
+          {
+            d: "M27.6616 54.1925C27.9537 53.8944 28.3553 53.7205 28.7813 53.7205H67.4088C68.1146 53.7205 68.4676 54.59 67.9686 55.0993L60.338 62.888C60.0459 63.1862 59.6443 63.3601 59.2184 63.3601H20.5909C19.885 63.3601 19.5321 62.4905 20.031 61.9812L27.6616 54.1925Z",
+            className: props.variant !== "color" || props.disabled ? getIconFillClass(props) : void 0,
+            fill: props.variant === "color" ? "url(#paint0_linear_2277_732)" : void 0
+          }
+        ),
+        /* @__PURE__ */ jsx(
+          "path",
+          {
+            d: "M27.6616 25.1121C27.9659 24.8139 28.3675 24.64 28.7813 24.64H67.4088C68.1146 24.64 68.4676 25.5096 67.9686 26.0189L60.338 33.8076C60.0459 34.1057 59.6443 34.2796 59.2184 34.2796H20.5909C19.885 34.2796 19.5321 33.4101 20.031 32.9008L27.6616 25.1121Z",
+            className: props.variant !== "color" || props.disabled ? getIconFillClass(props) : void 0,
+            fill: props.variant === "color" ? "url(#paint1_linear_2277_732)" : void 0
+          }
+        ),
+        /* @__PURE__ */ jsx(
+          "path",
+          {
+            d: "M60.338 39.5591C60.0459 39.261 59.6443 39.0871 59.2184 39.0871H20.5909C19.885 39.0871 19.5321 39.9566 20.031 40.4659L27.6616 48.2547C27.9537 48.5528 28.3553 48.7267 28.7813 48.7267H67.4088C68.1146 48.7267 68.4676 47.8571 67.9686 47.3478L60.338 39.5591Z",
+            className: props.variant !== "color" || props.disabled ? getIconFillClass(props) : void 0,
+            fill: props.variant === "color" ? "url(#paint2_linear_2277_732)" : void 0
+          }
+        )
+      ] }),
+      /* @__PURE__ */ jsxs("defs", { children: [
+        /* @__PURE__ */ jsxs(
+          "linearGradient",
+          {
+            id: "paint0_linear_2277_732",
+            x1: "63.7187",
+            y1: "19.9873",
+            x2: "36.1134",
+            y2: "71.7889",
+            gradientUnits: "userSpaceOnUse",
+            children: [
+              /* @__PURE__ */ jsx("stop", { "stop-color": "#00FFA3" }),
+              /* @__PURE__ */ jsx("stop", { offset: "1", "stop-color": "#DC1FFF" })
+            ]
+          }
+        ),
+        /* @__PURE__ */ jsxs(
+          "linearGradient",
+          {
+            id: "paint1_linear_2277_732",
+            x1: "52.0295",
+            y1: "13.758",
+            x2: "24.4242",
+            y2: "65.5596",
+            gradientUnits: "userSpaceOnUse",
+            children: [
+              /* @__PURE__ */ jsx("stop", { "stop-color": "#00FFA3" }),
+              /* @__PURE__ */ jsx("stop", { offset: "1", "stop-color": "#DC1FFF" })
+            ]
+          }
+        ),
+        /* @__PURE__ */ jsxs(
+          "linearGradient",
+          {
+            id: "paint2_linear_2277_732",
+            x1: "57.8369",
+            y1: "16.8528",
+            x2: "30.2316",
+            y2: "68.6544",
+            gradientUnits: "userSpaceOnUse",
+            children: [
+              /* @__PURE__ */ jsx("stop", { "stop-color": "#00FFA3" }),
+              /* @__PURE__ */ jsx("stop", { offset: "1", "stop-color": "#DC1FFF" })
+            ]
+          }
+        ),
+        /* @__PURE__ */ jsx("clipPath", { id: "clip0_2277_732", children: /* @__PURE__ */ jsx("rect", { width: "48.4", height: "38.72", fill: "white", transform: "translate(19.8 24.64)" }) })
+      ] })
+    ]
+  }
+);
+export {
+  SOL as default
+};

package/dist/components/Token/icons/sui.d.ts

@@ -0,0 +1,3 @@
+import { IconProps } from './types';
+declare const SUI: (props: IconProps) => import("react/jsx-runtime").JSX.Element;
+export default SUI;

package/dist/components/Token/icons/sui.js

@@ -0,0 +1,29 @@
+import { jsxs, jsx } from "react/jsx-runtime";
+import { getBackgroundClass, getIconFillClass } from "./utils.js";
+const SUI = (props) => /* @__PURE__ */ jsxs(
+  "svg",
+  {
+    width: "88",
+    height: "88",
+    viewBox: "0 0 88 88",
+    fill: "none",
+    xmlns: "http://www.w3.org/2000/svg",
+    ...props,
+    style: { color: "#61BFFF" },
+    children: [
+      /* @__PURE__ */ jsx("rect", { width: "88", height: "88", rx: "44", className: getBackgroundClass(props) }),
+      /* @__PURE__ */ jsx(
+        "path",
+        {
+          fillRule: "evenodd",
+          clipRule: "evenodd",
+          d: "M55.6288 39.886C57.6422 42.4157 58.8555 45.6295 58.8555 49.1143C58.8555 52.5991 57.6164 55.9032 55.5385 58.4587L55.3578 58.6781L55.3061 58.3942C55.2674 58.1618 55.2158 57.9166 55.1642 57.6714C54.1316 53.1153 50.7501 49.2046 45.1744 46.0296C41.4186 43.9 39.2631 41.3316 38.6953 38.4146C38.3339 36.5303 38.6049 34.633 39.1212 33.0068C39.6503 31.3805 40.4247 30.0253 41.083 29.2122L43.2513 26.5663C43.6256 26.1017 44.3484 26.1017 44.7227 26.5663L55.6288 39.886ZM59.0491 37.2401L44.542 19.5064C44.2709 19.1708 43.7418 19.1708 43.4707 19.5064L28.9507 37.2401L28.8991 37.3047C26.2403 40.6217 24.6399 44.8293 24.6399 49.4111C24.6399 60.0849 33.3132 68.7453 43.9999 68.7453C54.6866 68.7453 63.3599 60.0849 63.3599 49.4111C63.3599 44.8293 61.7595 40.6217 59.0878 37.3047L59.0491 37.2401ZM32.4226 39.8344L33.7133 38.2469L33.752 38.5437C33.7778 38.776 33.8165 39.0084 33.8682 39.2407C34.7071 43.6418 37.7143 47.3202 42.7221 50.1597C47.0846 52.6378 49.6143 55.4902 50.35 58.6265C50.6597 59.9301 50.7114 61.2207 50.5823 62.3436L50.5694 62.4081L50.5049 62.434C48.543 63.3891 46.3231 63.9311 43.987 63.9311C35.7913 63.9311 29.1443 57.2971 29.1443 49.1143C29.1443 45.6037 30.3705 42.3641 32.4226 39.8344Z",
+          className: getIconFillClass(props)
+        }
+      )
+    ]
+  }
+);
+export {
+  SUI as default
+};

package/dist/components/Token/icons/xrp.d.ts

@@ -0,0 +1,3 @@
+import { IconProps } from './types';
+declare const XRP: (props: IconProps) => import("react/jsx-runtime").JSX.Element;
+export default XRP;

package/dist/components/Token/icons/xrp.js

@@ -0,0 +1,34 @@
+import { jsxs, jsx } from "react/jsx-runtime";
+import { getBackgroundClass, getIconFillClass } from "./utils.js";
+const XRP = (props) => /* @__PURE__ */ jsxs(
+  "svg",
+  {
+    width: "88",
+    height: "88",
+    viewBox: "0 0 88 88",
+    fill: "none",
+    xmlns: "http://www.w3.org/2000/svg",
+    ...props,
+    style: { color: "#23292F" },
+    children: [
+      /* @__PURE__ */ jsx("rect", { width: "88", height: "88", rx: "44", className: getBackgroundClass(props) }),
+      /* @__PURE__ */ jsx(
+        "path",
+        {
+          d: "M60.9687 24.125H67.9062L53.4687 38.42C48.2403 43.5941 39.7634 43.5941 34.5312 38.42L20.0881 24.125H27.0312L38 34.9841C39.5981 36.5592 41.7519 37.4421 43.9958 37.4421C46.2397 37.4421 48.3934 36.5592 49.9916 34.9841L60.9687 24.125Z",
+          className: getIconFillClass(props)
+        }
+      ),
+      /* @__PURE__ */ jsx(
+        "path",
+        {
+          d: "M26.9422 63.875H20L34.5312 49.4919C39.7597 44.3178 48.2366 44.3178 53.4688 49.4919L68 63.875H61.0625L50 52.9278C48.4019 51.3527 46.2481 50.4697 44.0042 50.4697C41.7603 50.4697 39.6066 51.3527 38.0084 52.9278L26.9422 63.875Z",
+          className: getIconFillClass(props)
+        }
+      )
+    ]
+  }
+);
+export {
+  XRP as default
+};

package/dist/index.d.ts

@@ -2,6 +2,7 @@ export { Button } from './components/Button';
 export { Checkbox } from './components/Checkbox';
 export { Chip } from './components/Chip';
 export { CircularIcon } from './components/CircularIcon';
+export { CircularState } from './components/CircularState';
 export { ColorPickerItem, ColorPickerGroup } from './components/ColorPicker';
 export { Flag } from './components/Flag';
 export type { CountryCode } from './components/Flag';

package/dist/index.js

@@ -3,6 +3,7 @@ import { Button } from "./components/Button/Button.js";
 import { Checkbox } from "./components/Checkbox/Checkbox.js";
 import { Chip } from "./components/Chip/Chip.js";
 import { CircularIcon } from "./components/CircularIcon/CircularIcon.js";
+import { CircularState } from "./components/CircularState/CircularState.js";
 import { ColorPickerGroup, ColorPickerItem } from "./components/ColorPicker/ColorPicker.js";
 import { Flag } from "./components/Flag/Flag.js";
 import * as Form from "./components/Form/Form.js";
@@ -53,6 +54,7 @@ export {
   Checkbox,
   Chip,
   CircularIcon,
+  CircularState,
   ColorPickerGroup,
   ColorPickerItem,
   CountryDrawer,

package/dist/lib/haptics.d.ts

@@ -0,0 +1,28 @@
+type NotificationType = "success" | "warning" | "error";
+type ImpactStyle = "light" | "medium" | "heavy" | "soft" | "rigid";
+interface HapticFeedbackParams {
+    hapticsType: "impact" | "notification" | "selectionChanged";
+    style?: ImpactStyle | NotificationType;
+}
+declare global {
+    interface Window {
+        MiniKit?: {
+            commands?: {
+                sendHapticFeedback?: (params: HapticFeedbackParams) => void;
+            };
+        };
+    }
+}
+declare const haptics: {
+    notification: (type: NotificationType) => void;
+    selection: () => void;
+    impact: (style: ImpactStyle) => void;
+};
+/**
+ * Wraps a function with haptic feedback
+ * @param fn The function to wrap (can be undefined)
+ * @param hapticFn The haptic feedback function to call (defaults to selection)
+ * @returns A new function that triggers haptic feedback and calls the original function if provided
+ */
+export declare function withHaptics<T extends (...args: any[]) => any>(fn: T | undefined, hapticFn?: () => void): T;
+export default haptics;

package/dist/lib/haptics.js

@@ -0,0 +1,45 @@
+const sendHapticFeedback = (params) => {
+  var _a, _b, _c;
+  try {
+    (_c = (_b = (_a = window.MiniKit) == null ? void 0 : _a.commands) == null ? void 0 : _b.sendHapticFeedback) == null ? void 0 : _c.call(_b, params);
+  } catch (error) {
+    console.warn("Haptic feedback not supported:", error);
+  }
+};
+const haptics = {
+  notification: (type) => {
+    sendHapticFeedback({
+      hapticsType: "notification",
+      style: type
+    });
+  },
+  selection: () => {
+    sendHapticFeedback({
+      hapticsType: "selectionChanged"
+    });
+  },
+  impact: (style) => {
+    sendHapticFeedback({
+      hapticsType: "impact",
+      style
+    });
+  }
+};
+function withHaptics(fn, hapticFn = haptics.selection) {
+  return (...args) => {
+    if (!fn) {
+      hapticFn();
+      return void 0;
+    }
+    const result = fn(...args);
+    if (result instanceof Promise) {
+      return result.finally(() => hapticFn());
+    }
+    hapticFn();
+    return result;
+  };
+}
+export {
+  haptics as default,
+  withHaptics
+};