@yamada-ui/pagination 0.4.22 → 0.5.0

This diff represents the content of publicly available package versions that have been released to one of the supported registries. The information contained in this diff is provided for informational purposes only and reflects changes between package versions as they appear in their respective public registries.
Files changed (12) hide show
  1. package/README.md +1 -1
  2. package/dist/{chunk-VBISAUAV.mjs → chunk-AN3NCUZQ.mjs} +13 -3
  3. package/dist/{chunk-FTX5ORQ7.mjs → chunk-ZRFLE6ZV.mjs} +1 -1
  4. package/dist/index.js +12 -2
  5. package/dist/index.mjs +2 -2
  6. package/dist/pagination-item.d.mts +6 -0
  7. package/dist/pagination-item.d.ts +6 -0
  8. package/dist/pagination-item.js +12 -2
  9. package/dist/pagination-item.mjs +1 -1
  10. package/dist/pagination.js +12 -2
  11. package/dist/pagination.mjs +2 -2
  12. package/package.json +7 -6
package/README.md CHANGED
@@ -22,7 +22,7 @@ $ npm install @yamada-ui/pagination
22
22
 
23
23
  Wouldn't you like to contribute? That's amazing! We have prepared a [contribution guide](https://github.com/hirotomoyamada/yamada-ui/blob/main/CONTRIBUTING.md) to assist you.
24
24
 
25
- ## Licence
25
+ ## License
26
26
 
27
27
  This package is licensed under the terms of the
28
28
  [MIT license](https://github.com/hirotomoyamada/yamada-ui/blob/main/LICENSE).
package/dist/{chunk-VBISAUAV.mjs → chunk-AN3NCUZQ.mjs} RENAMED
@@ -12,8 +12,9 @@ import {
12
12
 
13
13
  // src/pagination-item.tsx
14
14
  import { ui } from "@yamada-ui/core";
15
+ import { Ripple, useRipple } from "@yamada-ui/ripple";
15
16
  import { cx, dataAttr } from "@yamada-ui/utils";
16
- import { jsx } from "react/jsx-runtime";
17
+ import { jsx, jsxs } from "react/jsx-runtime";
17
18
  var iconMap = {
18
19
  dots: /* @__PURE__ */ jsx(DotsIcon, {}),
19
20
  next: /* @__PURE__ */ jsx(NextIcon, {}),
@@ -26,20 +27,25 @@ var PaginationItem = ({
26
27
  isActive,
27
28
  page,
28
29
  isDisabled,
30
+ disableRipple,
29
31
  children,
30
32
  ...rest
31
33
  }) => {
32
34
  var _a;
33
35
  const styles = usePaginationContext();
36
+ const { onClick, ...rippleProps } = useRipple(rest);
34
37
  children != null ? children : children = (_a = iconMap[page]) != null ? _a : page;
35
38
  const css = {
39
+ position: "relative",
40
+ overflow: "hidden",
41
+ userSelect: "none",
36
42
  display: "flex",
37
43
  justifyContent: "center",
38
44
  alignItems: "center",
39
45
  ...styles.item,
40
46
  ...styles[page]
41
47
  };
42
- return /* @__PURE__ */ jsx(
48
+ return /* @__PURE__ */ jsxs(
43
49
  ui.button,
44
50
  {
45
51
  className: cx("ui-pagination__item", className),
@@ -50,7 +56,11 @@ var PaginationItem = ({
50
56
  "data-disabled": dataAttr(isDisabled),
51
57
  __css: css,
52
58
  ...rest,
53
- children
59
+ onClick,
60
+ children: [
61
+ children,
62
+ /* @__PURE__ */ jsx(Ripple, { isDisabled: disableRipple || isDisabled, ...rippleProps })
63
+ ]
54
64
  }
55
65
  );
56
66
  };
package/dist/{chunk-FTX5ORQ7.mjs → chunk-ZRFLE6ZV.mjs} RENAMED
@@ -1,7 +1,7 @@
1
1
  "use client"
2
2
  import {
3
3
  PaginationItem
4
- } from "./chunk-VBISAUAV.mjs";
4
+ } from "./chunk-AN3NCUZQ.mjs";
5
5
  import {
6
6
  PaginationProvider,
7
7
  usePagination
package/dist/index.js CHANGED
@@ -34,6 +34,7 @@ var import_react2 = require("react");
34
34
 
35
35
  // src/pagination-item.tsx
36
36
  var import_core = require("@yamada-ui/core");
37
+ var import_ripple = require("@yamada-ui/ripple");
37
38
  var import_utils2 = require("@yamada-ui/utils");
38
39
 
39
40
  // src/pagination-icon.tsx
@@ -193,20 +194,25 @@ var PaginationItem = ({
193
194
  isActive,
194
195
  page,
195
196
  isDisabled,
197
+ disableRipple,
196
198
  children,
197
199
  ...rest
198
200
  }) => {
199
201
  var _a;
200
202
  const styles = usePaginationContext();
203
+ const { onClick, ...rippleProps } = (0, import_ripple.useRipple)(rest);
201
204
  children != null ? children : children = (_a = iconMap[page]) != null ? _a : page;
202
205
  const css = {
206
+ position: "relative",
207
+ overflow: "hidden",
208
+ userSelect: "none",
203
209
  display: "flex",
204
210
  justifyContent: "center",
205
211
  alignItems: "center",
206
212
  ...styles.item,
207
213
  ...styles[page]
208
214
  };
209
- return /* @__PURE__ */ (0, import_jsx_runtime2.jsx)(
215
+ return /* @__PURE__ */ (0, import_jsx_runtime2.jsxs)(
210
216
  import_core.ui.button,
211
217
  {
212
218
  className: (0, import_utils2.cx)("ui-pagination__item", className),
@@ -217,7 +223,11 @@ var PaginationItem = ({
217
223
  "data-disabled": (0, import_utils2.dataAttr)(isDisabled),
218
224
  __css: css,
219
225
  ...rest,
220
- children
226
+ onClick,
227
+ children: [
228
+ children,
229
+ /* @__PURE__ */ (0, import_jsx_runtime2.jsx)(import_ripple.Ripple, { isDisabled: disableRipple || isDisabled, ...rippleProps })
230
+ ]
221
231
  }
222
232
  );
223
233
  };
package/dist/index.mjs CHANGED
@@ -1,8 +1,8 @@
1
1
  "use client"
2
2
  import {
3
3
  Pagination
4
- } from "./chunk-FTX5ORQ7.mjs";
5
- import "./chunk-VBISAUAV.mjs";
4
+ } from "./chunk-ZRFLE6ZV.mjs";
5
+ import "./chunk-AN3NCUZQ.mjs";
6
6
  import "./chunk-2P67WSOL.mjs";
7
7
  import {
8
8
  usePagination
package/dist/pagination-item.d.mts CHANGED
@@ -17,6 +17,12 @@ type PaginationItemOptions = {
17
17
  * @default false
18
18
  */
19
19
  isDisabled?: boolean;
20
+ /**
21
+ * If `true`, disable ripple effects when pressing a element.
22
+ *
23
+ * @default false
24
+ */
25
+ disableRipple?: boolean;
20
26
  };
21
27
  type PaginationItemProps = ComponentPropsWithoutRef<"button"> & PaginationItemOptions;
22
28
  declare const PaginationItem: FC<PaginationItemProps>;
package/dist/pagination-item.d.ts CHANGED
@@ -17,6 +17,12 @@ type PaginationItemOptions = {
17
17
  * @default false
18
18
  */
19
19
  isDisabled?: boolean;
20
+ /**
21
+ * If `true`, disable ripple effects when pressing a element.
22
+ *
23
+ * @default false
24
+ */
25
+ disableRipple?: boolean;
20
26
  };
21
27
  type PaginationItemProps = ComponentPropsWithoutRef<"button"> & PaginationItemOptions;
22
28
  declare const PaginationItem: FC<PaginationItemProps>;
package/dist/pagination-item.js CHANGED
@@ -25,6 +25,7 @@ __export(pagination_item_exports, {
25
25
  });
26
26
  module.exports = __toCommonJS(pagination_item_exports);
27
27
  var import_core = require("@yamada-ui/core");
28
+ var import_ripple = require("@yamada-ui/ripple");
28
29
  var import_utils2 = require("@yamada-ui/utils");
29
30
 
30
31
  // src/pagination-icon.tsx
@@ -100,20 +101,25 @@ var PaginationItem = ({
100
101
  isActive,
101
102
  page,
102
103
  isDisabled,
104
+ disableRipple,
103
105
  children,
104
106
  ...rest
105
107
  }) => {
106
108
  var _a;
107
109
  const styles = usePaginationContext();
110
+ const { onClick, ...rippleProps } = (0, import_ripple.useRipple)(rest);
108
111
  children != null ? children : children = (_a = iconMap[page]) != null ? _a : page;
109
112
  const css = {
113
+ position: "relative",
114
+ overflow: "hidden",
115
+ userSelect: "none",
110
116
  display: "flex",
111
117
  justifyContent: "center",
112
118
  alignItems: "center",
113
119
  ...styles.item,
114
120
  ...styles[page]
115
121
  };
116
- return /* @__PURE__ */ (0, import_jsx_runtime2.jsx)(
122
+ return /* @__PURE__ */ (0, import_jsx_runtime2.jsxs)(
117
123
  import_core.ui.button,
118
124
  {
119
125
  className: (0, import_utils2.cx)("ui-pagination__item", className),
@@ -124,7 +130,11 @@ var PaginationItem = ({
124
130
  "data-disabled": (0, import_utils2.dataAttr)(isDisabled),
125
131
  __css: css,
126
132
  ...rest,
127
- children
133
+ onClick,
134
+ children: [
135
+ children,
136
+ /* @__PURE__ */ (0, import_jsx_runtime2.jsx)(import_ripple.Ripple, { isDisabled: disableRipple || isDisabled, ...rippleProps })
137
+ ]
128
138
  }
129
139
  );
130
140
  };
package/dist/pagination-item.mjs CHANGED
@@ -1,7 +1,7 @@
1
1
  "use client"
2
2
  import {
3
3
  PaginationItem
4
- } from "./chunk-VBISAUAV.mjs";
4
+ } from "./chunk-AN3NCUZQ.mjs";
5
5
  import "./chunk-2P67WSOL.mjs";
6
6
  import "./chunk-5ILRVOTK.mjs";
7
7
  export {
package/dist/pagination.js CHANGED
@@ -31,6 +31,7 @@ var import_react2 = require("react");
31
31
 
32
32
  // src/pagination-item.tsx
33
33
  var import_core = require("@yamada-ui/core");
34
+ var import_ripple = require("@yamada-ui/ripple");
34
35
  var import_utils2 = require("@yamada-ui/utils");
35
36
 
36
37
  // src/pagination-icon.tsx
@@ -190,20 +191,25 @@ var PaginationItem = ({
190
191
  isActive,
191
192
  page,
192
193
  isDisabled,
194
+ disableRipple,
193
195
  children,
194
196
  ...rest
195
197
  }) => {
196
198
  var _a;
197
199
  const styles = usePaginationContext();
200
+ const { onClick, ...rippleProps } = (0, import_ripple.useRipple)(rest);
198
201
  children != null ? children : children = (_a = iconMap[page]) != null ? _a : page;
199
202
  const css = {
203
+ position: "relative",
204
+ overflow: "hidden",
205
+ userSelect: "none",
200
206
  display: "flex",
201
207
  justifyContent: "center",
202
208
  alignItems: "center",
203
209
  ...styles.item,
204
210
  ...styles[page]
205
211
  };
206
- return /* @__PURE__ */ (0, import_jsx_runtime2.jsx)(
212
+ return /* @__PURE__ */ (0, import_jsx_runtime2.jsxs)(
207
213
  import_core.ui.button,
208
214
  {
209
215
  className: (0, import_utils2.cx)("ui-pagination__item", className),
@@ -214,7 +220,11 @@ var PaginationItem = ({
214
220
  "data-disabled": (0, import_utils2.dataAttr)(isDisabled),
215
221
  __css: css,
216
222
  ...rest,
217
- children
223
+ onClick,
224
+ children: [
225
+ children,
226
+ /* @__PURE__ */ (0, import_jsx_runtime2.jsx)(import_ripple.Ripple, { isDisabled: disableRipple || isDisabled, ...rippleProps })
227
+ ]
218
228
  }
219
229
  );
220
230
  };
package/dist/pagination.mjs CHANGED
@@ -1,8 +1,8 @@
1
1
  "use client"
2
2
  import {
3
3
  Pagination
4
- } from "./chunk-FTX5ORQ7.mjs";
5
- import "./chunk-VBISAUAV.mjs";
4
+ } from "./chunk-ZRFLE6ZV.mjs";
5
+ import "./chunk-AN3NCUZQ.mjs";
6
6
  import "./chunk-2P67WSOL.mjs";
7
7
  import "./chunk-5ILRVOTK.mjs";
8
8
  export {
package/package.json CHANGED
@@ -1,6 +1,6 @@
1
1
  {
2
2
  "name": "@yamada-ui/pagination",
3
- "version": "0.4.22",
3
+ "version": "0.5.0",
4
4
  "description": "Yamada UI pagination component",
5
5
  "keywords": [
6
6
  "yamada",
@@ -35,11 +35,12 @@
35
35
  "url": "https://github.com/hirotomoyamada/yamada-ui/issues"
36
36
  },
37
37
  "dependencies": {
38
- "@yamada-ui/core": "0.13.0",
39
- "@yamada-ui/utils": "0.3.3",
40
- "@yamada-ui/icon": "0.3.19",
41
- "@yamada-ui/use-controllable-state": "0.4.0",
42
- "@yamada-ui/use-value": "0.2.19"
38
+ "@yamada-ui/core": "0.13.2",
39
+ "@yamada-ui/utils": "0.4.1",
40
+ "@yamada-ui/icon": "0.3.21",
41
+ "@yamada-ui/ripple": "0.1.1",
42
+ "@yamada-ui/use-controllable-state": "0.4.2",
43
+ "@yamada-ui/use-value": "0.2.21"
43
44
  },
44
45
  "devDependencies": {
45
46
  "react": "^18.0.0",