@yamada-ui/reorder 2.0.9 → 2.0.10-dev-20240917033401

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.
@@ -0,0 +1,20 @@
1
+ "use client"
2
+
3
+ // src/reorder-context.ts
4
+ import { createContext } from "@yamada-ui/utils";
5
+ var [ReorderProvider, useReorderContext] = createContext({
6
+ name: "ReorderContext",
7
+ errorMessage: `useReorderContext returned is 'undefined'. Seems you forgot to wrap the components in "<Reorder />"`
8
+ });
9
+ var [ReorderItemProvider, useReorderItemContext] = createContext({
10
+ name: "ReorderContext",
11
+ errorMessage: `useReorderItemContext returned is 'undefined'. Seems you forgot to wrap the components in "<ReorderItem />"`
12
+ });
13
+
14
+ export {
15
+ ReorderProvider,
16
+ useReorderContext,
17
+ ReorderItemProvider,
18
+ useReorderItemContext
19
+ };
20
+ //# sourceMappingURL=chunk-BBGHU5EB.mjs.map
@@ -0,0 +1 @@
1
+ {"version":3,"sources":["../src/reorder-context.ts"],"sourcesContent":["import type { CSSUIObject } from \"@yamada-ui/core\"\nimport type { DragControls } from \"@yamada-ui/motion\"\nimport { createContext } from \"@yamada-ui/utils\"\n\ninterface ReorderContext {\n orientation: \"vertical\" | \"horizontal\"\n styles: { [key: string]: CSSUIObject }\n}\n\nexport const [ReorderProvider, useReorderContext] =\n createContext<ReorderContext>({\n name: \"ReorderContext\",\n errorMessage: `useReorderContext returned is 'undefined'. Seems you forgot to wrap the components in \"<Reorder />\"`,\n })\n\ninterface ReorderItemContext {\n register: (node: HTMLElement | null) => void\n isDrag: boolean\n dragControls: DragControls\n}\n\nexport const [ReorderItemProvider, useReorderItemContext] =\n createContext<ReorderItemContext>({\n name: \"ReorderContext\",\n errorMessage: `useReorderItemContext returned is 'undefined'. Seems you forgot to wrap the components in \"<ReorderItem />\"`,\n })\n"],"mappings":";;;AAEA,SAAS,qBAAqB;AAOvB,IAAM,CAAC,iBAAiB,iBAAiB,IAC9C,cAA8B;AAAA,EAC5B,MAAM;AAAA,EACN,cAAc;AAChB,CAAC;AAQI,IAAM,CAAC,qBAAqB,qBAAqB,IACtD,cAAkC;AAAA,EAChC,MAAM;AAAA,EACN,cAAc;AAChB,CAAC;","names":[]}
@@ -2,7 +2,7 @@
2
2
  import {
3
3
  useReorderContext,
4
4
  useReorderItemContext
5
- } from "./chunk-LKWVADXG.mjs";
5
+ } from "./chunk-BBGHU5EB.mjs";
6
6
 
7
7
  // src/reorder-trigger.tsx
8
8
  import { ui, forwardRef } from "@yamada-ui/core";
@@ -111,4 +111,4 @@ var ReorderTriggerIcon = (rest) => {
111
111
  export {
112
112
  ReorderTrigger
113
113
  };
114
- //# sourceMappingURL=chunk-RFRSMH24.mjs.map
114
+ //# sourceMappingURL=chunk-PMOLBS6N.mjs.map
@@ -0,0 +1 @@
1
+ {"version":3,"sources":["../src/reorder-trigger.tsx"],"sourcesContent":["import type { HTMLUIProps, CSSUIObject } from \"@yamada-ui/core\"\nimport { ui, forwardRef } from \"@yamada-ui/core\"\nimport type { IconProps } from \"@yamada-ui/icon\"\nimport { Icon } from \"@yamada-ui/icon\"\nimport { cx, handlerAll, mergeRefs, dataAttr } from \"@yamada-ui/utils\"\nimport type { FC } from \"react\"\nimport { useReorderContext, useReorderItemContext } from \"./reorder-context\"\n\nexport interface ReorderTriggerProps extends HTMLUIProps {}\n\nexport const ReorderTrigger = forwardRef<ReorderTriggerProps, \"div\">(\n ({ className, children = <ReorderTriggerIcon />, ...rest }, ref) => {\n const { styles } = useReorderContext()\n const { register, isDrag, dragControls } = useReorderItemContext()\n\n const css: CSSUIObject = {\n display: \"flex\",\n justifyContent: \"center\",\n alignItems: \"center\",\n cursor: \"grab\",\n _selected: {\n cursor: \"grabbing\",\n },\n ...styles.trigger,\n }\n\n return (\n <ui.div\n ref={mergeRefs(register, ref)}\n className={cx(\"ui-reorder__trigger\", className)}\n __css={css}\n {...rest}\n data-selected={dataAttr(isDrag)}\n onPointerDown={handlerAll(rest.onPointerDown, (ev) =>\n dragControls.start(ev),\n )}\n >\n {children}\n </ui.div>\n )\n },\n)\n\nconst ReorderTriggerIcon: FC<IconProps> = (rest) => {\n return (\n <Icon viewBox=\"0 0 39 39\" {...rest}>\n <path\n d=\"M 5 0 C 7.761 0 10 2.239 10 5 C 10 7.761 7.761 10 5 10 C 2.239 10 0 7.761 0 5 C 0 2.239 2.239 0 5 0 Z\"\n fill=\"currentColor\"\n />\n\n <path\n d=\"M 19 0 C 21.761 0 24 2.239 24 5 C 24 7.761 21.761 10 19 10 C 16.239 10 14 7.761 14 5 C 14 2.239 16.239 0 19 0 Z\"\n fill=\"currentColor\"\n />\n\n <path\n d=\"M 33 0 C 35.761 0 38 2.239 38 5 C 38 7.761 35.761 10 33 10 C 30.239 10 28 7.761 28 5 C 28 2.239 30.239 0 33 0 Z\"\n fill=\"currentColor\"\n />\n\n <path\n d=\"M 33 14 C 35.761 14 38 16.239 38 19 C 38 21.761 35.761 24 33 24 C 30.239 24 28 21.761 28 19 C 28 16.239 30.239 14 33 14 Z\"\n fill=\"currentColor\"\n />\n\n <path\n d=\"M 19 14 C 21.761 14 24 16.239 24 19 C 24 21.761 21.761 24 19 24 C 16.239 24 14 21.761 14 19 C 14 16.239 16.239 14 19 14 Z\"\n fill=\"currentColor\"\n />\n\n <path\n d=\"M 5 14 C 7.761 14 10 16.239 10 19 C 10 21.761 7.761 24 5 24 C 2.239 24 0 21.761 0 19 C 0 16.239 2.239 14 5 14 Z\"\n fill=\"currentColor\"\n />\n\n <path\n d=\"M 5 28 C 7.761 28 10 30.239 10 33 C 10 35.761 7.761 38 5 38 C 2.239 38 0 35.761 0 33 C 0 30.239 2.239 28 5 28 Z\"\n fill=\"currentColor\"\n />\n\n <path\n d=\"M 19 28 C 21.761 28 24 30.239 24 33 C 24 35.761 21.761 38 19 38 C 16.239 38 14 35.761 14 33 C 14 30.239 16.239 28 19 28 Z\"\n fill=\"currentColor\"\n />\n\n <path\n d=\"M 33 28 C 35.761 28 38 30.239 38 33 C 38 35.761 35.761 38 33 38 C 30.239 38 28 35.761 28 33 C 28 30.239 30.239 28 33 28 Z\"\n fill=\"currentColor\"\n />\n </Icon>\n )\n}\n"],"mappings":";;;;;;;AACA,SAAS,IAAI,kBAAkB;AAE/B,SAAS,YAAY;AACrB,SAAS,IAAI,YAAY,WAAW,gBAAgB;AAOzB,cAkCvB,YAlCuB;AADpB,IAAM,iBAAiB;AAAA,EAC5B,CAAC,EAAE,WAAW,WAAW,oBAAC,sBAAmB,GAAI,GAAG,KAAK,GAAG,QAAQ;AAClE,UAAM,EAAE,OAAO,IAAI,kBAAkB;AACrC,UAAM,EAAE,UAAU,QAAQ,aAAa,IAAI,sBAAsB;AAEjE,UAAM,MAAmB;AAAA,MACvB,SAAS;AAAA,MACT,gBAAgB;AAAA,MAChB,YAAY;AAAA,MACZ,QAAQ;AAAA,MACR,WAAW;AAAA,QACT,QAAQ;AAAA,MACV;AAAA,MACA,GAAG,OAAO;AAAA,IACZ;AAEA,WACE;AAAA,MAAC,GAAG;AAAA,MAAH;AAAA,QACC,KAAK,UAAU,UAAU,GAAG;AAAA,QAC5B,WAAW,GAAG,uBAAuB,SAAS;AAAA,QAC9C,OAAO;AAAA,QACN,GAAG;AAAA,QACJ,iBAAe,SAAS,MAAM;AAAA,QAC9B,eAAe;AAAA,UAAW,KAAK;AAAA,UAAe,CAAC,OAC7C,aAAa,MAAM,EAAE;AAAA,QACvB;AAAA,QAEC;AAAA;AAAA,IACH;AAAA,EAEJ;AACF;AAEA,IAAM,qBAAoC,CAAC,SAAS;AAClD,SACE,qBAAC,QAAK,SAAQ,aAAa,GAAG,MAC5B;AAAA;AAAA,MAAC;AAAA;AAAA,QACC,GAAE;AAAA,QACF,MAAK;AAAA;AAAA,IACP;AAAA,IAEA;AAAA,MAAC;AAAA;AAAA,QACC,GAAE;AAAA,QACF,MAAK;AAAA;AAAA,IACP;AAAA,IAEA;AAAA,MAAC;AAAA;AAAA,QACC,GAAE;AAAA,QACF,MAAK;AAAA;AAAA,IACP;AAAA,IAEA;AAAA,MAAC;AAAA;AAAA,QACC,GAAE;AAAA,QACF,MAAK;AAAA;AAAA,IACP;AAAA,IAEA;AAAA,MAAC;AAAA;AAAA,QACC,GAAE;AAAA,QACF,MAAK;AAAA;AAAA,IACP;AAAA,IAEA;AAAA,MAAC;AAAA;AAAA,QACC,GAAE;AAAA,QACF,MAAK;AAAA;AAAA,IACP;AAAA,IAEA;AAAA,MAAC;AAAA;AAAA,QACC,GAAE;AAAA,QACF,MAAK;AAAA;AAAA,IACP;AAAA,IAEA;AAAA,MAAC;AAAA;AAAA,QACC,GAAE;AAAA,QACF,MAAK;AAAA;AAAA,IACP;AAAA,IAEA;AAAA,MAAC;AAAA;AAAA,QACC,GAAE;AAAA,QACF,MAAK;AAAA;AAAA,IACP;AAAA,KACF;AAEJ;","names":[]}
@@ -1,20 +1,15 @@
1
1
  "use client"
2
-
3
- // src/reorder-item.tsx
4
- import { ui as ui2 } from "@yamada-ui/core";
5
2
  import {
6
- MotionReorder as MotionReorder2,
7
- useMotionValue,
8
- useDragControls
9
- } from "@yamada-ui/motion";
10
- import { createContext as createContext2, cx as cx2, dataAttr } from "@yamada-ui/utils";
11
- import { forwardRef as forwardRef2, useCallback as useCallback2, useEffect, useState as useState2 } from "react";
3
+ ReorderItem
4
+ } from "./chunk-XQS37PRX.mjs";
5
+ import {
6
+ ReorderProvider
7
+ } from "./chunk-BBGHU5EB.mjs";
12
8
 
13
9
  // src/reorder.tsx
14
- import { ui, useMultiComponentStyle, omitThemeProps } from "@yamada-ui/core";
10
+ import { ui, useComponentMultiStyle, omitThemeProps } from "@yamada-ui/core";
15
11
  import { MotionReorder } from "@yamada-ui/motion";
16
12
  import {
17
- createContext,
18
13
  cx,
19
14
  getValidChildren,
20
15
  handlerAll,
@@ -22,17 +17,13 @@ import {
22
17
  } from "@yamada-ui/utils";
23
18
  import { forwardRef, useCallback, useMemo, useRef, useState } from "react";
24
19
  import { jsx } from "react/jsx-runtime";
25
- var [ReorderProvider, useReorderContext] = createContext({
26
- name: "ReorderContext",
27
- errorMessage: `useReorderContext returned is 'undefined'. Seems you forgot to wrap the components in "<Reorder />"`
28
- });
29
20
  var omitDuplicated = (values) => Array.from(new Set(values));
30
21
  var pickDuplicated = (values) => values.filter(
31
22
  (value, index, self) => self.indexOf(value) === index && index !== self.lastIndexOf(value)
32
23
  );
33
24
  var Reorder = forwardRef(
34
25
  (props, ref) => {
35
- const [styles, mergedProps] = useMultiComponentStyle("Reorder", props);
26
+ const [styles, mergedProps] = useComponentMultiStyle("Reorder", props);
36
27
  const {
37
28
  className,
38
29
  orientation = "vertical",
@@ -117,76 +108,7 @@ var Reorder = forwardRef(
117
108
  );
118
109
  Reorder.displayName = "Reorder";
119
110
 
120
- // src/reorder-item.tsx
121
- import { jsx as jsx2 } from "react/jsx-runtime";
122
- var [ReorderItemProvider, useReorderItemContext] = createContext2({
123
- name: "ReorderContext",
124
- errorMessage: `useReorderItemContext returned is 'undefined'. Seems you forgot to wrap the components in "<ReorderItem />"`
125
- });
126
- var ReorderItem = forwardRef2(
127
- ({ className, label, value, children, ...rest }, ref) => {
128
- var _a;
129
- const { orientation, styles } = useReorderContext();
130
- const dragControls = useDragControls();
131
- const [hasTrigger, setHasTrigger] = useState2(false);
132
- const [isDrag, setIsDrag] = useState2(false);
133
- const x = useMotionValue(0);
134
- const y = useMotionValue(0);
135
- const register = useCallback2(
136
- (node) => setHasTrigger(!!node),
137
- []
138
- );
139
- useEffect(() => {
140
- const unsubscribeX = x.on("change", (x2) => {
141
- if (orientation === "horizontal") setIsDrag(x2 !== 0);
142
- });
143
- const unsubscribeY = y.on("change", (y2) => {
144
- if (orientation === "vertical") setIsDrag(y2 !== 0);
145
- });
146
- return () => {
147
- unsubscribeX();
148
- unsubscribeY();
149
- };
150
- }, [orientation, x, y]);
151
- const css = {
152
- _selected: {
153
- cursor: "grabbing"
154
- },
155
- ...!hasTrigger ? { cursor: "grab" } : { userSelect: "none" },
156
- ...styles.item,
157
- ...!hasTrigger ? {
158
- _selected: {
159
- ...(_a = styles.item) == null ? void 0 : _a._selected,
160
- cursor: "grabbing"
161
- }
162
- } : {}
163
- };
164
- return /* @__PURE__ */ jsx2(ReorderItemProvider, { value: { register, isDrag, dragControls }, children: /* @__PURE__ */ jsx2(
165
- ui2.li,
166
- {
167
- ref,
168
- as: MotionReorder2.Item,
169
- className: cx2("ui-reorder__item", className),
170
- value,
171
- __css: css,
172
- ...rest,
173
- dragListener: !hasTrigger,
174
- dragControls,
175
- "data-selected": dataAttr(isDrag),
176
- style: { ...rest.style, x, y },
177
- children: children != null ? children : label
178
- }
179
- ) });
180
- }
181
- );
182
- ReorderItem.displayName = "ReorderItem";
183
-
184
111
  export {
185
- ReorderItemProvider,
186
- useReorderItemContext,
187
- ReorderItem,
188
- ReorderProvider,
189
- useReorderContext,
190
112
  Reorder
191
113
  };
192
- //# sourceMappingURL=chunk-LKWVADXG.mjs.map
114
+ //# sourceMappingURL=chunk-XB6JNHWY.mjs.map
@@ -0,0 +1 @@
1
+ {"version":3,"sources":["../src/reorder.tsx"],"sourcesContent":["import type {\n CSSUIObject,\n ComponentArgs,\n HTMLUIProps,\n ThemeProps,\n} from \"@yamada-ui/core\"\nimport { ui, useComponentMultiStyle, omitThemeProps } from \"@yamada-ui/core\"\nimport type { HTMLMotionProps } from \"@yamada-ui/motion\"\nimport { MotionReorder } from \"@yamada-ui/motion\"\nimport type { Merge } from \"@yamada-ui/utils\"\nimport {\n cx,\n getValidChildren,\n handlerAll,\n useUpdateEffect,\n} from \"@yamada-ui/utils\"\nimport type { ForwardedRef, PropsWithChildren, RefAttributes } from \"react\"\nimport { forwardRef, useCallback, useMemo, useRef, useState } from \"react\"\nimport { ReorderProvider } from \"./reorder-context\"\nimport { ReorderItem } from \"./reorder-item\"\nimport type { ReorderItemProps } from \"./reorder-item\"\n\nexport type ReorderGenerateItem<Y extends any = string> = ReorderItemProps<Y>\n\nconst omitDuplicated = <Y extends any = string>(values: Y[]): Y[] =>\n Array.from(new Set(values))\n\nconst pickDuplicated = <Y extends any = string>(values: Y[]): Y[] =>\n values.filter(\n (value, index, self) =>\n self.indexOf(value) === index && index !== self.lastIndexOf(value),\n )\n\ninterface ReorderOptions<Y extends any = string> {\n /**\n * The orientation of the reorder.\n *\n * @default 'vertical'\n */\n orientation?: \"vertical\" | \"horizontal\"\n /**\n * If provided, generate reorder items based on items.\n *\n */\n items?: ReorderGenerateItem[]\n /**\n * The callback invoked when reorder items are moved.\n */\n onChange?: (values: Y[]) => void\n /**\n * The callback invoked when the movement of reorder items is completed.\n */\n onCompleteChange?: (values: Y[]) => void\n}\n\nexport interface ReorderProps<Y extends any = string>\n extends Omit<\n Merge<HTMLUIProps<\"ul\">, HTMLMotionProps<\"ul\">>,\n \"onChange\" | \"transition\" | \"children\"\n >,\n PropsWithChildren,\n ThemeProps<\"Reorder\">,\n ReorderOptions<Y> {}\n\n/**\n * `Reorder` is a component that allows you to change the order of items using drag and drop.\n *\n * @see Docs https://yamada-ui.com/components/data-display/reorder\n */\nexport const Reorder = forwardRef(\n <Y extends any = string>(\n props: ReorderProps<Y>,\n ref: ForwardedRef<HTMLUListElement>,\n ) => {\n const [styles, mergedProps] = useComponentMultiStyle(\"Reorder\", props)\n const {\n className,\n orientation = \"vertical\",\n gap = \"fallback(4, 1rem)\",\n items = [],\n onChange,\n onCompleteChange,\n children,\n ...rest\n } = omitThemeProps(mergedProps)\n\n const axis = orientation === \"vertical\" ? \"y\" : \"x\"\n\n const validChildren = getValidChildren(children)\n const hasChildren = !!validChildren.length\n\n const defaultValues = useMemo(() => {\n const values = hasChildren\n ? validChildren.map(({ props }) => props.value)\n : items.map(({ value }) => value)\n\n const duplicatedValues = pickDuplicated(values)\n\n if (duplicatedValues.length)\n console.warn(\n `Reorder: 'value' of 'ReorderItem' must not be duplicated. duplicate 'value' is '${duplicatedValues.join(\n `', '`,\n )}' `,\n )\n\n return omitDuplicated(values)\n }, [hasChildren, validChildren, items])\n const prevDefaultValues = useRef<Y[]>(defaultValues)\n\n const [values, setValues] = useState<Y[]>(defaultValues)\n const prevValues = useRef<Y[]>(defaultValues)\n\n const onReorder = useCallback(\n (newValues: Y[]) => {\n setValues(newValues)\n\n onChange?.(newValues)\n },\n [onChange],\n )\n\n const onCompleteReorder = useCallback(() => {\n const isEqual =\n JSON.stringify(prevValues.current) === JSON.stringify(values)\n\n if (isEqual) return\n\n prevValues.current = values\n\n onCompleteChange?.(values)\n }, [onCompleteChange, values])\n\n useUpdateEffect(() => {\n const isEqual =\n JSON.stringify(defaultValues) ===\n JSON.stringify(prevDefaultValues.current)\n\n if (isEqual) return\n\n prevValues.current = defaultValues\n prevDefaultValues.current = defaultValues\n\n setValues(defaultValues)\n }, [defaultValues])\n\n const cloneChildren = useMemo(\n () =>\n values.map((value) => {\n if (hasChildren) {\n return validChildren.find(({ props }) => props.value === value)\n } else {\n const props = items.find((item) => item.value === value)\n\n return props ? <ReorderItem key={props.value} {...props} /> : null\n }\n }),\n [values, hasChildren, validChildren, items],\n )\n\n const css: CSSUIObject = {\n display: \"flex\",\n flexDirection: orientation === \"vertical\" ? \"column\" : \"row\",\n gap,\n ...styles.container,\n }\n\n return (\n <ReorderProvider value={{ orientation, styles }}>\n <ui.ul\n ref={ref}\n as={MotionReorder.Group<Y>}\n className={cx(\"ui-reorder\", className)}\n axis={axis}\n values={values}\n onReorder={onReorder}\n __css={css}\n {...rest}\n onMouseUp={handlerAll(rest.onMouseUp, onCompleteReorder)}\n onTouchEnd={handlerAll(rest.onTouchEnd, onCompleteReorder)}\n >\n {cloneChildren}\n </ui.ul>\n </ReorderProvider>\n )\n },\n) as {\n <Y = string>(\n props: ReorderProps<Y> & RefAttributes<HTMLUListElement>,\n ): JSX.Element\n} & ComponentArgs\n\nReorder.displayName = \"Reorder\"\n"],"mappings":"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","names":["values","props"]}
@@ -0,0 +1,78 @@
1
+ "use client"
2
+ import {
3
+ ReorderItemProvider,
4
+ useReorderContext
5
+ } from "./chunk-BBGHU5EB.mjs";
6
+
7
+ // src/reorder-item.tsx
8
+ import { ui } from "@yamada-ui/core";
9
+ import {
10
+ MotionReorder,
11
+ useMotionValue,
12
+ useDragControls
13
+ } from "@yamada-ui/motion";
14
+ import { cx, dataAttr } from "@yamada-ui/utils";
15
+ import { forwardRef, useCallback, useEffect, useState } from "react";
16
+ import { jsx } from "react/jsx-runtime";
17
+ var ReorderItem = forwardRef(
18
+ ({ className, label, value, children, ...rest }, ref) => {
19
+ var _a;
20
+ const { orientation, styles } = useReorderContext();
21
+ const dragControls = useDragControls();
22
+ const [hasTrigger, setHasTrigger] = useState(false);
23
+ const [isDrag, setIsDrag] = useState(false);
24
+ const x = useMotionValue(0);
25
+ const y = useMotionValue(0);
26
+ const register = useCallback(
27
+ (node) => setHasTrigger(!!node),
28
+ []
29
+ );
30
+ useEffect(() => {
31
+ const unsubscribeX = x.on("change", (x2) => {
32
+ if (orientation === "horizontal") setIsDrag(x2 !== 0);
33
+ });
34
+ const unsubscribeY = y.on("change", (y2) => {
35
+ if (orientation === "vertical") setIsDrag(y2 !== 0);
36
+ });
37
+ return () => {
38
+ unsubscribeX();
39
+ unsubscribeY();
40
+ };
41
+ }, [orientation, x, y]);
42
+ const css = {
43
+ _selected: {
44
+ cursor: "grabbing"
45
+ },
46
+ ...!hasTrigger ? { cursor: "grab" } : { userSelect: "none" },
47
+ ...styles.item,
48
+ ...!hasTrigger ? {
49
+ _selected: {
50
+ ...(_a = styles.item) == null ? void 0 : _a._selected,
51
+ cursor: "grabbing"
52
+ }
53
+ } : {}
54
+ };
55
+ return /* @__PURE__ */ jsx(ReorderItemProvider, { value: { register, isDrag, dragControls }, children: /* @__PURE__ */ jsx(
56
+ ui.li,
57
+ {
58
+ ref,
59
+ as: MotionReorder.Item,
60
+ className: cx("ui-reorder__item", className),
61
+ value,
62
+ __css: css,
63
+ ...rest,
64
+ dragListener: !hasTrigger,
65
+ dragControls,
66
+ "data-selected": dataAttr(isDrag),
67
+ style: { ...rest.style, x, y },
68
+ children: children != null ? children : label
69
+ }
70
+ ) });
71
+ }
72
+ );
73
+ ReorderItem.displayName = "ReorderItem";
74
+
75
+ export {
76
+ ReorderItem
77
+ };
78
+ //# sourceMappingURL=chunk-XQS37PRX.mjs.map
@@ -0,0 +1 @@
1
+ {"version":3,"sources":["../src/reorder-item.tsx"],"sourcesContent":["import type { HTMLUIProps, CSSUIObject, ComponentArgs } from \"@yamada-ui/core\"\nimport { ui } from \"@yamada-ui/core\"\nimport type { HTMLMotionProps } from \"@yamada-ui/motion\"\nimport {\n MotionReorder,\n useMotionValue,\n useDragControls,\n} from \"@yamada-ui/motion\"\nimport { cx, dataAttr } from \"@yamada-ui/utils\"\nimport type { Merge } from \"@yamada-ui/utils\"\nimport type {\n ForwardedRef,\n PropsWithChildren,\n ReactNode,\n RefAttributes,\n} from \"react\"\nimport { forwardRef, useCallback, useEffect, useState } from \"react\"\nimport { ReorderItemProvider, useReorderContext } from \"./reorder-context\"\n\ninterface ReorderItemOptions<Y extends any = string> {\n /**\n * The label of the reorder item.\n */\n label?: ReactNode\n /**\n * The value of the reorder item.\n */\n value: Y\n}\n\nexport interface ReorderItemProps<Y extends any = string>\n extends Omit<\n Merge<HTMLUIProps<\"li\">, HTMLMotionProps<\"li\">>,\n \"value\" | \"transition\" | \"children\"\n >,\n PropsWithChildren,\n ReorderItemOptions<Y> {}\n\nexport const ReorderItem = forwardRef(\n <Y extends any = string>(\n { className, label, value, children, ...rest }: ReorderItemProps<Y>,\n ref: ForwardedRef<HTMLLIElement>,\n ) => {\n const { orientation, styles } = useReorderContext()\n\n const dragControls = useDragControls()\n\n const [hasTrigger, setHasTrigger] = useState<boolean>(false)\n const [isDrag, setIsDrag] = useState<boolean>(false)\n\n const x = useMotionValue(0)\n const y = useMotionValue(0)\n\n const register = useCallback(\n (node: HTMLElement | null) => setHasTrigger(!!node),\n [],\n )\n\n useEffect(() => {\n const unsubscribeX = x.on(\"change\", (x) => {\n if (orientation === \"horizontal\") setIsDrag(x !== 0)\n })\n const unsubscribeY = y.on(\"change\", (y) => {\n if (orientation === \"vertical\") setIsDrag(y !== 0)\n })\n\n return () => {\n unsubscribeX()\n unsubscribeY()\n }\n }, [orientation, x, y])\n\n const css: CSSUIObject = {\n _selected: {\n cursor: \"grabbing\",\n },\n ...(!hasTrigger ? { cursor: \"grab\" } : { userSelect: \"none\" }),\n ...styles.item,\n ...(!hasTrigger\n ? {\n _selected: {\n ...styles.item?._selected,\n cursor: \"grabbing\",\n },\n }\n : {}),\n }\n\n return (\n <ReorderItemProvider value={{ register, isDrag, dragControls }}>\n <ui.li\n ref={ref}\n as={MotionReorder.Item}\n className={cx(\"ui-reorder__item\", className)}\n value={value}\n __css={css}\n {...rest}\n dragListener={!hasTrigger}\n dragControls={dragControls}\n data-selected={dataAttr(isDrag)}\n style={{ ...rest.style, x, y }}\n >\n {children ?? label}\n </ui.li>\n </ReorderItemProvider>\n )\n },\n) as {\n <Y = string>(\n props: ReorderItemProps<Y> & RefAttributes<HTMLLIElement>,\n ): JSX.Element\n} & ComponentArgs\n\nReorderItem.displayName = \"ReorderItem\"\n"],"mappings":";;;;;;;AACA,SAAS,UAAU;AAEnB;AAAA,EACE;AAAA,EACA;AAAA,EACA;AAAA,OACK;AACP,SAAS,IAAI,gBAAgB;AAQ7B,SAAS,YAAY,aAAa,WAAW,gBAAgB;AA0ErD;AApDD,IAAM,cAAc;AAAA,EACzB,CACE,EAAE,WAAW,OAAO,OAAO,UAAU,GAAG,KAAK,GAC7C,QACG;AA1CP;AA2CI,UAAM,EAAE,aAAa,OAAO,IAAI,kBAAkB;AAElD,UAAM,eAAe,gBAAgB;AAErC,UAAM,CAAC,YAAY,aAAa,IAAI,SAAkB,KAAK;AAC3D,UAAM,CAAC,QAAQ,SAAS,IAAI,SAAkB,KAAK;AAEnD,UAAM,IAAI,eAAe,CAAC;AAC1B,UAAM,IAAI,eAAe,CAAC;AAE1B,UAAM,WAAW;AAAA,MACf,CAAC,SAA6B,cAAc,CAAC,CAAC,IAAI;AAAA,MAClD,CAAC;AAAA,IACH;AAEA,cAAU,MAAM;AACd,YAAM,eAAe,EAAE,GAAG,UAAU,CAACA,OAAM;AACzC,YAAI,gBAAgB,aAAc,WAAUA,OAAM,CAAC;AAAA,MACrD,CAAC;AACD,YAAM,eAAe,EAAE,GAAG,UAAU,CAACC,OAAM;AACzC,YAAI,gBAAgB,WAAY,WAAUA,OAAM,CAAC;AAAA,MACnD,CAAC;AAED,aAAO,MAAM;AACX,qBAAa;AACb,qBAAa;AAAA,MACf;AAAA,IACF,GAAG,CAAC,aAAa,GAAG,CAAC,CAAC;AAEtB,UAAM,MAAmB;AAAA,MACvB,WAAW;AAAA,QACT,QAAQ;AAAA,MACV;AAAA,MACA,GAAI,CAAC,aAAa,EAAE,QAAQ,OAAO,IAAI,EAAE,YAAY,OAAO;AAAA,MAC5D,GAAG,OAAO;AAAA,MACV,GAAI,CAAC,aACD;AAAA,QACE,WAAW;AAAA,UACT,IAAG,YAAO,SAAP,mBAAa;AAAA,UAChB,QAAQ;AAAA,QACV;AAAA,MACF,IACA,CAAC;AAAA,IACP;AAEA,WACE,oBAAC,uBAAoB,OAAO,EAAE,UAAU,QAAQ,aAAa,GAC3D;AAAA,MAAC,GAAG;AAAA,MAAH;AAAA,QACC;AAAA,QACA,IAAI,cAAc;AAAA,QAClB,WAAW,GAAG,oBAAoB,SAAS;AAAA,QAC3C;AAAA,QACA,OAAO;AAAA,QACN,GAAG;AAAA,QACJ,cAAc,CAAC;AAAA,QACf;AAAA,QACA,iBAAe,SAAS,MAAM;AAAA,QAC9B,OAAO,EAAE,GAAG,KAAK,OAAO,GAAG,EAAE;AAAA,QAE5B,wCAAY;AAAA;AAAA,IACf,GACF;AAAA,EAEJ;AACF;AAMA,YAAY,cAAc;","names":["x","y"]}
package/dist/index.d.mts CHANGED
@@ -1,7 +1,7 @@
1
1
  export { Reorder, ReorderGenerateItem, ReorderProps } from './reorder.mjs';
2
2
  export { ReorderItem, ReorderItemProps } from './reorder-item.mjs';
3
3
  export { ReorderTrigger, ReorderTriggerProps } from './reorder-trigger.mjs';
4
- import 'react';
5
4
  import '@yamada-ui/core';
6
5
  import '@yamada-ui/motion';
7
6
  import '@yamada-ui/utils';
7
+ import 'react';
package/dist/index.d.ts CHANGED
@@ -1,7 +1,7 @@
1
1
  export { Reorder, ReorderGenerateItem, ReorderProps } from './reorder.js';
2
2
  export { ReorderItem, ReorderItemProps } from './reorder-item.js';
3
3
  export { ReorderTrigger, ReorderTriggerProps } from './reorder-trigger.js';
4
- import 'react';
5
4
  import '@yamada-ui/core';
6
5
  import '@yamada-ui/motion';
7
6
  import '@yamada-ui/utils';
7
+ import 'react';
package/dist/index.js CHANGED
@@ -30,19 +30,26 @@ module.exports = __toCommonJS(src_exports);
30
30
  // src/reorder.tsx
31
31
  var import_core2 = require("@yamada-ui/core");
32
32
  var import_motion2 = require("@yamada-ui/motion");
33
- var import_utils2 = require("@yamada-ui/utils");
33
+ var import_utils3 = require("@yamada-ui/utils");
34
34
  var import_react2 = require("react");
35
35
 
36
- // src/reorder-item.tsx
37
- var import_core = require("@yamada-ui/core");
38
- var import_motion = require("@yamada-ui/motion");
36
+ // src/reorder-context.ts
39
37
  var import_utils = require("@yamada-ui/utils");
40
- var import_react = require("react");
41
- var import_jsx_runtime = require("react/jsx-runtime");
38
+ var [ReorderProvider, useReorderContext] = (0, import_utils.createContext)({
39
+ name: "ReorderContext",
40
+ errorMessage: `useReorderContext returned is 'undefined'. Seems you forgot to wrap the components in "<Reorder />"`
41
+ });
42
42
  var [ReorderItemProvider, useReorderItemContext] = (0, import_utils.createContext)({
43
43
  name: "ReorderContext",
44
44
  errorMessage: `useReorderItemContext returned is 'undefined'. Seems you forgot to wrap the components in "<ReorderItem />"`
45
45
  });
46
+
47
+ // src/reorder-item.tsx
48
+ var import_core = require("@yamada-ui/core");
49
+ var import_motion = require("@yamada-ui/motion");
50
+ var import_utils2 = require("@yamada-ui/utils");
51
+ var import_react = require("react");
52
+ var import_jsx_runtime = require("react/jsx-runtime");
46
53
  var ReorderItem = (0, import_react.forwardRef)(
47
54
  ({ className, label, value, children, ...rest }, ref) => {
48
55
  var _a;
@@ -86,13 +93,13 @@ var ReorderItem = (0, import_react.forwardRef)(
86
93
  {
87
94
  ref,
88
95
  as: import_motion.MotionReorder.Item,
89
- className: (0, import_utils.cx)("ui-reorder__item", className),
96
+ className: (0, import_utils2.cx)("ui-reorder__item", className),
90
97
  value,
91
98
  __css: css,
92
99
  ...rest,
93
100
  dragListener: !hasTrigger,
94
101
  dragControls,
95
- "data-selected": (0, import_utils.dataAttr)(isDrag),
102
+ "data-selected": (0, import_utils2.dataAttr)(isDrag),
96
103
  style: { ...rest.style, x, y },
97
104
  children: children != null ? children : label
98
105
  }
@@ -103,17 +110,13 @@ ReorderItem.displayName = "ReorderItem";
103
110
 
104
111
  // src/reorder.tsx
105
112
  var import_jsx_runtime2 = require("react/jsx-runtime");
106
- var [ReorderProvider, useReorderContext] = (0, import_utils2.createContext)({
107
- name: "ReorderContext",
108
- errorMessage: `useReorderContext returned is 'undefined'. Seems you forgot to wrap the components in "<Reorder />"`
109
- });
110
113
  var omitDuplicated = (values) => Array.from(new Set(values));
111
114
  var pickDuplicated = (values) => values.filter(
112
115
  (value, index, self) => self.indexOf(value) === index && index !== self.lastIndexOf(value)
113
116
  );
114
117
  var Reorder = (0, import_react2.forwardRef)(
115
118
  (props, ref) => {
116
- const [styles, mergedProps] = (0, import_core2.useMultiComponentStyle)("Reorder", props);
119
+ const [styles, mergedProps] = (0, import_core2.useComponentMultiStyle)("Reorder", props);
117
120
  const {
118
121
  className,
119
122
  orientation = "vertical",
@@ -125,7 +128,7 @@ var Reorder = (0, import_react2.forwardRef)(
125
128
  ...rest
126
129
  } = (0, import_core2.omitThemeProps)(mergedProps);
127
130
  const axis = orientation === "vertical" ? "y" : "x";
128
- const validChildren = (0, import_utils2.getValidChildren)(children);
131
+ const validChildren = (0, import_utils3.getValidChildren)(children);
129
132
  const hasChildren = !!validChildren.length;
130
133
  const defaultValues = (0, import_react2.useMemo)(() => {
131
134
  const values2 = hasChildren ? validChildren.map(({ props: props2 }) => props2.value) : items.map(({ value }) => value);
@@ -154,7 +157,7 @@ var Reorder = (0, import_react2.forwardRef)(
154
157
  prevValues.current = values;
155
158
  onCompleteChange == null ? void 0 : onCompleteChange(values);
156
159
  }, [onCompleteChange, values]);
157
- (0, import_utils2.useUpdateEffect)(() => {
160
+ (0, import_utils3.useUpdateEffect)(() => {
158
161
  const isEqual = JSON.stringify(defaultValues) === JSON.stringify(prevDefaultValues.current);
159
162
  if (isEqual) return;
160
163
  prevValues.current = defaultValues;
@@ -183,14 +186,14 @@ var Reorder = (0, import_react2.forwardRef)(
183
186
  {
184
187
  ref,
185
188
  as: import_motion2.MotionReorder.Group,
186
- className: (0, import_utils2.cx)("ui-reorder", className),
189
+ className: (0, import_utils3.cx)("ui-reorder", className),
187
190
  axis,
188
191
  values,
189
192
  onReorder,
190
193
  __css: css,
191
194
  ...rest,
192
- onMouseUp: (0, import_utils2.handlerAll)(rest.onMouseUp, onCompleteReorder),
193
- onTouchEnd: (0, import_utils2.handlerAll)(rest.onTouchEnd, onCompleteReorder),
195
+ onMouseUp: (0, import_utils3.handlerAll)(rest.onMouseUp, onCompleteReorder),
196
+ onTouchEnd: (0, import_utils3.handlerAll)(rest.onTouchEnd, onCompleteReorder),
194
197
  children: cloneChildren
195
198
  }
196
199
  ) });
@@ -201,7 +204,7 @@ Reorder.displayName = "Reorder";
201
204
  // src/reorder-trigger.tsx
202
205
  var import_core3 = require("@yamada-ui/core");
203
206
  var import_icon = require("@yamada-ui/icon");
204
- var import_utils3 = require("@yamada-ui/utils");
207
+ var import_utils4 = require("@yamada-ui/utils");
205
208
  var import_jsx_runtime3 = require("react/jsx-runtime");
206
209
  var ReorderTrigger = (0, import_core3.forwardRef)(
207
210
  ({ className, children = /* @__PURE__ */ (0, import_jsx_runtime3.jsx)(ReorderTriggerIcon, {}), ...rest }, ref) => {
@@ -220,12 +223,12 @@ var ReorderTrigger = (0, import_core3.forwardRef)(
220
223
  return /* @__PURE__ */ (0, import_jsx_runtime3.jsx)(
221
224
  import_core3.ui.div,
222
225
  {
223
- ref: (0, import_utils3.mergeRefs)(register, ref),
224
- className: (0, import_utils3.cx)("ui-reorder__trigger", className),
226
+ ref: (0, import_utils4.mergeRefs)(register, ref),
227
+ className: (0, import_utils4.cx)("ui-reorder__trigger", className),
225
228
  __css: css,
226
229
  ...rest,
227
- "data-selected": (0, import_utils3.dataAttr)(isDrag),
228
- onPointerDown: (0, import_utils3.handlerAll)(
230
+ "data-selected": (0, import_utils4.dataAttr)(isDrag),
231
+ onPointerDown: (0, import_utils4.handlerAll)(
229
232
  rest.onPointerDown,
230
233
  (ev) => dragControls.start(ev)
231
234
  ),
package/dist/index.js.map CHANGED
@@ -1 +1 @@
1
- {"version":3,"sources":["../src/index.ts","../src/reorder.tsx","../src/reorder-item.tsx","../src/reorder-trigger.tsx"],"sourcesContent":["export { Reorder } from \"./reorder\"\nexport type { ReorderProps, ReorderGenerateItem } from \"./reorder\"\nexport { ReorderItem } from \"./reorder-item\"\nexport type { ReorderItemProps } from \"./reorder-item\"\nexport { ReorderTrigger } from \"./reorder-trigger\"\nexport type { ReorderTriggerProps } from \"./reorder-trigger\"\n","import type {\n CSSUIObject,\n ComponentArgs,\n HTMLUIProps,\n ThemeProps,\n} from \"@yamada-ui/core\"\nimport { ui, useMultiComponentStyle, omitThemeProps } from \"@yamada-ui/core\"\nimport type { HTMLMotionProps } from \"@yamada-ui/motion\"\nimport { MotionReorder } from \"@yamada-ui/motion\"\nimport type { Merge } from \"@yamada-ui/utils\"\nimport {\n createContext,\n cx,\n getValidChildren,\n handlerAll,\n useUpdateEffect,\n} from \"@yamada-ui/utils\"\nimport type { ForwardedRef, PropsWithChildren } from \"react\"\nimport { forwardRef, useCallback, useMemo, useRef, useState } from \"react\"\nimport { ReorderItem, type ReorderItemProps } from \"./reorder-item\"\n\ntype ReorderContext = {\n orientation: \"vertical\" | \"horizontal\"\n styles: Record<string, CSSUIObject>\n}\n\nexport const [ReorderProvider, useReorderContext] =\n createContext<ReorderContext>({\n name: \"ReorderContext\",\n errorMessage: `useReorderContext returned is 'undefined'. Seems you forgot to wrap the components in \"<Reorder />\"`,\n })\n\nexport type ReorderGenerateItem<Y extends any = string> = ReorderItemProps<Y>\n\ntype ReorderOptions<Y extends any = string> = {\n /**\n * The orientation of the reorder.\n *\n * @default 'vertical'\n */\n orientation?: \"vertical\" | \"horizontal\"\n /**\n * If provided, generate reorder items based on items.\n *\n */\n items?: ReorderGenerateItem[]\n /**\n * The callback invoked when reorder items are moved.\n */\n onChange?: (values: Y[]) => void\n /**\n * The callback invoked when the movement of reorder items is completed.\n */\n onCompleteChange?: (values: Y[]) => void\n}\n\nexport type ReorderProps<Y extends any = string> = Omit<\n Merge<HTMLUIProps<\"ul\">, HTMLMotionProps<\"ul\">>,\n \"onChange\" | \"transition\" | \"children\"\n> &\n PropsWithChildren &\n ThemeProps<\"Reorder\"> &\n ReorderOptions<Y>\n\nconst omitDuplicated = <Y extends any = string>(values: Y[]): Y[] =>\n Array.from(new Set(values))\n\nconst pickDuplicated = <Y extends any = string>(values: Y[]): Y[] =>\n values.filter(\n (value, index, self) =>\n self.indexOf(value) === index && index !== self.lastIndexOf(value),\n )\n\n/**\n * `Reorder` is a component that allows you to change the order of items using drag and drop.\n *\n * @see Docs https://yamada-ui.com/components/data-display/reorder\n */\nexport const Reorder = forwardRef(\n <Y extends any = string>(\n props: ReorderProps<Y>,\n ref: ForwardedRef<HTMLUListElement>,\n ) => {\n const [styles, mergedProps] = useMultiComponentStyle(\"Reorder\", props)\n const {\n className,\n orientation = \"vertical\",\n gap = \"fallback(4, 1rem)\",\n items = [],\n onChange,\n onCompleteChange,\n children,\n ...rest\n } = omitThemeProps(mergedProps)\n\n const axis = orientation === \"vertical\" ? \"y\" : \"x\"\n\n const validChildren = getValidChildren(children)\n const hasChildren = !!validChildren.length\n\n const defaultValues = useMemo(() => {\n const values = hasChildren\n ? validChildren.map(({ props }) => props.value)\n : items.map(({ value }) => value)\n\n const duplicatedValues = pickDuplicated(values)\n\n if (duplicatedValues.length)\n console.warn(\n `Reorder: 'value' of 'ReorderItem' must not be duplicated. duplicate 'value' is '${duplicatedValues.join(\n `', '`,\n )}' `,\n )\n\n return omitDuplicated(values)\n }, [hasChildren, validChildren, items])\n const prevDefaultValues = useRef<Y[]>(defaultValues)\n\n const [values, setValues] = useState<Y[]>(defaultValues)\n const prevValues = useRef<Y[]>(defaultValues)\n\n const onReorder = useCallback(\n (newValues: Y[]) => {\n setValues(newValues)\n\n onChange?.(newValues)\n },\n [onChange],\n )\n\n const onCompleteReorder = useCallback(() => {\n const isEqual =\n JSON.stringify(prevValues.current) === JSON.stringify(values)\n\n if (isEqual) return\n\n prevValues.current = values\n\n onCompleteChange?.(values)\n }, [onCompleteChange, values])\n\n useUpdateEffect(() => {\n const isEqual =\n JSON.stringify(defaultValues) ===\n JSON.stringify(prevDefaultValues.current)\n\n if (isEqual) return\n\n prevValues.current = defaultValues\n prevDefaultValues.current = defaultValues\n\n setValues(defaultValues)\n }, [defaultValues])\n\n const cloneChildren = useMemo(\n () =>\n values.map((value) => {\n if (hasChildren) {\n return validChildren.find(({ props }) => props.value === value)\n } else {\n const props = items.find((item) => item.value === value)\n\n return props ? <ReorderItem key={props.value} {...props} /> : null\n }\n }),\n [values, hasChildren, validChildren, items],\n )\n\n const css: CSSUIObject = {\n display: \"flex\",\n flexDirection: orientation === \"vertical\" ? \"column\" : \"row\",\n gap,\n ...styles.container,\n }\n\n return (\n <ReorderProvider value={{ orientation, styles }}>\n <ui.ul\n ref={ref}\n as={MotionReorder.Group<Y>}\n className={cx(\"ui-reorder\", className)}\n axis={axis}\n values={values}\n onReorder={onReorder}\n __css={css}\n {...rest}\n onMouseUp={handlerAll(rest.onMouseUp, onCompleteReorder)}\n onTouchEnd={handlerAll(rest.onTouchEnd, onCompleteReorder)}\n >\n {cloneChildren}\n </ui.ul>\n </ReorderProvider>\n )\n },\n) as {\n <Y extends any = string>(\n props: ReorderProps<Y> & { ref?: ForwardedRef<HTMLUListElement> },\n ): JSX.Element\n} & ComponentArgs\n\nReorder.displayName = \"Reorder\"\n","import type { HTMLUIProps, CSSUIObject, ComponentArgs } from \"@yamada-ui/core\"\nimport { ui } from \"@yamada-ui/core\"\nimport type { HTMLMotionProps, DragControls } from \"@yamada-ui/motion\"\nimport {\n MotionReorder,\n useMotionValue,\n useDragControls,\n} from \"@yamada-ui/motion\"\nimport { createContext, cx, dataAttr } from \"@yamada-ui/utils\"\nimport type { Merge } from \"@yamada-ui/utils\"\nimport type { ForwardedRef, PropsWithChildren, ReactNode } from \"react\"\nimport { forwardRef, useCallback, useEffect, useState } from \"react\"\nimport { useReorderContext } from \"./reorder\"\n\ntype ReorderItemContext = {\n register: (node: HTMLElement | null) => void\n isDrag: boolean\n dragControls: DragControls\n}\n\nexport const [ReorderItemProvider, useReorderItemContext] =\n createContext<ReorderItemContext>({\n name: \"ReorderContext\",\n errorMessage: `useReorderItemContext returned is 'undefined'. Seems you forgot to wrap the components in \"<ReorderItem />\"`,\n })\n\ntype ReorderItemOptions<Y extends any = string> = {\n /**\n * The label of the reorder item.\n */\n label?: ReactNode\n /**\n * The value of the reorder item.\n */\n value: Y\n}\n\nexport type ReorderItemProps<Y extends any = string> = Omit<\n Merge<HTMLUIProps<\"li\">, HTMLMotionProps<\"li\">>,\n \"value\" | \"transition\" | \"children\"\n> &\n PropsWithChildren &\n ReorderItemOptions<Y>\n\nexport const ReorderItem = forwardRef(\n <Y extends any = string>(\n { className, label, value, children, ...rest }: ReorderItemProps<Y>,\n ref: ForwardedRef<HTMLLIElement>,\n ) => {\n const { orientation, styles } = useReorderContext()\n\n const dragControls = useDragControls()\n\n const [hasTrigger, setHasTrigger] = useState<boolean>(false)\n const [isDrag, setIsDrag] = useState<boolean>(false)\n\n const x = useMotionValue(0)\n const y = useMotionValue(0)\n\n const register = useCallback(\n (node: HTMLElement | null) => setHasTrigger(!!node),\n [],\n )\n\n useEffect(() => {\n const unsubscribeX = x.on(\"change\", (x) => {\n if (orientation === \"horizontal\") setIsDrag(x !== 0)\n })\n const unsubscribeY = y.on(\"change\", (y) => {\n if (orientation === \"vertical\") setIsDrag(y !== 0)\n })\n\n return () => {\n unsubscribeX()\n unsubscribeY()\n }\n }, [orientation, x, y])\n\n const css: CSSUIObject = {\n _selected: {\n cursor: \"grabbing\",\n },\n ...(!hasTrigger ? { cursor: \"grab\" } : { userSelect: \"none\" }),\n ...styles.item,\n ...(!hasTrigger\n ? {\n _selected: {\n ...styles.item?._selected,\n cursor: \"grabbing\",\n },\n }\n : {}),\n }\n\n return (\n <ReorderItemProvider value={{ register, isDrag, dragControls }}>\n <ui.li\n ref={ref}\n as={MotionReorder.Item}\n className={cx(\"ui-reorder__item\", className)}\n value={value}\n __css={css}\n {...rest}\n dragListener={!hasTrigger}\n dragControls={dragControls}\n data-selected={dataAttr(isDrag)}\n style={{ ...rest.style, x, y }}\n >\n {children ?? label}\n </ui.li>\n </ReorderItemProvider>\n )\n },\n) as {\n <Y extends any = string>(\n props: ReorderItemProps<Y> & { ref?: ForwardedRef<HTMLLIElement> },\n ): JSX.Element\n} & ComponentArgs\n\nReorderItem.displayName = \"ReorderItem\"\n","import type { HTMLUIProps, CSSUIObject } from \"@yamada-ui/core\"\nimport { ui, forwardRef } from \"@yamada-ui/core\"\nimport type { IconProps } from \"@yamada-ui/icon\"\nimport { Icon } from \"@yamada-ui/icon\"\nimport { cx, handlerAll, mergeRefs, dataAttr } from \"@yamada-ui/utils\"\nimport type { FC } from \"react\"\nimport { useReorderContext } from \"./reorder\"\nimport { useReorderItemContext } from \"./reorder-item\"\n\nexport type ReorderTriggerProps = HTMLUIProps<\"div\">\n\nexport const ReorderTrigger = forwardRef<ReorderTriggerProps, \"div\">(\n ({ className, children = <ReorderTriggerIcon />, ...rest }, ref) => {\n const { styles } = useReorderContext()\n const { register, isDrag, dragControls } = useReorderItemContext()\n\n const css: CSSUIObject = {\n display: \"flex\",\n justifyContent: \"center\",\n alignItems: \"center\",\n cursor: \"grab\",\n _selected: {\n cursor: \"grabbing\",\n },\n ...styles.trigger,\n }\n\n return (\n <ui.div\n ref={mergeRefs(register, ref)}\n className={cx(\"ui-reorder__trigger\", className)}\n __css={css}\n {...rest}\n data-selected={dataAttr(isDrag)}\n onPointerDown={handlerAll(rest.onPointerDown, (ev) =>\n dragControls.start(ev),\n )}\n >\n {children}\n </ui.div>\n )\n },\n)\n\nconst ReorderTriggerIcon: FC<IconProps> = (rest) => {\n return (\n <Icon viewBox=\"0 0 39 39\" {...rest}>\n <path\n d=\"M 5 0 C 7.761 0 10 2.239 10 5 C 10 7.761 7.761 10 5 10 C 2.239 10 0 7.761 0 5 C 0 2.239 2.239 0 5 0 Z\"\n fill=\"currentColor\"\n />\n\n <path\n d=\"M 19 0 C 21.761 0 24 2.239 24 5 C 24 7.761 21.761 10 19 10 C 16.239 10 14 7.761 14 5 C 14 2.239 16.239 0 19 0 Z\"\n fill=\"currentColor\"\n />\n\n <path\n d=\"M 33 0 C 35.761 0 38 2.239 38 5 C 38 7.761 35.761 10 33 10 C 30.239 10 28 7.761 28 5 C 28 2.239 30.239 0 33 0 Z\"\n fill=\"currentColor\"\n />\n\n <path\n d=\"M 33 14 C 35.761 14 38 16.239 38 19 C 38 21.761 35.761 24 33 24 C 30.239 24 28 21.761 28 19 C 28 16.239 30.239 14 33 14 Z\"\n fill=\"currentColor\"\n />\n\n <path\n d=\"M 19 14 C 21.761 14 24 16.239 24 19 C 24 21.761 21.761 24 19 24 C 16.239 24 14 21.761 14 19 C 14 16.239 16.239 14 19 14 Z\"\n fill=\"currentColor\"\n />\n\n <path\n d=\"M 5 14 C 7.761 14 10 16.239 10 19 C 10 21.761 7.761 24 5 24 C 2.239 24 0 21.761 0 19 C 0 16.239 2.239 14 5 14 Z\"\n fill=\"currentColor\"\n />\n\n <path\n d=\"M 5 28 C 7.761 28 10 30.239 10 33 C 10 35.761 7.761 38 5 38 C 2.239 38 0 35.761 0 33 C 0 30.239 2.239 28 5 28 Z\"\n fill=\"currentColor\"\n />\n\n <path\n d=\"M 19 28 C 21.761 28 24 30.239 24 33 C 24 35.761 21.761 38 19 38 C 16.239 38 14 35.761 14 33 C 14 30.239 16.239 28 19 28 Z\"\n fill=\"currentColor\"\n />\n\n <path\n d=\"M 33 28 C 35.761 28 38 30.239 38 33 C 38 35.761 35.761 38 33 38 C 30.239 38 28 35.761 28 33 C 28 30.239 30.239 28 33 28 Z\"\n fill=\"currentColor\"\n />\n </Icon>\n )\n}\n"],"mappings":"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","names":["import_core","import_motion","import_utils","import_react","x","y","import_jsx_runtime","values","props","import_core","import_utils","import_jsx_runtime"]}
1
+ {"version":3,"sources":["../src/index.ts","../src/reorder.tsx","../src/reorder-context.ts","../src/reorder-item.tsx","../src/reorder-trigger.tsx"],"sourcesContent":["export { Reorder } from \"./reorder\"\nexport type { ReorderProps, ReorderGenerateItem } from \"./reorder\"\nexport { ReorderItem } from \"./reorder-item\"\nexport type { ReorderItemProps } from \"./reorder-item\"\nexport { ReorderTrigger } from \"./reorder-trigger\"\nexport type { ReorderTriggerProps } from \"./reorder-trigger\"\n","import type {\n CSSUIObject,\n ComponentArgs,\n HTMLUIProps,\n ThemeProps,\n} from \"@yamada-ui/core\"\nimport { ui, useComponentMultiStyle, omitThemeProps } from \"@yamada-ui/core\"\nimport type { HTMLMotionProps } from \"@yamada-ui/motion\"\nimport { MotionReorder } from \"@yamada-ui/motion\"\nimport type { Merge } from \"@yamada-ui/utils\"\nimport {\n cx,\n getValidChildren,\n handlerAll,\n useUpdateEffect,\n} from \"@yamada-ui/utils\"\nimport type { ForwardedRef, PropsWithChildren, RefAttributes } from \"react\"\nimport { forwardRef, useCallback, useMemo, useRef, useState } from \"react\"\nimport { ReorderProvider } from \"./reorder-context\"\nimport { ReorderItem } from \"./reorder-item\"\nimport type { ReorderItemProps } from \"./reorder-item\"\n\nexport type ReorderGenerateItem<Y extends any = string> = ReorderItemProps<Y>\n\nconst omitDuplicated = <Y extends any = string>(values: Y[]): Y[] =>\n Array.from(new Set(values))\n\nconst pickDuplicated = <Y extends any = string>(values: Y[]): Y[] =>\n values.filter(\n (value, index, self) =>\n self.indexOf(value) === index && index !== self.lastIndexOf(value),\n )\n\ninterface ReorderOptions<Y extends any = string> {\n /**\n * The orientation of the reorder.\n *\n * @default 'vertical'\n */\n orientation?: \"vertical\" | \"horizontal\"\n /**\n * If provided, generate reorder items based on items.\n *\n */\n items?: ReorderGenerateItem[]\n /**\n * The callback invoked when reorder items are moved.\n */\n onChange?: (values: Y[]) => void\n /**\n * The callback invoked when the movement of reorder items is completed.\n */\n onCompleteChange?: (values: Y[]) => void\n}\n\nexport interface ReorderProps<Y extends any = string>\n extends Omit<\n Merge<HTMLUIProps<\"ul\">, HTMLMotionProps<\"ul\">>,\n \"onChange\" | \"transition\" | \"children\"\n >,\n PropsWithChildren,\n ThemeProps<\"Reorder\">,\n ReorderOptions<Y> {}\n\n/**\n * `Reorder` is a component that allows you to change the order of items using drag and drop.\n *\n * @see Docs https://yamada-ui.com/components/data-display/reorder\n */\nexport const Reorder = forwardRef(\n <Y extends any = string>(\n props: ReorderProps<Y>,\n ref: ForwardedRef<HTMLUListElement>,\n ) => {\n const [styles, mergedProps] = useComponentMultiStyle(\"Reorder\", props)\n const {\n className,\n orientation = \"vertical\",\n gap = \"fallback(4, 1rem)\",\n items = [],\n onChange,\n onCompleteChange,\n children,\n ...rest\n } = omitThemeProps(mergedProps)\n\n const axis = orientation === \"vertical\" ? \"y\" : \"x\"\n\n const validChildren = getValidChildren(children)\n const hasChildren = !!validChildren.length\n\n const defaultValues = useMemo(() => {\n const values = hasChildren\n ? validChildren.map(({ props }) => props.value)\n : items.map(({ value }) => value)\n\n const duplicatedValues = pickDuplicated(values)\n\n if (duplicatedValues.length)\n console.warn(\n `Reorder: 'value' of 'ReorderItem' must not be duplicated. duplicate 'value' is '${duplicatedValues.join(\n `', '`,\n )}' `,\n )\n\n return omitDuplicated(values)\n }, [hasChildren, validChildren, items])\n const prevDefaultValues = useRef<Y[]>(defaultValues)\n\n const [values, setValues] = useState<Y[]>(defaultValues)\n const prevValues = useRef<Y[]>(defaultValues)\n\n const onReorder = useCallback(\n (newValues: Y[]) => {\n setValues(newValues)\n\n onChange?.(newValues)\n },\n [onChange],\n )\n\n const onCompleteReorder = useCallback(() => {\n const isEqual =\n JSON.stringify(prevValues.current) === JSON.stringify(values)\n\n if (isEqual) return\n\n prevValues.current = values\n\n onCompleteChange?.(values)\n }, [onCompleteChange, values])\n\n useUpdateEffect(() => {\n const isEqual =\n JSON.stringify(defaultValues) ===\n JSON.stringify(prevDefaultValues.current)\n\n if (isEqual) return\n\n prevValues.current = defaultValues\n prevDefaultValues.current = defaultValues\n\n setValues(defaultValues)\n }, [defaultValues])\n\n const cloneChildren = useMemo(\n () =>\n values.map((value) => {\n if (hasChildren) {\n return validChildren.find(({ props }) => props.value === value)\n } else {\n const props = items.find((item) => item.value === value)\n\n return props ? <ReorderItem key={props.value} {...props} /> : null\n }\n }),\n [values, hasChildren, validChildren, items],\n )\n\n const css: CSSUIObject = {\n display: \"flex\",\n flexDirection: orientation === \"vertical\" ? \"column\" : \"row\",\n gap,\n ...styles.container,\n }\n\n return (\n <ReorderProvider value={{ orientation, styles }}>\n <ui.ul\n ref={ref}\n as={MotionReorder.Group<Y>}\n className={cx(\"ui-reorder\", className)}\n axis={axis}\n values={values}\n onReorder={onReorder}\n __css={css}\n {...rest}\n onMouseUp={handlerAll(rest.onMouseUp, onCompleteReorder)}\n onTouchEnd={handlerAll(rest.onTouchEnd, onCompleteReorder)}\n >\n {cloneChildren}\n </ui.ul>\n </ReorderProvider>\n )\n },\n) as {\n <Y = string>(\n props: ReorderProps<Y> & RefAttributes<HTMLUListElement>,\n ): JSX.Element\n} & ComponentArgs\n\nReorder.displayName = \"Reorder\"\n","import type { CSSUIObject } from \"@yamada-ui/core\"\nimport type { DragControls } from \"@yamada-ui/motion\"\nimport { createContext } from \"@yamada-ui/utils\"\n\ninterface ReorderContext {\n orientation: \"vertical\" | \"horizontal\"\n styles: { [key: string]: CSSUIObject }\n}\n\nexport const [ReorderProvider, useReorderContext] =\n createContext<ReorderContext>({\n name: \"ReorderContext\",\n errorMessage: `useReorderContext returned is 'undefined'. Seems you forgot to wrap the components in \"<Reorder />\"`,\n })\n\ninterface ReorderItemContext {\n register: (node: HTMLElement | null) => void\n isDrag: boolean\n dragControls: DragControls\n}\n\nexport const [ReorderItemProvider, useReorderItemContext] =\n createContext<ReorderItemContext>({\n name: \"ReorderContext\",\n errorMessage: `useReorderItemContext returned is 'undefined'. Seems you forgot to wrap the components in \"<ReorderItem />\"`,\n })\n","import type { HTMLUIProps, CSSUIObject, ComponentArgs } from \"@yamada-ui/core\"\nimport { ui } from \"@yamada-ui/core\"\nimport type { HTMLMotionProps } from \"@yamada-ui/motion\"\nimport {\n MotionReorder,\n useMotionValue,\n useDragControls,\n} from \"@yamada-ui/motion\"\nimport { cx, dataAttr } from \"@yamada-ui/utils\"\nimport type { Merge } from \"@yamada-ui/utils\"\nimport type {\n ForwardedRef,\n PropsWithChildren,\n ReactNode,\n RefAttributes,\n} from \"react\"\nimport { forwardRef, useCallback, useEffect, useState } from \"react\"\nimport { ReorderItemProvider, useReorderContext } from \"./reorder-context\"\n\ninterface ReorderItemOptions<Y extends any = string> {\n /**\n * The label of the reorder item.\n */\n label?: ReactNode\n /**\n * The value of the reorder item.\n */\n value: Y\n}\n\nexport interface ReorderItemProps<Y extends any = string>\n extends Omit<\n Merge<HTMLUIProps<\"li\">, HTMLMotionProps<\"li\">>,\n \"value\" | \"transition\" | \"children\"\n >,\n PropsWithChildren,\n ReorderItemOptions<Y> {}\n\nexport const ReorderItem = forwardRef(\n <Y extends any = string>(\n { className, label, value, children, ...rest }: ReorderItemProps<Y>,\n ref: ForwardedRef<HTMLLIElement>,\n ) => {\n const { orientation, styles } = useReorderContext()\n\n const dragControls = useDragControls()\n\n const [hasTrigger, setHasTrigger] = useState<boolean>(false)\n const [isDrag, setIsDrag] = useState<boolean>(false)\n\n const x = useMotionValue(0)\n const y = useMotionValue(0)\n\n const register = useCallback(\n (node: HTMLElement | null) => setHasTrigger(!!node),\n [],\n )\n\n useEffect(() => {\n const unsubscribeX = x.on(\"change\", (x) => {\n if (orientation === \"horizontal\") setIsDrag(x !== 0)\n })\n const unsubscribeY = y.on(\"change\", (y) => {\n if (orientation === \"vertical\") setIsDrag(y !== 0)\n })\n\n return () => {\n unsubscribeX()\n unsubscribeY()\n }\n }, [orientation, x, y])\n\n const css: CSSUIObject = {\n _selected: {\n cursor: \"grabbing\",\n },\n ...(!hasTrigger ? { cursor: \"grab\" } : { userSelect: \"none\" }),\n ...styles.item,\n ...(!hasTrigger\n ? {\n _selected: {\n ...styles.item?._selected,\n cursor: \"grabbing\",\n },\n }\n : {}),\n }\n\n return (\n <ReorderItemProvider value={{ register, isDrag, dragControls }}>\n <ui.li\n ref={ref}\n as={MotionReorder.Item}\n className={cx(\"ui-reorder__item\", className)}\n value={value}\n __css={css}\n {...rest}\n dragListener={!hasTrigger}\n dragControls={dragControls}\n data-selected={dataAttr(isDrag)}\n style={{ ...rest.style, x, y }}\n >\n {children ?? label}\n </ui.li>\n </ReorderItemProvider>\n )\n },\n) as {\n <Y = string>(\n props: ReorderItemProps<Y> & RefAttributes<HTMLLIElement>,\n ): JSX.Element\n} & ComponentArgs\n\nReorderItem.displayName = \"ReorderItem\"\n","import type { HTMLUIProps, CSSUIObject } from \"@yamada-ui/core\"\nimport { ui, forwardRef } from \"@yamada-ui/core\"\nimport type { IconProps } from \"@yamada-ui/icon\"\nimport { Icon } from \"@yamada-ui/icon\"\nimport { cx, handlerAll, mergeRefs, dataAttr } from \"@yamada-ui/utils\"\nimport type { FC } from \"react\"\nimport { useReorderContext, useReorderItemContext } from \"./reorder-context\"\n\nexport interface ReorderTriggerProps extends HTMLUIProps {}\n\nexport const ReorderTrigger = forwardRef<ReorderTriggerProps, \"div\">(\n ({ className, children = <ReorderTriggerIcon />, ...rest }, ref) => {\n const { styles } = useReorderContext()\n const { register, isDrag, dragControls } = useReorderItemContext()\n\n const css: CSSUIObject = {\n display: \"flex\",\n justifyContent: \"center\",\n alignItems: \"center\",\n cursor: \"grab\",\n _selected: {\n cursor: \"grabbing\",\n },\n ...styles.trigger,\n }\n\n return (\n <ui.div\n ref={mergeRefs(register, ref)}\n className={cx(\"ui-reorder__trigger\", className)}\n __css={css}\n {...rest}\n data-selected={dataAttr(isDrag)}\n onPointerDown={handlerAll(rest.onPointerDown, (ev) =>\n dragControls.start(ev),\n )}\n >\n {children}\n </ui.div>\n )\n },\n)\n\nconst ReorderTriggerIcon: FC<IconProps> = (rest) => {\n return (\n <Icon viewBox=\"0 0 39 39\" {...rest}>\n <path\n d=\"M 5 0 C 7.761 0 10 2.239 10 5 C 10 7.761 7.761 10 5 10 C 2.239 10 0 7.761 0 5 C 0 2.239 2.239 0 5 0 Z\"\n fill=\"currentColor\"\n />\n\n <path\n d=\"M 19 0 C 21.761 0 24 2.239 24 5 C 24 7.761 21.761 10 19 10 C 16.239 10 14 7.761 14 5 C 14 2.239 16.239 0 19 0 Z\"\n fill=\"currentColor\"\n />\n\n <path\n d=\"M 33 0 C 35.761 0 38 2.239 38 5 C 38 7.761 35.761 10 33 10 C 30.239 10 28 7.761 28 5 C 28 2.239 30.239 0 33 0 Z\"\n fill=\"currentColor\"\n />\n\n <path\n d=\"M 33 14 C 35.761 14 38 16.239 38 19 C 38 21.761 35.761 24 33 24 C 30.239 24 28 21.761 28 19 C 28 16.239 30.239 14 33 14 Z\"\n fill=\"currentColor\"\n />\n\n <path\n d=\"M 19 14 C 21.761 14 24 16.239 24 19 C 24 21.761 21.761 24 19 24 C 16.239 24 14 21.761 14 19 C 14 16.239 16.239 14 19 14 Z\"\n fill=\"currentColor\"\n />\n\n <path\n d=\"M 5 14 C 7.761 14 10 16.239 10 19 C 10 21.761 7.761 24 5 24 C 2.239 24 0 21.761 0 19 C 0 16.239 2.239 14 5 14 Z\"\n fill=\"currentColor\"\n />\n\n <path\n d=\"M 5 28 C 7.761 28 10 30.239 10 33 C 10 35.761 7.761 38 5 38 C 2.239 38 0 35.761 0 33 C 0 30.239 2.239 28 5 28 Z\"\n fill=\"currentColor\"\n />\n\n <path\n d=\"M 19 28 C 21.761 28 24 30.239 24 33 C 24 35.761 21.761 38 19 38 C 16.239 38 14 35.761 14 33 C 14 30.239 16.239 28 19 28 Z\"\n fill=\"currentColor\"\n />\n\n <path\n d=\"M 33 28 C 35.761 28 38 30.239 38 33 C 38 35.761 35.761 38 33 38 C 30.239 38 28 35.761 28 33 C 28 30.239 30.239 28 33 28 Z\"\n fill=\"currentColor\"\n />\n </Icon>\n )\n}\n"],"mappings":"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","names":["import_core","import_motion","import_utils","import_react","import_utils","x","y","import_jsx_runtime","values","props","import_core","import_utils","import_jsx_runtime"]}
package/dist/index.mjs CHANGED
@@ -1,11 +1,14 @@
1
1
  "use client"
2
2
  import {
3
3
  ReorderTrigger
4
- } from "./chunk-RFRSMH24.mjs";
4
+ } from "./chunk-PMOLBS6N.mjs";
5
+ import {
6
+ Reorder
7
+ } from "./chunk-XB6JNHWY.mjs";
5
8
  import {
6
- Reorder,
7
9
  ReorderItem
8
- } from "./chunk-LKWVADXG.mjs";
10
+ } from "./chunk-XQS37PRX.mjs";
11
+ import "./chunk-BBGHU5EB.mjs";
9
12
  export {
10
13
  Reorder,
11
14
  ReorderItem,
@@ -0,0 +1,21 @@
1
+ import * as react from 'react';
2
+ import { CSSUIObject } from '@yamada-ui/core';
3
+ import { DragControls } from '@yamada-ui/motion';
4
+
5
+ interface ReorderContext {
6
+ orientation: "vertical" | "horizontal";
7
+ styles: {
8
+ [key: string]: CSSUIObject;
9
+ };
10
+ }
11
+ declare const ReorderProvider: react.Provider<ReorderContext>;
12
+ declare const useReorderContext: () => ReorderContext;
13
+ interface ReorderItemContext {
14
+ register: (node: HTMLElement | null) => void;
15
+ isDrag: boolean;
16
+ dragControls: DragControls;
17
+ }
18
+ declare const ReorderItemProvider: react.Provider<ReorderItemContext>;
19
+ declare const useReorderItemContext: () => ReorderItemContext;
20
+
21
+ export { ReorderItemProvider, ReorderProvider, useReorderContext, useReorderItemContext };
@@ -0,0 +1,21 @@
1
+ import * as react from 'react';
2
+ import { CSSUIObject } from '@yamada-ui/core';
3
+ import { DragControls } from '@yamada-ui/motion';
4
+
5
+ interface ReorderContext {
6
+ orientation: "vertical" | "horizontal";
7
+ styles: {
8
+ [key: string]: CSSUIObject;
9
+ };
10
+ }
11
+ declare const ReorderProvider: react.Provider<ReorderContext>;
12
+ declare const useReorderContext: () => ReorderContext;
13
+ interface ReorderItemContext {
14
+ register: (node: HTMLElement | null) => void;
15
+ isDrag: boolean;
16
+ dragControls: DragControls;
17
+ }
18
+ declare const ReorderItemProvider: react.Provider<ReorderItemContext>;
19
+ declare const useReorderItemContext: () => ReorderItemContext;
20
+
21
+ export { ReorderItemProvider, ReorderProvider, useReorderContext, useReorderItemContext };