@serendie/ui 0.2.3 → 1.0.0

package/dist/index.js

@@ -1,53 +1,54 @@
 import { SerendiePreset as t } from "./preset.js";
-import { Accordion as m } from "./components/Accordion/Accordion.js";
-import { AccordionGroup as a } from "./components/AccordionGroup.js";
-import { Avatar as c, AvatarStyle as i } from "./components/Avatar.js";
-import { Badge as n, BadgeCloseButton as d, BadgeStyle as s } from "./components/Badge.js";
-import { Banner as S } from "./components/Banner.js";
-import { BottomNavigation as y } from "./components/BottomNavigation.js";
-import { BottomNavigationItem as I, BottomNavigationItemStyle as C } from "./components/BottomNavigationItem.js";
-import { Button as u, ButtonStyle as k } from "./components/Button.js";
-import { CheckBox as b, CheckBoxStyle as v, checkboxCheckedIconCss as D, checkboxIconCss as w, checkboxUncheckedIconCss as A } from "./components/CheckBox.js";
-import { ChoiceBox as P, ChoiceBoxStyle as L } from "./components/ChoiceBox.js";
-import { DashboardWidget as R } from "./components/DashboardWidget.js";
-import { Divider as G, DividerStyle as U } from "./components/Divider.js";
-import { Drawer as j } from "./components/Drawer.js";
-import { DropdownMenu as z, DropdownMenuStyle as E } from "./components/DropdownMenu.js";
-import { IconButton as J, IconButtonStyle as K } from "./components/IconButton.js";
-import { List as Q } from "./components/List.js";
-import { ListItem as X, ListItemStyle as Y } from "./components/ListItem.js";
-import { ModalDialog as _ } from "./components/ModalDialog.js";
-import { NotificationBadge as oo } from "./components/NotificationBadge.js";
-import { PasswordField as to } from "./components/PasswordField.js";
-import { ProgressIndicator as mo, ProgressIndicatorStyle as xo } from "./components/ProgressIndicator.js";
-import { RadioButton as po, RadioButtonStyle as co, radioCheckedIconCss as io, radioIconCss as fo, radioUncheckedIconCss as no } from "./components/RadioButton.js";
-import { RadioGroup as lo } from "./components/RadioGroup.js";
-import { Search as Bo, SearchStyle as yo } from "./components/Search.js";
-import { Select as Io, SelectStyle as Co } from "./components/Select.js";
-import { Switch as uo, SwitchStyle as ko } from "./components/Switch.js";
-import { TabItem as bo, TabItemStyle as vo } from "./components/TabItem.js";
-import { Tabs as wo, TabsStyle as Ao } from "./components/Tabs.js";
-import { TextArea as Po } from "./components/TextArea.js";
-import { TextField as Mo } from "./components/TextField.js";
-import { Toast as Fo, ToastStyle as Go, toaster as Uo } from "./components/Toast.js";
-import { TopAppBar as jo } from "./components/TopAppBar.js";
+import { Accordion as a } from "./components/Accordion/Accordion.js";
+import { AccordionGroup as x } from "./components/Accordion/AccordionGroup.js";
+import { Avatar as i, AvatarStyle as c } from "./components/Avatar/Avatar.js";
+import { Badge as f, BadgeCloseButton as d, BadgeStyle as s } from "./components/Badge/Badge.js";
+import { Banner as S } from "./components/Banner/Banner.js";
+import { BottomNavigation as y } from "./components/BottomNavigation/BottomNavigation.js";
+import { BottomNavigationItem as I, BottomNavigationItemStyle as g } from "./components/BottomNavigation/BottomNavigationItem.js";
+import { Button as u, ButtonStyle as k } from "./components/Button/Button.js";
+import { CheckBox as b, CheckBoxStyle as v, checkboxCheckedIconCss as D, checkboxIconCss as w, checkboxUncheckedIconCss as A } from "./components/CheckBox/CheckBox.js";
+import { ChoiceBox as N, ChoiceBoxStyle as L } from "./components/ChoiceBox/ChoiceBox.js";
+import { DashboardWidget as R } from "./components/DashboardWidget/DashboardWidget.js";
+import { Divider as G, DividerStyle as U } from "./components/Divider/Divider.js";
+import { Drawer as j } from "./components/Drawer/Drawer.js";
+import { DropdownMenu as z, DropdownMenuStyle as E } from "./components/DropdownMenu/DropdownMenu.js";
+import { IconButton as J, IconButtonStyle as K } from "./components/IconButton/IconButton.js";
+import { List as Q } from "./components/List/List.js";
+import { ListItem as X, ListItemStyle as Y } from "./components/List/ListItem.js";
+import { ModalDialog as _ } from "./components/ModalDialog/ModalDialog.js";
+import { NotificationBadge as oo } from "./components/NotificationBadge/NotificationBadge.js";
+import { Pagination as to, PaginationStyle as ro } from "./components/Pagination/Pagination.js";
+import { PasswordField as mo } from "./components/PasswordField/PasswordField.js";
+import { ProgressIndicator as po, ProgressIndicatorStyle as io } from "./components/ProgressIndicator/ProgressIndicator.js";
+import { RadioButton as no, RadioButtonStyle as fo, radioCheckedIconCss as so, radioIconCss as lo, radioUncheckedIconCss as So } from "./components/RadioButton/RadioButton.js";
+import { RadioGroup as yo } from "./components/RadioButton/RadioGroup.js";
+import { Search as Io, SearchStyle as go } from "./components/Search/Search.js";
+import { Select as uo, SelectStyle as ko } from "./components/Select/Select.js";
+import { Switch as bo, SwitchStyle as vo } from "./components/Switch/Switch.js";
+import { Tabs as wo, TabsStyle as Ao } from "./components/Tabs/Tabs.js";
+import { TabItem as No, TabItemStyle as Lo } from "./components/Tabs/TabItem.js";
+import { TextArea as Ro } from "./components/TextArea/TextArea.js";
+import { TextField as Go } from "./components/TextField/TextField.js";
+import { Toast as Wo, ToastStyle as jo, toaster as qo } from "./components/Toast/Toast.js";
+import { TopAppBar as Eo } from "./components/TopAppBar/TopAppBar.js";
 export {
-  m as Accordion,
-  a as AccordionGroup,
-  c as Avatar,
-  i as AvatarStyle,
-  n as Badge,
+  a as Accordion,
+  x as AccordionGroup,
+  i as Avatar,
+  c as AvatarStyle,
+  f as Badge,
   d as BadgeCloseButton,
   s as BadgeStyle,
   S as Banner,
   y as BottomNavigation,
   I as BottomNavigationItem,
-  C as BottomNavigationItemStyle,
+  g as BottomNavigationItemStyle,
   u as Button,
   k as ButtonStyle,
   b as CheckBox,
   v as CheckBoxStyle,
-  P as ChoiceBox,
+  N as ChoiceBox,
   L as ChoiceBoxStyle,
   R as DashboardWidget,
   G as Divider,
@@ -62,33 +63,35 @@ export {
   Y as ListItemStyle,
   _ as ModalDialog,
   oo as NotificationBadge,
-  to as PasswordField,
-  mo as ProgressIndicator,
-  xo as ProgressIndicatorStyle,
-  po as RadioButton,
-  co as RadioButtonStyle,
-  lo as RadioGroup,
-  Bo as Search,
-  yo as SearchStyle,
-  Io as Select,
-  Co as SelectStyle,
+  to as Pagination,
+  ro as PaginationStyle,
+  mo as PasswordField,
+  po as ProgressIndicator,
+  io as ProgressIndicatorStyle,
+  no as RadioButton,
+  fo as RadioButtonStyle,
+  yo as RadioGroup,
+  Io as Search,
+  go as SearchStyle,
+  uo as Select,
+  ko as SelectStyle,
   t as SerendiePreset,
-  uo as Switch,
-  ko as SwitchStyle,
-  bo as TabItem,
-  vo as TabItemStyle,
+  bo as Switch,
+  vo as SwitchStyle,
+  No as TabItem,
+  Lo as TabItemStyle,
   wo as Tabs,
   Ao as TabsStyle,
-  Po as TextArea,
-  Mo as TextField,
-  Fo as Toast,
-  Go as ToastStyle,
-  jo as TopAppBar,
+  Ro as TextArea,
+  Go as TextField,
+  Wo as Toast,
+  jo as ToastStyle,
+  Eo as TopAppBar,
   D as checkboxCheckedIconCss,
   w as checkboxIconCss,
   A as checkboxUncheckedIconCss,
-  io as radioCheckedIconCss,
-  fo as radioIconCss,
-  no as radioUncheckedIconCss,
-  Uo as toaster
+  so as radioCheckedIconCss,
+  lo as radioIconCss,
+  So as radioUncheckedIconCss,
+  qo as toaster
 };

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

@@ -0,0 +1,5 @@
+import { usePaginationContext as n } from "./use-pagination-context.js";
+const i = (t) => t.children(n());
+export {
+  i as PaginationContext
+};

package/dist/node_modules/@ark-ui/react/dist/components/pagination/pagination-ellipsis.js

@@ -0,0 +1,16 @@
+import { jsx as e } from "react/jsx-runtime";
+import { forwardRef as m } from "react";
+import { createSplitProps as n } from "../../utils/create-split-props.js";
+import { ark as a } from "../factory.js";
+import { usePaginationContext as l } from "./use-pagination-context.js";
+import { mergeProps as P } from "../../../../../@zag-js/core/dist/index.js";
+const f = m(
+  (o, r) => {
+    const [i, s] = n()(o, ["index"]), t = l(), p = P(t.getEllipsisProps(i), s);
+    return /* @__PURE__ */ e(a.div, { ...p, ref: r });
+  }
+);
+f.displayName = "PaginationEllipsis";
+export {
+  f as PaginationEllipsis
+};

package/dist/node_modules/@ark-ui/react/dist/components/pagination/pagination-item.js

@@ -0,0 +1,14 @@
+import { jsx as p } from "react/jsx-runtime";
+import { forwardRef as a } from "react";
+import { createSplitProps as n } from "../../utils/create-split-props.js";
+import { ark as s } from "../factory.js";
+import { usePaginationContext as P } from "./use-pagination-context.js";
+import { mergeProps as f } from "../../../../../@zag-js/core/dist/index.js";
+const g = a((o, t) => {
+  const [r, e] = n()(o, ["value", "type"]), m = P(), i = f(m.getItemProps(r), e);
+  return /* @__PURE__ */ p(s.button, { ...i, ref: t });
+});
+g.displayName = "PaginationItem";
+export {
+  g as PaginationItem
+};

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

@@ -0,0 +1,15 @@
+import { jsx as i } from "react/jsx-runtime";
+import { forwardRef as n } from "react";
+import { ark as g } from "../factory.js";
+import { usePaginationContext as m } from "./use-pagination-context.js";
+import { mergeProps as a } from "../../../../../@zag-js/core/dist/index.js";
+const p = n(
+  (r, o) => {
+    const t = m(), e = a(t.getNextTriggerProps(), r);
+    return /* @__PURE__ */ i(g.button, { ...e, ref: o });
+  }
+);
+p.displayName = "PaginationNextTrigger";
+export {
+  p as PaginationNextTrigger
+};

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

@@ -0,0 +1,15 @@
+import { jsx as i } from "react/jsx-runtime";
+import { forwardRef as n } from "react";
+import { ark as g } from "../factory.js";
+import { usePaginationContext as m } from "./use-pagination-context.js";
+import { mergeProps as a } from "../../../../../@zag-js/core/dist/index.js";
+const p = n(
+  (r, o) => {
+    const t = m(), e = a(t.getPrevTriggerProps(), r);
+    return /* @__PURE__ */ i(g.button, { ...e, ref: o });
+  }
+);
+p.displayName = "PaginationPrevTrigger";
+export {
+  p as PaginationPrevTrigger
+};

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

@@ -0,0 +1,27 @@
+import { jsx as r } from "react/jsx-runtime";
+import { forwardRef as p } from "react";
+import { createSplitProps as g } from "../../utils/create-split-props.js";
+import { ark as m } from "../factory.js";
+import { usePagination as s } from "./use-pagination.js";
+import { PaginationProvider as P } from "./use-pagination-context.js";
+import { mergeProps as f } from "../../../../../@zag-js/core/dist/index.js";
+const l = p((t, a) => {
+  const [i, n] = g()(t, [
+    "count",
+    "defaultPage",
+    "id",
+    "ids",
+    "onPageChange",
+    "onPageSizeChange",
+    "page",
+    "pageSize",
+    "siblingCount",
+    "translations",
+    "type"
+  ]), o = s(i), e = f(o.getRootProps(), n);
+  return /* @__PURE__ */ r(P, { value: o, children: /* @__PURE__ */ r(m.nav, { ...e, ref: a }) });
+});
+l.displayName = "PaginationRoot";
+export {
+  l as PaginationRoot
+};

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

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

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

@@ -0,0 +1,23 @@
+import { machine as m, connect as c } from "../../../../../@zag-js/pagination/dist/index.js";
+import { useMachine as s, normalizeProps as g } from "../../../../../@zag-js/react/dist/index.js";
+import { useId as u } from "react";
+import { useEnvironmentContext as f } from "../../providers/environment/use-environment-context.js";
+import { useLocaleContext as d } from "../../providers/locale/use-locale-context.js";
+import { useEvent as p } from "../../utils/use-event.js";
+const E = (e) => {
+  const { getRootNode: o } = f(), { dir: n } = d(), t = {
+    id: u(),
+    dir: n,
+    getRootNode: o,
+    page: e.defaultPage,
+    ...e
+  }, a = {
+    ...t,
+    page: e.page,
+    onPageChange: p(e.onPageChange, { sync: !0 })
+  }, [i, r] = s(m(t), { context: a });
+  return c(i, r, g);
+};
+export {
+  E as usePagination
+};

package/dist/node_modules/@zag-js/pagination/dist/index.js

@@ -0,0 +1,279 @@
+import { createAnatomy as A } from "../../anatomy/dist/index.js";
+import { dataAttr as b, createScope as h } from "../../dom-query/dist/index.js";
+import { createMachine as G } from "../../core/dist/index.js";
+import { compact as L, isEqual as R } from "../../utils/dist/index.js";
+import { createProps as v } from "../../types/dist/index.js";
+var z = A("pagination").parts("root", "item", "ellipsis", "prevTrigger", "nextTrigger"), d = z.build(), u = h({
+  getRootId: (t) => {
+    var a;
+    return ((a = t.ids) == null ? void 0 : a.root) ?? `pagination:${t.id}`;
+  },
+  getPrevTriggerId: (t) => {
+    var a;
+    return ((a = t.ids) == null ? void 0 : a.prevTrigger) ?? `pagination:${t.id}:prev`;
+  },
+  getNextTriggerId: (t) => {
+    var a;
+    return ((a = t.ids) == null ? void 0 : a.nextTrigger) ?? `pagination:${t.id}:next`;
+  },
+  getEllipsisId: (t, a) => {
+    var e, g;
+    return ((g = (e = t.ids) == null ? void 0 : e.ellipsis) == null ? void 0 : g.call(e, a)) ?? `pagination:${t.id}:ellipsis:${a}`;
+  },
+  getItemId: (t, a) => {
+    var e, g;
+    return ((g = (e = t.ids) == null ? void 0 : e.item) == null ? void 0 : g.call(e, a)) ?? `pagination:${t.id}:item:${a}`;
+  }
+}), S = (t, a) => {
+  let e = a - t + 1;
+  return Array.from({ length: e }, (g, o) => o + t);
+}, N = (t) => t.map((a) => typeof a == "number" ? { type: "page", value: a } : { type: "ellipsis" }), m = "ellipsis", x = (t) => {
+  const a = Math.min(2 * t.siblingCount + 5, t.totalPages), e = 1, g = t.totalPages, o = Math.max(t.page - t.siblingCount, e), n = Math.min(t.page + t.siblingCount, g), s = o > e + 1, p = n < g - 1, c = a - 2;
+  if (!s && p)
+    return [...S(1, c), m, g];
+  if (s && !p) {
+    const l = S(g - c + 1, g);
+    return [e, m, ...l];
+  }
+  if (s && p) {
+    const l = S(o, n);
+    return [e, m, ...l, m, g];
+  }
+  return S(e, g);
+}, V = (t) => N(x(t));
+function X(t, a, e) {
+  const g = t.context.totalPages, o = t.context.page, n = t.context.translations, s = t.context.count, p = t.context.previousPage, c = t.context.nextPage, T = t.context.pageRange, E = t.context.type === "button", f = o === 1, I = o === g, _ = V(t.context);
+  return {
+    count: s,
+    page: o,
+    pageSize: t.context.pageSize,
+    totalPages: g,
+    pages: _,
+    previousPage: p,
+    nextPage: c,
+    pageRange: T,
+    slice(i) {
+      return i.slice(T.start, T.end);
+    },
+    setCount(i) {
+      a({ type: "SET_COUNT", count: i });
+    },
+    setPageSize(i) {
+      a({ type: "SET_PAGE_SIZE", size: i });
+    },
+    setPage(i) {
+      a({ type: "SET_PAGE", page: i });
+    },
+    goToNextPage() {
+      a({ type: "NEXT_PAGE" });
+    },
+    goToPrevPage() {
+      a({ type: "PREVIOUS_PAGE" });
+    },
+    goToFirstPage() {
+      a({ type: "FIRST_PAGE" });
+    },
+    goToLastPage() {
+      a({ type: "LAST_PAGE" });
+    },
+    getRootProps() {
+      return e.element({
+        id: u.getRootId(t.context),
+        ...d.root.attrs,
+        dir: t.context.dir,
+        "aria-label": n.rootLabel
+      });
+    },
+    getEllipsisProps(i) {
+      return e.element({
+        id: u.getEllipsisId(t.context, i.index),
+        ...d.ellipsis.attrs,
+        dir: t.context.dir
+      });
+    },
+    getItemProps(i) {
+      var C;
+      const P = i.value, y = P === t.context.page;
+      return e.element({
+        id: u.getItemId(t.context, P),
+        ...d.item.attrs,
+        dir: t.context.dir,
+        "data-index": P,
+        "data-selected": b(y),
+        "aria-current": y ? "page" : void 0,
+        "aria-label": (C = n.itemLabel) == null ? void 0 : C.call(n, { page: P, totalPages: g }),
+        onClick() {
+          a({ type: "SET_PAGE", page: P });
+        },
+        ...E && { type: "button" }
+      });
+    },
+    getPrevTriggerProps() {
+      return e.element({
+        id: u.getPrevTriggerId(t.context),
+        ...d.prevTrigger.attrs,
+        dir: t.context.dir,
+        "data-disabled": b(f),
+        "aria-label": n.prevTriggerLabel,
+        onClick() {
+          a({ type: "PREVIOUS_PAGE" });
+        },
+        ...E && { disabled: f, type: "button" }
+      });
+    },
+    getNextTriggerProps() {
+      return e.element({
+        id: u.getNextTriggerId(t.context),
+        ...d.nextTrigger.attrs,
+        dir: t.context.dir,
+        "data-disabled": b(I),
+        "aria-label": n.nextTriggerLabel,
+        onClick() {
+          a({ type: "NEXT_PAGE" });
+        },
+        ...E && { disabled: I, type: "button" }
+      });
+    }
+  };
+}
+var $ = {
+  rootLabel: "pagination",
+  prevTriggerLabel: "previous page",
+  nextTriggerLabel: "next page",
+  itemLabel({ page: t, totalPages: a }) {
+    return `${a > 1 && t === a ? "last page, " : ""}page ${t}`;
+  }
+};
+function Z(t) {
+  const a = L(t);
+  return G(
+    {
+      id: "pagination",
+      initial: "idle",
+      context: {
+        pageSize: 10,
+        siblingCount: 1,
+        page: 1,
+        type: "button",
+        translations: {
+          ...$,
+          ...a.translations
+        },
+        ...a
+      },
+      watch: {
+        pageSize: ["setPageIfNeeded"]
+      },
+      computed: {
+        totalPages: (e) => Math.ceil(e.count / e.pageSize),
+        previousPage: (e) => e.page === 1 ? null : e.page - 1,
+        nextPage: (e) => e.page === e.totalPages ? null : e.page + 1,
+        pageRange: (e) => {
+          const g = (e.page - 1) * e.pageSize, o = g + e.pageSize;
+          return { start: g, end: o };
+        },
+        isValidPage: (e) => e.page >= 1 && e.page <= e.totalPages
+      },
+      on: {
+        SET_COUNT: [
+          {
+            guard: "isValidCount",
+            actions: ["setCount", "goToFirstPage"]
+          },
+          {
+            actions: "setCount"
+          }
+        ],
+        SET_PAGE: {
+          guard: "isValidPage",
+          actions: "setPage"
+        },
+        SET_PAGE_SIZE: {
+          actions: "setPageSize"
+        },
+        FIRST_PAGE: {
+          actions: "goToFirstPage"
+        },
+        LAST_PAGE: {
+          actions: "goToLastPage"
+        },
+        PREVIOUS_PAGE: {
+          guard: "canGoToPrevPage",
+          actions: "goToPrevPage"
+        },
+        NEXT_PAGE: {
+          guard: "canGoToNextPage",
+          actions: "goToNextPage"
+        }
+      },
+      states: {
+        idle: {}
+      }
+    },
+    {
+      guards: {
+        isValidPage: (e, g) => g.page >= 1 && g.page <= e.totalPages,
+        isValidCount: (e, g) => e.page > g.count,
+        canGoToNextPage: (e) => e.page < e.totalPages,
+        canGoToPrevPage: (e) => e.page > 1
+      },
+      actions: {
+        setCount(e, g) {
+          e.count = g.count;
+        },
+        setPage(e, g) {
+          r.page(e, g.page);
+        },
+        setPageSize(e, g) {
+          r.pageSize(e, g.size);
+        },
+        goToFirstPage(e) {
+          r.page(e, 1);
+        },
+        goToLastPage(e) {
+          r.page(e, e.totalPages);
+        },
+        goToPrevPage(e) {
+          r.page(e, e.page - 1);
+        },
+        goToNextPage(e) {
+          r.page(e, e.page + 1);
+        },
+        setPageIfNeeded(e, g) {
+          e.isValidPage || r.page(e, 1);
+        }
+      }
+    }
+  );
+}
+var F = (t, a) => Math.min(Math.max(t, 1), a), r = {
+  pageSize: (t, a) => {
+    var e;
+    R(t.pageSize, a) || (t.pageSize = a, (e = t.onPageSizeChange) == null || e.call(t, { pageSize: t.pageSize }));
+  },
+  page: (t, a) => {
+    var e;
+    R(t.page, a) || (t.page = F(a, t.totalPages), (e = t.onPageChange) == null || e.call(t, { page: t.page, pageSize: t.pageSize }));
+  }
+};
+v()([
+  "count",
+  "dir",
+  "getRootNode",
+  "id",
+  "ids",
+  "onPageChange",
+  "onPageSizeChange",
+  "page",
+  "pageSize",
+  "siblingCount",
+  "translations",
+  "type"
+]);
+v()(["value", "type"]);
+v()(["index"]);
+export {
+  z as anatomy,
+  X as connect,
+  Z as machine
+};