@serendie/ui 2.0.0-dev.202507240128 → 2.0.0-dev.202507240305

package/dist/components/ChoiceBox/ChoiceBox.js

@@ -1,24 +1,24 @@
-import { jsxs as d, jsx as o } from "react/jsx-runtime";
+import { jsxs as n, jsx as o, Fragment as k } from "react/jsx-runtime";
 import "../../styled-system/css/css.js";
-import { cx as n } from "../../styled-system/css/cx.js";
+import { cx as d } from "../../styled-system/css/cx.js";
 import "../../styled-system/helpers.js";
-import { sva as k } from "../../styled-system/css/sva.js";
-import I from "../../assets/checkboxChecked.svg.js";
-import p from "../../assets/checkboxUnchecked.svg.js";
-import C from "../../assets/checkboxIndeterminate.svg.js";
-import x from "../../assets/radioChecked.svg.js";
-import l from "../../assets/radioUnchecked.svg.js";
-import { checkboxUncheckedIconCss as b, checkboxCheckedIconCss as f, checkboxIconCss as u } from "../CheckBox/CheckBox.js";
-import { radioUncheckedIconCss as U, radioCheckedIconCss as N, radioIconCss as g } from "../RadioButton/RadioButton.js";
-import { RadioGroupItem as R } from "../../node_modules/@ark-ui/react/dist/components/radio-group/radio-group-item.js";
-import { RadioGroupItemContext as v } from "../../node_modules/@ark-ui/react/dist/components/radio-group/radio-group-item-context.js";
-import { RadioGroupItemControl as S } from "../../node_modules/@ark-ui/react/dist/components/radio-group/radio-group-item-control.js";
-import { RadioGroupItemHiddenInput as G } from "../../node_modules/@ark-ui/react/dist/components/radio-group/radio-group-item-hidden-input.js";
-import { CheckboxRoot as P } from "../../node_modules/@ark-ui/react/dist/components/checkbox/checkbox-root.js";
-import { CheckboxContext as j } from "../../node_modules/@ark-ui/react/dist/components/checkbox/checkbox-context.js";
-import { CheckboxControl as y } from "../../node_modules/@ark-ui/react/dist/components/checkbox/checkbox-control.js";
-import { CheckboxHiddenInput as B } from "../../node_modules/@ark-ui/react/dist/components/checkbox/checkbox-hidden-input.js";
-const h = k({
+import { sva as I } from "../../styled-system/css/sva.js";
+import p from "../../assets/checkboxChecked.svg.js";
+import C from "../../assets/checkboxUnchecked.svg.js";
+import x from "../../assets/checkboxIndeterminate.svg.js";
+import l from "../../assets/radioChecked.svg.js";
+import b from "../../assets/radioUnchecked.svg.js";
+import { checkboxUncheckedIconCss as f, checkboxCheckedIconCss as u, checkboxIconCss as U } from "../CheckBox/CheckBox.js";
+import { radioUncheckedIconCss as g, radioCheckedIconCss as N, radioIconCss as R } from "../RadioButton/RadioButton.js";
+import { RadioGroupItem as v } from "../../node_modules/@ark-ui/react/dist/components/radio-group/radio-group-item.js";
+import { RadioGroupItemContext as S } from "../../node_modules/@ark-ui/react/dist/components/radio-group/radio-group-item-context.js";
+import { RadioGroupItemControl as G } from "../../node_modules/@ark-ui/react/dist/components/radio-group/radio-group-item-control.js";
+import { RadioGroupItemHiddenInput as P } from "../../node_modules/@ark-ui/react/dist/components/radio-group/radio-group-item-hidden-input.js";
+import { CheckboxRoot as j } from "../../node_modules/@ark-ui/react/dist/components/checkbox/checkbox-root.js";
+import { CheckboxContext as y } from "../../node_modules/@ark-ui/react/dist/components/checkbox/checkbox-context.js";
+import { CheckboxControl as B } from "../../node_modules/@ark-ui/react/dist/components/checkbox/checkbox-control.js";
+import { CheckboxHiddenInput as H } from "../../node_modules/@ark-ui/react/dist/components/checkbox/checkbox-hidden-input.js";
+const h = I({
   slots: [
     "root",
     "radioItem",
@@ -32,14 +32,14 @@ const h = k({
     root: {
       display: "flex"
     },
-    radioItem: g,
+    radioItem: R,
     radioCheckedIcon: N,
-    radioUncheckedIcon: U,
-    checkboxItem: u,
-    checkboxCheckedIcon: f,
-    checkboxUncheckedIcon: b
+    radioUncheckedIcon: g,
+    checkboxItem: U,
+    checkboxCheckedIcon: u,
+    checkboxUncheckedIcon: f
   }
-}), _ = ({
+}), $ = ({
   type: r,
   value: t,
   className: i,
@@ -47,43 +47,43 @@ const h = k({
 }) => {
   const [s, a] = h.splitVariantProps(m), e = h(s);
   if (r === "radio")
-    return /* @__PURE__ */ d(
-      R,
+    return /* @__PURE__ */ n(
+      v,
       {
         value: t,
-        className: n("group", e.root, i),
+        className: d("group", e.root, i),
         ...a,
         children: [
-          /* @__PURE__ */ o(v, { children: (c) => /* @__PURE__ */ o(S, { className: e.radioItem, asChild: !0, children: c.checked ? /* @__PURE__ */ o(x, { className: e.radioCheckedIcon }) : /* @__PURE__ */ o(l, { className: e.radioUncheckedIcon }) }) }),
-          /* @__PURE__ */ o(G, {})
+          /* @__PURE__ */ o(S, { children: (c) => /* @__PURE__ */ o(G, { className: e.radioItem, asChild: !0, children: c.checked ? /* @__PURE__ */ o(l, { className: e.radioCheckedIcon }) : /* @__PURE__ */ o(b, { className: e.radioUncheckedIcon }) }) }),
+          /* @__PURE__ */ o(P, {})
         ]
       }
     );
   if (r === "checkbox")
     return /* @__PURE__ */ o(
-      P,
+      j,
       {
         value: t,
-        className: n("group", e.root, i),
+        className: d("group", e.root, i),
         ...m,
-        children: /* @__PURE__ */ o(j, { children: (c) => /* @__PURE__ */ d(y, { className: e.checkboxItem, children: [
-          c.checked === !0 ? /* @__PURE__ */ o(I, { className: e.checkboxCheckedIcon }) : c.indeterminate === !0 ? /* @__PURE__ */ o(
-            C,
+        children: /* @__PURE__ */ o(y, { children: (c) => /* @__PURE__ */ n(k, { children: [
+          /* @__PURE__ */ o(B, { className: e.checkboxItem, children: c.checked === !0 ? /* @__PURE__ */ o(p, { className: e.checkboxCheckedIcon }) : c.indeterminate === !0 ? /* @__PURE__ */ o(
+            x,
             {
               className: e.checkboxCheckedIcon
             }
           ) : /* @__PURE__ */ o(
-            p,
+            C,
             {
               className: e.checkboxUncheckedIcon
             }
-          ),
-          /* @__PURE__ */ o(B, {})
+          ) }),
+          /* @__PURE__ */ o(H, {})
         ] }) })
       }
     );
 };
 export {
-  _ as ChoiceBox,
+  $ as ChoiceBox,
   h as ChoiceBoxStyle
 };

package/dist/components/DataTable/DataTableComponent.d.ts

@@ -1,23 +1,6 @@
-import { ColumnDef, SortingState } from '@tanstack/react-table';
-/**
- * TanStack Tableは設計上、各カラムが異なる値の型を持つことを前提としています。
- * createColumnHelperは各カラムに正確な型（string, number等）を付与しますが、
- * これらを単一の配列にまとめる際、TypeScriptの型システムの制約により問題が生じます。
- *
- * TanStack Table自体も内部実装で`ColumnDef<TData, any>[]`を使用しており、
- * これは意図的な設計判断です。これに従い、型エイリアスで意図を明確にします。
- * https://github.com/TanStack/table/blob/0cc6992c7836489661a0954a2b56e620850ad4da/packages/table-core/src/types.ts#L288C1-L289C1
- */
-type TableColumnDef<TData> = ColumnDef<TData, any>;
-export interface DataTableComponentProps<TData = Record<string, unknown>> {
-    data: TData[];
-    columns: TableColumnDef<TData>[];
-    enableRowSelection?: boolean;
-    enableSorting?: boolean;
-    initialSorting?: SortingState;
-    onRowSelectionChange?: (selection: Record<string, boolean>) => void;
-    onSortingChange?: (sorting: SortingState) => void;
+import { TableOptions } from '@tanstack/react-table';
+export interface DataTableComponentProps<TData = Record<string, unknown>> extends Omit<TableOptions<TData>, "getCoreRowModel" | "getSortedRowModel"> {
     className?: string;
 }
-export declare function DataTableComponent<TData = Record<string, unknown>>({ data, columns, enableRowSelection, enableSorting, initialSorting, onSortingChange, className, }: DataTableComponentProps<TData>): import("react/jsx-runtime").JSX.Element;
+export declare function DataTableComponent<TData = Record<string, unknown>>({ className, enableRowSelection, onRowSelectionChange, onSortingChange, state, ...tableOptions }: DataTableComponentProps<TData>): import("react/jsx-runtime").JSX.Element;
 export default DataTableComponent;

package/dist/components/DataTable/DataTableComponent.js

@@ -1,52 +1,54 @@
-import { jsxs as M, jsx as e } from "react/jsx-runtime";
-import { useState as a } from "react";
+import { jsxs as M, jsx as l } from "react/jsx-runtime";
 import { useReactTable as T } from "../../node_modules/@tanstack/react-table/build/lib/index.js";
-import { DataTable as t } from "./index.js";
-import { getSortedRowModel as S, getCoreRowModel as b } from "../../node_modules/@tanstack/table-core/build/lib/index.js";
-function D({
-  data: l = [],
-  columns: m = [],
-  enableRowSelection: r = !0,
-  enableSorting: c = !0,
-  initialSorting: f = [],
-  onSortingChange: s,
-  className: w
+import { useState as w } from "react";
+import { DataTable as r } from "./index.js";
+import { getSortedRowModel as u, getCoreRowModel as S } from "../../node_modules/@tanstack/table-core/build/lib/index.js";
+function g({
+  className: s,
+  enableRowSelection: m = !0,
+  onRowSelectionChange: t,
+  onSortingChange: d,
+  state: e,
+  ...f
 }) {
-  const [R, p] = a({}), [i, g] = a(f), u = (o) => {
-    const n = typeof o == "function" ? o(i) : o;
-    g(n), s == null || s(n);
-  }, d = T({
-    data: l,
-    columns: m,
-    getCoreRowModel: b(),
-    getSortedRowModel: S(),
-    state: { rowSelection: R, sorting: i },
-    onRowSelectionChange: p,
-    onSortingChange: u,
-    enableRowSelection: r,
-    enableSorting: c
-  });
-  return /* @__PURE__ */ M(t.Root, { className: w, children: [
-    /* @__PURE__ */ e(t.Thead, { children: d.getHeaderGroups().map((o) => /* @__PURE__ */ e(
-      t.HeaderRow,
+  const [R, b] = w({}), [p, n] = w([]), i = T({
+    getCoreRowModel: S(),
+    getSortedRowModel: u(),
+    enableRowSelection: m,
+    ...f,
+    state: {
+      rowSelection: (e == null ? void 0 : e.rowSelection) ?? R,
+      sorting: (e == null ? void 0 : e.sorting) ?? p,
+      ...e
+    },
+    onRowSelectionChange: (o) => {
+      b(o), t == null || t(o);
+    },
+    onSortingChange: (o) => {
+      n(o), d == null || d(o);
+    }
+  }), c = m !== !1;
+  return /* @__PURE__ */ M(r.Root, { className: s, children: [
+    /* @__PURE__ */ l(r.Thead, { children: i.getHeaderGroups().map((o) => /* @__PURE__ */ l(
+      r.HeaderRow,
       {
         headerGroup: o,
-        enableRowSelection: r,
-        table: d
+        enableRowSelection: c,
+        table: i
       },
       o.id
     )) }),
-    /* @__PURE__ */ e(t.Tbody, { children: d.getRowModel().rows.map((o) => /* @__PURE__ */ e(
-      t.Row,
+    /* @__PURE__ */ l(r.Tbody, { children: i.getRowModel().rows.map((o) => /* @__PURE__ */ l(
+      r.Row,
       {
         row: o,
-        enableRowSelection: r
+        enableRowSelection: c
       },
       o.id
     )) })
   ] });
 }
 export {
-  D as DataTableComponent,
-  D as default
+  g as DataTableComponent,
+  g as default
 };

package/dist/components/DataTable/table/HeaderCheckbox.js

@@ -1,26 +1,36 @@
 import { jsx as e } from "react/jsx-runtime";
-import { ChoiceBox as m } from "../../ChoiceBox/ChoiceBox.js";
-import { DataTable as t } from "../index.js";
-import { css as i } from "../../../styled-system/css/css.js";
-import { cx as c } from "../../../styled-system/css/cx.js";
+import { ChoiceBox as i } from "../../ChoiceBox/ChoiceBox.js";
+import { DataTable as a } from "../index.js";
+import { css as r } from "../../../styled-system/css/css.js";
+import { cx as o } from "../../../styled-system/css/cx.js";
 import "../../../styled-system/helpers.js";
-const d = ({
-  className: r,
-  ...o
-}) => /* @__PURE__ */ e(t.HeaderCell, { children: /* @__PURE__ */ e(
-  m,
+const x = ({
+  className: t,
+  ...m
+}) => /* @__PURE__ */ e(
+  a.HeaderCell,
   {
-    ...o,
-    type: "checkbox",
-    className: c(
-      i({
-        alignItems: "center",
-        verticalAlign: "middle"
-      }),
-      r
+    className: o(
+      r({
+        width: "sd.system.dimension.spacing.twoExtraLarge"
+      })
+    ),
+    children: /* @__PURE__ */ e(
+      i,
+      {
+        ...m,
+        type: "checkbox",
+        className: o(
+          r({
+            alignItems: "center",
+            verticalAlign: "middle"
+          }),
+          t
+        )
+      }
     )
   }
-) });
+);
 export {
-  d as HeaderCheckbox
+  x as HeaderCheckbox
 };

package/dist/components/Tooltip/Tooltip.d.ts

@@ -0,0 +1,14 @@
+import { ComponentProps } from 'react';
+import { RecipeVariantProps } from '../../../styled-system/css';
+declare const TooltipStyle: import('../../../styled-system/types').SlotRecipeRuntimeFn<"content" | "arrow" | "arrowTip", import('../../../styled-system/types').SlotRecipeVariantRecord<"content" | "arrow" | "arrowTip">>;
+type TooltipVariantProps = RecipeVariantProps<typeof TooltipStyle>;
+export type TooltipProps = {
+    content: string;
+    children: React.ReactNode;
+    placement?: "top" | "top-start" | "top-end" | "bottom" | "bottom-start" | "bottom-end" | "left" | "right";
+    openDelay?: number;
+    closeDelay?: number;
+    disabled?: boolean;
+} & ComponentProps<"div"> & TooltipVariantProps;
+export declare const Tooltip: React.FC<TooltipProps>;
+export {};

package/dist/components/Tooltip/Tooltip.js

@@ -0,0 +1,70 @@
+import { jsxs as s, jsx as o } from "react/jsx-runtime";
+import "../../styled-system/css/css.js";
+import { cx as y } from "../../styled-system/css/cx.js";
+import "../../styled-system/helpers.js";
+import { sva as f } from "../../styled-system/css/sva.js";
+import { TooltipRoot as w } from "../../node_modules/@ark-ui/react/dist/components/tooltip/tooltip-root.js";
+import { TooltipTrigger as T } from "../../node_modules/@ark-ui/react/dist/components/tooltip/tooltip-trigger.js";
+import { TooltipPositioner as g } from "../../node_modules/@ark-ui/react/dist/components/tooltip/tooltip-positioner.js";
+import { TooltipContent as h } from "../../node_modules/@ark-ui/react/dist/components/tooltip/tooltip-content.js";
+import { TooltipArrow as u } from "../../node_modules/@ark-ui/react/dist/components/tooltip/tooltip-arrow.js";
+import { TooltipArrowTip as S } from "../../node_modules/@ark-ui/react/dist/components/tooltip/tooltip-arrow-tip.js";
+const t = f({
+  slots: ["content", "arrow", "arrowTip"],
+  base: {
+    content: {
+      backgroundColor: "sd.system.color.component.inverseSurface",
+      color: "sd.system.color.component.inverseOnSurface",
+      borderRadius: "sd.system.dimension.radius.small",
+      px: "sd.system.dimension.spacing.extraSmall",
+      py: "sd.system.dimension.spacing.twoExtraSmall",
+      boxShadow: "sd.system.elevation.shadow.level3",
+      maxWidth: "200px",
+      textStyle: "sd.system.typography.body.extraSmall_expanded",
+      zIndex: 1e3
+    },
+    arrow: {
+      "--arrow-size": "8px",
+      "--arrow-background": "colors.sd.system.color.component.inverseSurface",
+      zIndex: 1001
+    }
+  }
+}), v = ({
+  content: e,
+  children: i,
+  placement: a = "top",
+  openDelay: n = 700,
+  closeDelay: m = 300,
+  disabled: p = !1,
+  className: l,
+  ...d
+}) => {
+  const [c, x] = t.splitVariantProps(d), r = t(c);
+  return /* @__PURE__ */ s(
+    w,
+    {
+      openDelay: n,
+      closeDelay: m,
+      positioning: { placement: a, arrowPadding: 8 },
+      disabled: p,
+      children: [
+        /* @__PURE__ */ o(T, { asChild: !0, children: i }),
+        /* @__PURE__ */ o(g, { children: /* @__PURE__ */ s(
+          h,
+          {
+            className: y(r.content, l),
+            ...x,
+            children: [
+              /* @__PURE__ */ o(u, { className: r.arrow, children: /* @__PURE__ */ o(S, { className: r.arrowTip }) }),
+              e
+            ]
+          }
+        ) })
+      ]
+    }
+  );
+};
+v.displayName = "Tooltip";
+export {
+  v as Tooltip
+};

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

@@ -0,0 +1 @@
+export * from './Tooltip.tsx';

package/dist/components/Tooltip/index.js

@@ -0,0 +1,4 @@
+import { Tooltip as r } from "./Tooltip.js";
+export {
+  r as Tooltip
+};

package/dist/index.d.ts

@@ -28,4 +28,5 @@ export * from './components/Tabs/index.ts';
 export * from './components/TextArea/index.ts';
 export * from './components/TextField/index.ts';
 export * from './components/Toast/index.ts';
+export * from './components/Tooltip/index.ts';
 export * from './components/TopAppBar/index.ts';

package/dist/index.js

@@ -2,7 +2,7 @@ import { SerendiePreset as e } from "./preset.js";
 import { Accordion as a } from "./components/Accordion/Accordion.js";
 import { AccordionGroup as m } from "./components/Accordion/AccordionGroup.js";
 import { Avatar as x, AvatarStyle as n } from "./components/Avatar/Avatar.js";
-import { Badge as f, BadgeCloseButton as s, BadgeStyle as d } from "./components/Badge/Badge.js";
+import { Badge as c, BadgeCloseButton as s, BadgeStyle as l } from "./components/Badge/Badge.js";
 import { Banner as h } from "./components/Banner/Banner.js";
 import { BottomNavigation as S } from "./components/BottomNavigation/BottomNavigation.js";
 import { BottomNavigationItem as g, BottomNavigationItemStyle as y } from "./components/BottomNavigation/BottomNavigationItem.js";
@@ -18,7 +18,7 @@ import { Drawer as oo } from "./components/Drawer/Drawer.js";
 import { DropdownMenu as eo, DropdownMenuStyle as to } from "./components/DropdownMenu/DropdownMenu.js";
 import { IconButton as po, IconButtonStyle as mo } from "./components/IconButton/IconButton.js";
 import { List as xo } from "./components/List/List.js";
-import { ListItem as co, ListItemStyle as fo } from "./components/List/ListItem.js";
+import { ListItem as fo, ListItemStyle as co } from "./components/List/ListItem.js";
 import { ModalDialog as lo } from "./components/ModalDialog/ModalDialog.js";
 import { NotificationBadge as Co } from "./components/NotificationBadge/NotificationBadge.js";
 import { Pagination as Bo, PaginationStyle as go } from "./components/Pagination/Pagination.js";
@@ -34,16 +34,17 @@ import { TabItem as Oo, TabItemStyle as Qo } from "./components/Tabs/TabItem.js"
 import { TextArea as Xo } from "./components/TextArea/TextArea.js";
 import { TextField as Zo } from "./components/TextField/TextField.js";
 import { Toast as $o, ToastStyle as or, toaster as rr } from "./components/Toast/Toast.js";
-import { TopAppBar as tr } from "./components/TopAppBar/TopAppBar.js";
-import { DataTableComponent as pr } from "./components/DataTable/DataTableComponent.js";
+import { Tooltip as tr } from "./components/Tooltip/Tooltip.js";
+import { TopAppBar as pr } from "./components/TopAppBar/TopAppBar.js";
+import { DataTableComponent as ir } from "./components/DataTable/DataTableComponent.js";
 export {
   a as Accordion,
   m as AccordionGroup,
   x as Avatar,
   n as AvatarStyle,
-  f as Badge,
+  c as Badge,
   s as BadgeCloseButton,
-  d as BadgeStyle,
+  l as BadgeStyle,
   h as Banner,
   S as BottomNavigation,
   g as BottomNavigationItem,
@@ -56,7 +57,7 @@ export {
   K as ChoiceBoxStyle,
   Q as DashboardWidget,
   X as DataTable,
-  pr as DataTableComponent,
+  ir as DataTableComponent,
   Z as Divider,
   _ as DividerStyle,
   oo as Drawer,
@@ -65,8 +66,8 @@ export {
   po as IconButton,
   mo as IconButtonStyle,
   xo as List,
-  co as ListItem,
-  fo as ListItemStyle,
+  fo as ListItem,
+  co as ListItemStyle,
   lo as ModalDialog,
   Co as NotificationBadge,
   Bo as Pagination,
@@ -93,7 +94,8 @@ export {
   Zo as TextField,
   $o as Toast,
   or as ToastStyle,
-  tr as TopAppBar,
+  tr as Tooltip,
+  pr as TopAppBar,
   q as checkboxCheckedIconCss,
   z as checkboxIconCss,
   E as checkboxUncheckedIconCss,

package/dist/node_modules/@ark-ui/react/dist/components/tooltip/tooltip-arrow-tip.js

@@ -0,0 +1,13 @@
+import { jsx as i } from "react/jsx-runtime";
+import { forwardRef as m } from "react";
+import { ark as e } from "../factory.js";
+import { useTooltipContext as s } from "./use-tooltip-context.js";
+import { mergeProps as f } from "../../../../../@zag-js/core/dist/index.js";
+const T = m((o, r) => {
+  const t = s(), p = f(t.getArrowTipProps(), o);
+  return /* @__PURE__ */ i(e.div, { ...p, ref: r });
+});
+T.displayName = "TooltipArrowTip";
+export {
+  T as TooltipArrowTip
+};

package/dist/node_modules/@ark-ui/react/dist/components/tooltip/tooltip-arrow.js

@@ -0,0 +1,13 @@
+import { jsx as m } from "react/jsx-runtime";
+import { forwardRef as e } from "react";
+import { ark as i } from "../factory.js";
+import { useTooltipContext as s } from "./use-tooltip-context.js";
+import { mergeProps as f } from "../../../../../@zag-js/core/dist/index.js";
+const l = e((o, r) => {
+  const t = s(), p = f(t.getArrowProps(), o);
+  return /* @__PURE__ */ m(i.div, { ...p, ref: r });
+});
+l.displayName = "TooltipArrow";
+export {
+  l as TooltipArrow
+};

package/dist/node_modules/@ark-ui/react/dist/components/tooltip/tooltip-content.js

@@ -0,0 +1,15 @@
+import { jsx as m } from "react/jsx-runtime";
+import { forwardRef as p } from "react";
+import { composeRefs as s } from "../../utils/compose-refs.js";
+import { ark as i } from "../factory.js";
+import { usePresenceContext as f } from "../presence/use-presence-context.js";
+import { useTooltipContext as c } from "./use-tooltip-context.js";
+import { mergeProps as l } from "../../../../../@zag-js/core/dist/index.js";
+const u = p((r, e) => {
+  const t = c(), o = f(), n = l(t.getContentProps(), o.getPresenceProps(), r);
+  return o.unmounted ? null : /* @__PURE__ */ m(i.div, { ...n, ref: s(o.ref, e) });
+});
+u.displayName = "TooltipContent";
+export {
+  u as TooltipContent
+};

package/dist/node_modules/@ark-ui/react/dist/components/tooltip/tooltip-positioner.js

@@ -0,0 +1,14 @@
+import { jsx as i } from "react/jsx-runtime";
+import { forwardRef as n } from "react";
+import { ark as p } from "../factory.js";
+import { usePresenceContext as s } from "../presence/use-presence-context.js";
+import { useTooltipContext as m } from "./use-tooltip-context.js";
+import { mergeProps as f } from "../../../../../@zag-js/core/dist/index.js";
+const c = n((o, r) => {
+  const e = m(), t = f(e.getPositionerProps(), o);
+  return s().unmounted ? null : /* @__PURE__ */ i(p.div, { ...t, ref: r });
+});
+c.displayName = "TooltipPositioner";
+export {
+  c as TooltipPositioner
+};

package/dist/node_modules/@ark-ui/react/dist/components/tooltip/tooltip-root.js

@@ -0,0 +1,14 @@
+import { jsx as r } from "react/jsx-runtime";
+import { splitPresenceProps as m } from "../presence/split-presence-props.js";
+import { usePresence as n } from "../presence/use-presence.js";
+import { PresenceProvider as c } from "../presence/use-presence-context.js";
+import { useTooltip as l } from "./use-tooltip.js";
+import { TooltipProvider as P } from "./use-tooltip-context.js";
+import { mergeProps as f } from "../../../../../@zag-js/core/dist/index.js";
+const g = (e) => {
+  const [p, { children: t, ...s }] = m(e), o = l(s), i = n(f({ present: o.open }, p));
+  return /* @__PURE__ */ r(P, { value: o, children: /* @__PURE__ */ r(c, { value: i, children: t }) });
+};
+export {
+  g as TooltipRoot
+};

package/dist/node_modules/@ark-ui/react/dist/components/tooltip/tooltip-trigger.js

@@ -0,0 +1,13 @@
+import { jsx as p } from "react/jsx-runtime";
+import { forwardRef as i } from "react";
+import { ark as m } from "../factory.js";
+import { useTooltipContext as g } from "./use-tooltip-context.js";
+import { mergeProps as s } from "../../../../../@zag-js/core/dist/index.js";
+const f = i((o, r) => {
+  const t = g(), e = s(t.getTriggerProps(), o);
+  return /* @__PURE__ */ p(m.button, { ...e, ref: r });
+});
+f.displayName = "TooltipTrigger";
+export {
+  f as TooltipTrigger
+};

package/dist/node_modules/@ark-ui/react/dist/components/tooltip/use-tooltip-context.js

@@ -0,0 +1,10 @@
+import { createContext as o } from "../../utils/create-context.js";
+const [e, r] = o({
+  name: "TooltipContext",
+  hookName: "useTooltipContext",
+  providerName: "<TooltipProvider />"
+});
+export {
+  e as TooltipProvider,
+  r as useTooltipContext
+};

package/dist/node_modules/@ark-ui/react/dist/components/tooltip/use-tooltip.js

@@ -0,0 +1,17 @@
+import { useMachine as m, normalizeProps as s } from "../../../../../@zag-js/react/dist/index.js";
+import { machine as c, connect as p } from "../../../../../@zag-js/tooltip/dist/index.js";
+import { useId as u } from "react";
+import { useEnvironmentContext as a } from "../../providers/environment/use-environment-context.js";
+import { useLocaleContext as f } from "../../providers/locale/use-locale-context.js";
+const C = (o) => {
+  const t = u(), { getRootNode: e } = a(), { dir: r } = f(), n = {
+    id: t,
+    dir: r,
+    getRootNode: e,
+    ...o
+  }, i = m(c, n);
+  return p(i, s);
+};
+export {
+  C as useTooltip
+};