@worldcoin/mini-apps-ui-kit-react 1.0.0-canary.16 → 1.0.0-canary.18

package/dist/components/SearchField/SearchField.js

@@ -1,80 +1,89 @@
 "use client";
-import { jsx as r } from "react/jsx-runtime";
-import { createChangeEvent as l } from "../../lib/utils.js";
-import { forwardRef as S, useRef as A, useState as m, useImperativeHandle as R } from "react";
-import x from "../ClearButton/ClearButton.js";
-import { Magnifier as N } from "../Icons/Magnifier.js";
-import { Input as j } from "../Input/Input.js";
-import w from "../PasteButton/PasteButton.js";
-const y = S(
+import { jsx } from "react/jsx-runtime";
+import { createChangeEvent } from "../../lib/utils.js";
+import { forwardRef, useRef, useState, useImperativeHandle } from "react";
+import { Magnifier } from "../Icons/Magnifier.js";
+import { PasteButton } from "../PasteButton/PasteButton.js";
+import { Input } from "../Input/Input.js";
+import { ClearButton } from "../ClearButton/ClearButton.js";
+const SearchField = forwardRef(
   ({
-    showPasteButton: o,
-    pasteButtonLabel: i,
-    isValid: s,
-    disabled: u,
-    type: d = "search",
-    autoComplete: h = "off",
-    spellCheck: F = "false",
-    endAdornment: C,
-    label: g = "Search",
-    ...e
-  }, v) => {
-    const a = A(null), [B, c] = m(!1), [I, P] = m(!1);
-    R(v, () => a.current);
-    let f = C;
-    return o && !u && !I ? f = /* @__PURE__ */ r(
-      w,
-      {
-        inputRef: a,
-        label: i,
-        onPaste: () => {
-          var t;
-          if (a.current) {
-            const n = l(a.current);
-            (t = e.onChange) == null || t.call(e, n), P(!0);
+    showPasteButton,
+    pasteButtonLabel,
+    isValid,
+    disabled,
+    type = "search",
+    autoComplete = "off",
+    spellCheck = "false",
+    endAdornment: endAdornmentProp,
+    label = "Search",
+    ...props
+  }, forwardedRef) => {
+    const inputRef = useRef(null);
+    const [isFocused, setIsFocused] = useState(false);
+    const [isPasted, setIsPasted] = useState(false);
+    useImperativeHandle(forwardedRef, () => inputRef.current);
+    let endAdornment = endAdornmentProp;
+    if (showPasteButton && !disabled && !isPasted) {
+      endAdornment = /* @__PURE__ */ jsx(
+        PasteButton,
+        {
+          inputRef,
+          label: pasteButtonLabel,
+          onPaste: () => {
+            var _a;
+            if (inputRef.current) {
+              const event = createChangeEvent(inputRef.current);
+              (_a = props.onChange) == null ? void 0 : _a.call(props, event);
+              setIsPasted(true);
+            }
           }
         }
-      }
-    ) : B && !u && (f = /* @__PURE__ */ r(
-      x,
-      {
-        inputRef: a,
-        onClear: () => {
-          var t;
-          if (a.current) {
-            const n = l(a.current);
-            (t = e.onChange) == null || t.call(e, n);
+      );
+    } else if (isFocused && !disabled) {
+      endAdornment = /* @__PURE__ */ jsx(
+        ClearButton,
+        {
+          inputRef,
+          onClear: () => {
+            var _a;
+            if (inputRef.current) {
+              const event = createChangeEvent(inputRef.current);
+              (_a = props.onChange) == null ? void 0 : _a.call(props, event);
+            }
           }
         }
-      }
-    )), /* @__PURE__ */ r(
-      j,
+      );
+    }
+    return /* @__PURE__ */ jsx(
+      Input,
       {
-        ...e,
-        ref: a,
-        startAdornment: /* @__PURE__ */ r(N, {}),
-        isValid: s,
-        disabled: u,
-        endAdornment: f,
-        type: d,
-        autoComplete: h,
-        spellCheck: F,
-        onFocus: (t) => {
-          var n;
-          c(!0), (n = e.onFocus) == null || n.call(e, t);
+        ...props,
+        ref: inputRef,
+        startAdornment: /* @__PURE__ */ jsx(Magnifier, {}),
+        isValid,
+        disabled,
+        endAdornment,
+        type,
+        autoComplete,
+        spellCheck,
+        onFocus: (e) => {
+          var _a;
+          setIsFocused(true);
+          (_a = props.onFocus) == null ? void 0 : _a.call(props, e);
         },
-        label: g,
-        onBlur: (t) => {
-          var n;
-          c(!1), (n = e.onBlur) == null || n.call(e, t);
+        label,
+        onBlur: (e) => {
+          var _a;
+          setIsFocused(false);
+          (_a = props.onBlur) == null ? void 0 : _a.call(props, e);
         },
         className: "rounded-full h-[3.125rem]"
       }
     );
   }
 );
-y.displayName = "SearchField";
+SearchField.displayName = "SearchField";
 export {
-  y as SearchField,
-  y as default
+  SearchField
 };

package/dist/components/SearchField/index.d.ts

@@ -1 +1 @@
-export * from './SearchField';
+export { SearchField, type SearchFieldProps } from './SearchField';

package/dist/components/Select/Select.d.ts

@@ -1,11 +1,5 @@
 import * as RadixSelect from "@radix-ui/react-select";
-export declare const selectVariants: (props?: ({
-    error?: boolean | null | undefined;
-    isLabel?: boolean | null | undefined;
-    isFocused?: boolean | null | undefined;
-    variant?: "default" | "floating-label" | null | undefined;
-} & import('class-variance-authority/types').ClassProp) | undefined) => string;
-export interface SelectOption {
+interface SelectOption {
     /**
      * The value of the option.
      */
@@ -15,7 +9,7 @@ export interface SelectOption {
      */
     label: string;
 }
-export interface SelectProps extends Omit<RadixSelect.SelectProps, "className" | "onValueChange" | "style"> {
+interface SelectProps extends Omit<RadixSelect.SelectProps, "className" | "onValueChange" | "style"> {
     /**
      * The value of the select item that should be selected by default.
      * Use when you do not need to control the state of the select items.
@@ -67,5 +61,6 @@ export interface SelectProps extends Omit<RadixSelect.SelectProps, "className" |
      */
     name?: string;
 }
-export declare const Select: import('react').ForwardRefExoticComponent<SelectProps & import('react').RefAttributes<HTMLButtonElement>>;
-export default Select;
+declare const Select: import('react').ForwardRefExoticComponent<SelectProps & import('react').RefAttributes<HTMLButtonElement>>;
+export { Select };
+export type { SelectProps, SelectOption };

package/dist/components/Select/Select.js

@@ -1,14 +1,14 @@
 "use client";
-import { jsxs as d, jsx as r } from "react/jsx-runtime";
-import { DROPDOWN_CONTAINER_STYLES as x } from "../../lib/constants/dropdownStyles.js";
-import { Root as N, Trigger as S, Value as V, Icon as I, Portal as R, Content as j, Viewport as A, Item as T, ItemText as D } 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 as E } from "../../node_modules/.pnpm/class-variance-authority@0.7.1/node_modules/class-variance-authority/dist/index.js";
-import { forwardRef as F, useState as C, useEffect as L } from "react";
-import { cn as a } from "../../lib/utils.js";
-import { ArrowDown as O } from "../Icons/ArrowDown.js";
-import { typographyVariants as f } from "../Typography/Typography.js";
-const P = E(
-  a(
+import { jsxs, jsx } from "react/jsx-runtime";
+import { DROPDOWN_CONTAINER_STYLES } from "../../lib/constants/dropdownStyles.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";
+import { cn } from "../../lib/utils.js";
+import { ArrowDown } from "../Icons/ArrowDown.js";
+import { typographyVariants } from "../Typography/Typography.js";
+const selectVariants = cva(
+  cn(
     "flex items-center justify-between whitespace-nowrap [&>span:first-of-type]:line-clamp-1",
     "peer h-[3.5rem] w-full rounded-[0.625rem] border border-gray-100 bg-gray-100 px-4 outline-none transition duration-300",
     "placeholder:text-gray-500",
@@ -37,77 +37,86 @@ const P = E(
       }
     },
     defaultVariants: {
-      error: !1,
-      isFocused: !1,
+      error: false,
+      isFocused: false,
       variant: "default"
     }
   }
-), _ = F(
+);
+const Select = forwardRef(
   ({
-    options: l = [],
-    placeholder: u = "Select...",
-    value: o,
-    onChange: m,
-    open: t,
-    onOpenChange: s,
-    error: b = !1,
-    defaultOpen: i = !1,
-    disabled: g = !1,
-    name: p,
-    defaultValue: y,
-    ...h
-  }, v) => {
-    const [n, c] = C(t ?? i), w = (e) => {
-      c(e), s == null || s(e);
+    options = [],
+    placeholder = "Select...",
+    value,
+    onChange,
+    open,
+    onOpenChange,
+    error = false,
+    defaultOpen = false,
+    disabled = false,
+    name,
+    defaultValue,
+    ...rest
+  }, ref) => {
+    const [isOpen, setIsOpen] = useState(open ?? defaultOpen);
+    const handleOpenChange = (open2) => {
+      setIsOpen(open2);
+      onOpenChange == null ? void 0 : onOpenChange(open2);
     };
-    return L(() => {
-      t !== void 0 && c(t);
-    }, [t]), Array.isArray(l) || console.error("`options` must be an array of objects with `value` and `label` keys."), /* @__PURE__ */ d(
-      N,
+    useEffect(() => {
+      if (open !== void 0) {
+        setIsOpen(open);
+      }
+    }, [open]);
+    if (!Array.isArray(options)) {
+      console.error("`options` must be an array of objects with `value` and `label` keys.");
+    }
+    return /* @__PURE__ */ jsxs(
+      Root2,
       {
-        value: o,
-        open: n,
-        onValueChange: m,
-        defaultOpen: i,
-        onOpenChange: w,
-        name: p,
-        disabled: g,
-        defaultValue: y,
-        ...h,
+        value,
+        open: isOpen,
+        onValueChange: onChange,
+        defaultOpen,
+        onOpenChange: handleOpenChange,
+        name,
+        disabled,
+        defaultValue,
+        ...rest,
         children: [
-          /* @__PURE__ */ d(
-            S,
+          /* @__PURE__ */ jsxs(
+            Trigger,
             {
-              ref: v,
-              className: a(
-                f({ variant: "body" }),
-                P({ error: b, isFocused: n })
+              ref,
+              className: cn(
+                typographyVariants({ variant: "body" }),
+                selectVariants({ error, isFocused: isOpen })
               ),
               children: [
-                /* @__PURE__ */ r(V, { placeholder: u }),
-                /* @__PURE__ */ r(I, { children: /* @__PURE__ */ r(O, { className: "text-gray-400 size-6" }) })
+                /* @__PURE__ */ jsx(Value, { placeholder }),
+                /* @__PURE__ */ jsx(Icon, { children: /* @__PURE__ */ jsx(ArrowDown, { className: "text-gray-400 size-6" }) })
               ]
             }
           ),
-          /* @__PURE__ */ r(R, { children: /* @__PURE__ */ r(j, { position: "popper", className: a(x), children: /* @__PURE__ */ r(
-            A,
+          /* @__PURE__ */ jsx(Portal, { children: /* @__PURE__ */ jsx(Content2, { position: "popper", className: cn(DROPDOWN_CONTAINER_STYLES), children: /* @__PURE__ */ jsx(
+            Viewport,
             {
-              className: a(
+              className: cn(
                 "h-[var(--radix-select-trigger-height)] w-full min-w-[var(--radix-select-trigger-width)] p-2",
-                l.length === 0 && "hidden"
+                options.length === 0 && "hidden"
               ),
-              children: l.map((e) => /* @__PURE__ */ r(
-                T,
+              children: options.map((option) => /* @__PURE__ */ jsx(
+                Item,
                 {
-                  value: e.value,
-                  className: a(
+                  value: option.value,
+                  className: cn(
                     "w-full cursor-pointer select-none rounded-md p-2 font-sans outline-none hover:bg-gray-50",
-                    o === e.value && "bg-gray-100",
-                    f({ variant: "body", level: 3 })
+                    value === option.value && "bg-gray-100",
+                    typographyVariants({ variant: "body", level: 3 })
                   ),
-                  children: /* @__PURE__ */ r(D, { children: e.label })
+                  children: /* @__PURE__ */ jsx(ItemText, { children: option.label })
                 },
-                `${e.value}/${e.label}`
+                `${option.value}/${option.label}`
               ))
             }
           ) }) })
@@ -116,9 +125,7 @@ const P = E(
     );
   }
 );
-_.displayName = "Select";
+Select.displayName = "Select";
 export {
-  _ as Select,
-  _ as default,
-  P as selectVariants
+  Select
 };

package/dist/components/Select/index.d.ts

@@ -1 +1 @@
-export * from './Select';
+export { Select, type SelectProps } from './Select';

package/dist/components/Spinner/Spinner.d.ts

@@ -4,5 +4,9 @@ interface SpinnerProps {
      */
     className?: string;
 }
-export declare const Spinner: ({ className }: SpinnerProps) => import("react/jsx-runtime").JSX.Element;
-export {};
+declare const Spinner: {
+    ({ className }: SpinnerProps): import("react/jsx-runtime").JSX.Element;
+    displayName: string;
+};
+export { Spinner };
+export type { SpinnerProps };

package/dist/components/Spinner/Spinner.js

@@ -1,36 +1,39 @@
-import { jsxs as e, jsx as r } from "react/jsx-runtime";
-import { cn as o } from "../../lib/utils.js";
-const s = ({ className: t }) => /* @__PURE__ */ e(
-  "svg",
-  {
-    width: "24",
-    height: "24",
-    viewBox: "0 0 24 24",
-    fill: "none",
-    xmlns: "http://www.w3.org/2000/svg",
-    className: o("h-6 w-6 animate-spin text-gray-900", t),
-    children: [
-      /* @__PURE__ */ r(
-        "circle",
-        {
-          cx: "12",
-          cy: "12",
-          r: "10.75",
-          stroke: "currentColor",
-          strokeOpacity: "0.16",
-          strokeWidth: "2.5"
-        }
-      ),
-      /* @__PURE__ */ r(
-        "path",
-        {
-          d: "M17.8921 1.54613C16.1312 0.553676 14.1482 0.0220795 12.1271 0.000672984C10.1059 -0.0207335 8.11211 0.468744 6.33065 1.42368L7.50987 3.62356C8.92079 2.86725 10.4999 2.47958 12.1007 2.49653C13.7014 2.51349 15.2719 2.93451 16.6665 3.72054L17.8921 1.54613Z",
-          fill: "currentColor"
-        }
-      )
-    ]
-  }
-);
+import { jsxs, jsx } from "react/jsx-runtime";
+import { cn } from "../../lib/utils.js";
+const Spinner = ({ className }) => {
+  return /* @__PURE__ */ jsxs(
+    "svg",
+    {
+      width: "24",
+      height: "24",
+      viewBox: "0 0 24 24",
+      fill: "none",
+      xmlns: "http://www.w3.org/2000/svg",
+      className: cn("h-6 w-6 animate-spin text-gray-900", className),
+      children: [
+        /* @__PURE__ */ jsx(
+          "circle",
+          {
+            cx: "12",
+            cy: "12",
+            r: "10.75",
+            stroke: "currentColor",
+            strokeOpacity: "0.16",
+            strokeWidth: "2.5"
+          }
+        ),
+        /* @__PURE__ */ jsx(
+          "path",
+          {
+            d: "M17.8921 1.54613C16.1312 0.553676 14.1482 0.0220795 12.1271 0.000672984C10.1059 -0.0207335 8.11211 0.468744 6.33065 1.42368L7.50987 3.62356C8.92079 2.86725 10.4999 2.47958 12.1007 2.49653C13.7014 2.51349 15.2719 2.93451 16.6665 3.72054L17.8921 1.54613Z",
+            fill: "currentColor"
+          }
+        )
+      ]
+    }
+  );
+};
+Spinner.displayName = "Spinner";
 export {
-  s as Spinner
+  Spinner
 };

package/dist/components/Spinner/index.d.ts

@@ -1 +1 @@
-export * from './Spinner';
+export { Spinner, type SpinnerProps } from './Spinner';

package/dist/components/Switch/Switch.d.ts

@@ -1,5 +1,5 @@
 import { SwitchProps as RadixSwitchProps } from '@radix-ui/react-switch';
-export interface SwitchProps extends Omit<RadixSwitchProps, "onCheckedChange" | "onChange" | "className"> {
+interface SwitchProps extends Omit<RadixSwitchProps, "onCheckedChange" | "onChange" | "className"> {
     /**
      * The checked state of the switch.
      * @default false
@@ -15,5 +15,6 @@ export interface SwitchProps extends Omit<RadixSwitchProps, "onCheckedChange" |
      */
     disabled?: boolean;
 }
-export declare const Switch: import('react').ForwardRefExoticComponent<SwitchProps & import('react').RefAttributes<HTMLButtonElement>>;
-export default Switch;
+declare const Switch: import('react').ForwardRefExoticComponent<SwitchProps & import('react').RefAttributes<HTMLButtonElement>>;
+export { Switch };
+export type { SwitchProps };

package/dist/components/Switch/Switch.js

@@ -1,23 +1,24 @@
 "use client";
-import { jsx as a } from "react/jsx-runtime";
-import { Root as s, Thumb as c } 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 as l } from "react";
-const n = l(
-  ({ checked: e, onChange: t, disabled: r = !1, ...d }, o) => /* @__PURE__ */ a(
-    s,
-    {
-      ref: o,
-      checked: e,
-      onCheckedChange: t,
-      disabled: r,
-      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",
-      ...d,
-      children: /* @__PURE__ */ a(c, { className: "bg-gray-0 block h-5 w-5 transform rounded-full transition-transform data-[state=checked]:translate-x-4 data-[state=unchecked]:translate-x-0" })
-    }
-  )
+import { jsx } from "react/jsx-runtime";
+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(
+  ({ checked, onChange: onCheckedChange, disabled = false, ...rest }, ref) => {
+    return /* @__PURE__ */ jsx(
+      Root,
+      {
+        ref,
+        checked,
+        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,
+        children: /* @__PURE__ */ jsx(Thumb, { className: "bg-gray-0 block h-5 w-5 transform rounded-full transition-transform data-[state=checked]:translate-x-4 data-[state=unchecked]:translate-x-0" })
+      }
+    );
+  }
 );
-n.displayName = "Switch";
+Switch.displayName = "Switch";
 export {
-  n as Switch,
-  n as default
+  Switch
 };

package/dist/components/Switch/index.d.ts

@@ -1 +1 @@
-export * from './Switch';
+export { Switch, type SwitchProps } from './Switch';

package/dist/components/Tabs/Tabs.js

@@ -1,56 +1,58 @@
 "use client";
-import { jsx as a, jsxs as c } from "react/jsx-runtime";
-import { Slot as i } 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 p, Item as f } 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 s from "react";
-import { cn as n } from "../../lib/utils.js";
-import { Typography as d } from "../Typography/Typography.js";
-const u = s.forwardRef(
-  ({ children: t, className: r, ...e }, o) => /* @__PURE__ */ a(
-    p,
-    {
-      ref: o,
-      type: "single",
-      className: n("grid w-full px-5 items-center auto-cols-fr", r),
-      style: {
-        gridTemplateColumns: `repeat(${s.Children.count(t)}, 1fr)`
-      },
-      ...e,
-      children: t
-    }
-  )
+import { jsx, jsxs } from "react/jsx-runtime";
+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) => {
+    return /* @__PURE__ */ jsx(
+      Root2,
+      {
+        ref,
+        type: "single",
+        className: cn("grid w-full px-5 items-center auto-cols-fr", className),
+        style: {
+          gridTemplateColumns: `repeat(${React.Children.count(children)}, 1fr)`
+        },
+        ...props,
+        children
+      }
+    );
+  }
 );
-u.displayName = "Tabs";
-const x = s.forwardRef(
-  ({ icon: t, label: r, altIcon: e, className: o, ...l }, m) => /* @__PURE__ */ c(
-    f,
+Tabs.displayName = "Tabs";
+const TabItem = React.forwardRef(
+  ({ icon, label, altIcon, className, ...props }, ref) => /* @__PURE__ */ jsxs(
+    Item2,
     {
-      ref: m,
-      className: n(
+      ref,
+      className: cn(
         "w-full flex-1 flex flex-col items-center justify-center gap-1 relative min-w-0 group",
         "focus:outline-none transition-colors duration-200",
         "text-gray-350 hover:text-gray-500 data-[state=on]:text-gray-900",
-        o
+        className
       ),
-      ...l,
+      ...props,
       children: [
-        /* @__PURE__ */ a(i, { className: n("h-[1.625rem] shrink-0", e && "group-data-[state=on]:hidden"), children: t }),
-        e && /* @__PURE__ */ a(i, { className: "h-[1.625rem] shrink-0 hidden group-data-[state=on]:block", children: e }),
-        r && /* @__PURE__ */ a(
-          d,
+        /* @__PURE__ */ jsx(Slot, { className: cn("h-[1.625rem] shrink-0", altIcon && "group-data-[state=on]:hidden"), children: icon }),
+        altIcon && /* @__PURE__ */ jsx(Slot, { className: "h-[1.625rem] shrink-0 hidden group-data-[state=on]:block", children: altIcon }),
+        label && /* @__PURE__ */ jsx(
+          Typography,
           {
             as: "span",
             variant: "subtitle",
             className: "text-2xs truncate w-full text-center px-1 leading-none",
-            children: r
+            children: label
           }
         )
       ]
     }
   )
 );
-x.displayName = "TabItem";
+TabItem.displayName = "TabItem";
 export {
-  x as TabItem,
-  u as Tabs
+  TabItem,
+  Tabs
 };

package/dist/components/Tabs/index.d.ts

@@ -1,2 +1,2 @@
-export * from './Tabs';
-export * from './types';
+export { Tabs, TabItem } from './Tabs';
+export type { TabsProps, TabItemProps } from './types';