@yamada-ui/react 2.2.1-dev-20260428091429 → 2.2.1-dev-20260428094054

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 (212) hide show
  1. package/dist/cjs/components/rating/use-rating.cjs +23 -31
  2. package/dist/cjs/components/rating/use-rating.cjs.map +1 -1
  3. package/dist/cjs/components/reorder/use-reorder.cjs +16 -17
  4. package/dist/cjs/components/reorder/use-reorder.cjs.map +1 -1
  5. package/dist/esm/components/rating/use-rating.js +23 -31
  6. package/dist/esm/components/rating/use-rating.js.map +1 -1
  7. package/dist/esm/components/reorder/use-reorder.js +16 -17
  8. package/dist/esm/components/reorder/use-reorder.js.map +1 -1
  9. package/dist/types/components/accordion/accordion.d.ts +2 -2
  10. package/dist/types/components/accordion/accordion.style.d.ts +1 -1
  11. package/dist/types/components/accordion/use-accordion.d.ts +11 -11
  12. package/dist/types/components/action-bar/action-bar.d.ts +2 -2
  13. package/dist/types/components/airy/airy.d.ts +2 -2
  14. package/dist/types/components/alert/alert.d.ts +2 -2
  15. package/dist/types/components/alert/alert.style.d.ts +1 -1
  16. package/dist/types/components/alpha-slider/alpha-slider.d.ts +2 -2
  17. package/dist/types/components/aspect-ratio/aspect-ratio.d.ts +2 -2
  18. package/dist/types/components/autocomplete/autocomplete.d.ts +2 -2
  19. package/dist/types/components/autocomplete/autocomplete.style.d.ts +1 -1
  20. package/dist/types/components/autocomplete/use-autocomplete.d.ts +5 -5
  21. package/dist/types/components/avatar/avatar.d.ts +5 -5
  22. package/dist/types/components/avatar/use-avatar-group.d.ts +2 -2
  23. package/dist/types/components/badge/badge.d.ts +2 -2
  24. package/dist/types/components/bleed/bleed.d.ts +2 -2
  25. package/dist/types/components/blockquote/blockquote.d.ts +2 -2
  26. package/dist/types/components/breadcrumb/breadcrumb.d.ts +2 -2
  27. package/dist/types/components/breadcrumb/breadcrumb.style.d.ts +1 -1
  28. package/dist/types/components/breadcrumb/use-breadcrumb.d.ts +2 -2
  29. package/dist/types/components/button/button.d.ts +2 -2
  30. package/dist/types/components/button/icon-button.d.ts +2 -2
  31. package/dist/types/components/calendar/calendar.d.ts +2 -2
  32. package/dist/types/components/calendar/calendar.style.d.ts +2 -2
  33. package/dist/types/components/calendar/use-calendar.d.ts +8 -8
  34. package/dist/types/components/card/card.d.ts +2 -2
  35. package/dist/types/components/carousel/carousel.d.ts +2 -2
  36. package/dist/types/components/carousel/carousel.style.d.ts +2 -2
  37. package/dist/types/components/carousel/use-carousel.d.ts +3 -3
  38. package/dist/types/components/center/center.d.ts +2 -2
  39. package/dist/types/components/chart/chart.d.ts +5 -5
  40. package/dist/types/components/chart/polar-chart.style.d.ts +1 -1
  41. package/dist/types/components/chart/use-chart.d.ts +2 -2
  42. package/dist/types/components/checkbox/checkbox.d.ts +5 -5
  43. package/dist/types/components/checkbox/checkbox.style.d.ts +1 -1
  44. package/dist/types/components/checkbox/use-checkbox-group.d.ts +2 -2
  45. package/dist/types/components/checkbox-card/checkbox-card.d.ts +5 -5
  46. package/dist/types/components/checkbox-card/checkbox-card.style.d.ts +1 -1
  47. package/dist/types/components/circle-progress/circle-progress.d.ts +2 -2
  48. package/dist/types/components/close-button/close-button.d.ts +2 -2
  49. package/dist/types/components/code/code.d.ts +2 -2
  50. package/dist/types/components/collapse/collapse.d.ts +2 -2
  51. package/dist/types/components/color-picker/color-picker.d.ts +2 -2
  52. package/dist/types/components/color-picker/color-picker.style.d.ts +1 -1
  53. package/dist/types/components/color-picker/use-color-picker.d.ts +2 -2
  54. package/dist/types/components/color-selector/color-selector.d.ts +2 -2
  55. package/dist/types/components/color-selector/use-color-selector.d.ts +3 -3
  56. package/dist/types/components/color-swatch/color-swatch.d.ts +2 -2
  57. package/dist/types/components/container/container.d.ts +2 -2
  58. package/dist/types/components/data-list/data-list.d.ts +2 -2
  59. package/dist/types/components/data-list/data-list.style.d.ts +1 -1
  60. package/dist/types/components/date-picker/date-picker.d.ts +2 -2
  61. package/dist/types/components/date-picker/use-date-picker.d.ts +4 -4
  62. package/dist/types/components/drawer/drawer.d.ts +2 -2
  63. package/dist/types/components/dropzone/dropzone.d.ts +5 -5
  64. package/dist/types/components/dropzone/dropzone.style.d.ts +1 -1
  65. package/dist/types/components/editable/editable.d.ts +4 -4
  66. package/dist/types/components/editable/editable.style.d.ts +1 -1
  67. package/dist/types/components/editable/use-editable.d.ts +2 -2
  68. package/dist/types/components/em/em.d.ts +2 -2
  69. package/dist/types/components/empty-state/empty-state.d.ts +2 -2
  70. package/dist/types/components/empty-state/empty-state.style.d.ts +2 -2
  71. package/dist/types/components/fade/fade.d.ts +2 -2
  72. package/dist/types/components/field/field.d.ts +3 -3
  73. package/dist/types/components/field/use-field-props.d.ts +4 -4
  74. package/dist/types/components/fieldset/fieldset.d.ts +3 -3
  75. package/dist/types/components/file-button/file-button.d.ts +2 -2
  76. package/dist/types/components/file-button/use-file-button.d.ts +18 -18
  77. package/dist/types/components/file-input/file-input.d.ts +2 -2
  78. package/dist/types/components/file-input/use-file-input.d.ts +17 -17
  79. package/dist/types/components/flex/flex.d.ts +2 -2
  80. package/dist/types/components/flip/flip.d.ts +4 -4
  81. package/dist/types/components/flip/flip.style.d.ts +1 -1
  82. package/dist/types/components/float/float.d.ts +2 -2
  83. package/dist/types/components/form/form.d.ts +3 -3
  84. package/dist/types/components/form/form.style.d.ts +1 -1
  85. package/dist/types/components/format/format-byte.d.ts +4 -4
  86. package/dist/types/components/format/format-date-time.d.ts +4 -4
  87. package/dist/types/components/format/format-number.d.ts +2 -2
  88. package/dist/types/components/grid/grid-item.d.ts +2 -2
  89. package/dist/types/components/grid/grid.d.ts +2 -2
  90. package/dist/types/components/group/group.d.ts +2 -2
  91. package/dist/types/components/group/use-group.d.ts +2 -2
  92. package/dist/types/components/heading/heading.d.ts +2 -2
  93. package/dist/types/components/hue-slider/hue-slider.d.ts +3 -3
  94. package/dist/types/components/icon/icon.d.ts +5 -5
  95. package/dist/types/components/image/image.d.ts +2 -2
  96. package/dist/types/components/indicator/indicator.d.ts +4 -4
  97. package/dist/types/components/infinite-scroll-area/infinite-scroll-area.d.ts +2 -2
  98. package/dist/types/components/input/input-addon.d.ts +2 -2
  99. package/dist/types/components/input/input-element.d.ts +2 -2
  100. package/dist/types/components/input/input.d.ts +2 -2
  101. package/dist/types/components/kbd/kbd.d.ts +2 -2
  102. package/dist/types/components/link/link.d.ts +2 -2
  103. package/dist/types/components/link-box/link-box.d.ts +2 -2
  104. package/dist/types/components/list/list.d.ts +2 -2
  105. package/dist/types/components/list/list.style.d.ts +2 -2
  106. package/dist/types/components/loading/loading-provider.d.ts +2 -2
  107. package/dist/types/components/loading/loading.d.ts +3 -3
  108. package/dist/types/components/mark/mark.d.ts +2 -2
  109. package/dist/types/components/menu/menu.d.ts +2 -2
  110. package/dist/types/components/menu/use-menu.d.ts +11 -11
  111. package/dist/types/components/modal/modal.d.ts +2 -2
  112. package/dist/types/components/native-accordion/native-accordion.d.ts +2 -2
  113. package/dist/types/components/native-accordion/native-accordion.style.d.ts +2 -2
  114. package/dist/types/components/native-accordion/use-native-accordion.d.ts +2 -2
  115. package/dist/types/components/native-popover/native-popover.d.ts +2 -2
  116. package/dist/types/components/native-select/native-select.d.ts +2 -2
  117. package/dist/types/components/native-table/native-table.d.ts +4 -4
  118. package/dist/types/components/notice/notice.style.d.ts +1 -1
  119. package/dist/types/components/number-input/number-input.d.ts +2 -2
  120. package/dist/types/components/number-input/number-input.style.d.ts +1 -1
  121. package/dist/types/components/pagination/pagination.d.ts +2 -2
  122. package/dist/types/components/pagination/pagination.style.d.ts +1 -1
  123. package/dist/types/components/pagination/use-pagination.d.ts +2 -2
  124. package/dist/types/components/password-input/password-input.d.ts +2 -2
  125. package/dist/types/components/password-input/strength-meter.d.ts +2 -2
  126. package/dist/types/components/password-input/strength-meter.style.d.ts +1 -1
  127. package/dist/types/components/password-input/use-password-input.d.ts +2 -2
  128. package/dist/types/components/pin-input/pin-input.d.ts +2 -2
  129. package/dist/types/components/pin-input/use-pin-input.d.ts +7 -7
  130. package/dist/types/components/popover/popover.d.ts +2 -2
  131. package/dist/types/components/progress/progress.d.ts +4 -4
  132. package/dist/types/components/progress/use-progress.d.ts +706 -706
  133. package/dist/types/components/qr-code/qr-code.d.ts +2 -2
  134. package/dist/types/components/radio/radio.d.ts +5 -5
  135. package/dist/types/components/radio/radio.style.d.ts +1 -1
  136. package/dist/types/components/radio/use-radio-group.d.ts +2 -2
  137. package/dist/types/components/radio-card/radio-card.d.ts +5 -5
  138. package/dist/types/components/radio-card/radio-card.style.d.ts +1 -1
  139. package/dist/types/components/rating/rating.style.d.ts +2 -2
  140. package/dist/types/components/rating/use-rating.d.ts +7 -7
  141. package/dist/types/components/reorder/reorder.d.ts +2 -2
  142. package/dist/types/components/reorder/reorder.style.d.ts +1 -1
  143. package/dist/types/components/reorder/use-reorder.d.ts +3 -3
  144. package/dist/types/components/resizable/resizable.d.ts +2 -2
  145. package/dist/types/components/resizable/resizable.style.d.ts +2 -2
  146. package/dist/types/components/resizable/use-resizable.d.ts +2 -2
  147. package/dist/types/components/ripple/ripple.d.ts +2 -2
  148. package/dist/types/components/ripple/use-ripple.d.ts +2 -2
  149. package/dist/types/components/rotate/rotate.d.ts +2 -2
  150. package/dist/types/components/saturation-slider/saturation-slider.d.ts +2 -2
  151. package/dist/types/components/saturation-slider/use-saturation-slider.d.ts +2 -2
  152. package/dist/types/components/scroll-area/scroll-area.d.ts +2 -2
  153. package/dist/types/components/segmented-control/segmented-control.d.ts +2 -2
  154. package/dist/types/components/segmented-control/segmented-control.style.d.ts +2 -2
  155. package/dist/types/components/segmented-control/use-segmented-control.d.ts +9 -9
  156. package/dist/types/components/select/select.d.ts +2 -2
  157. package/dist/types/components/select/select.style.d.ts +1 -1
  158. package/dist/types/components/select/use-select.d.ts +4 -4
  159. package/dist/types/components/separator/separator.d.ts +2 -2
  160. package/dist/types/components/sidebar/sidebar.d.ts +2 -2
  161. package/dist/types/components/sidebar/use-sidebar.d.ts +9 -9
  162. package/dist/types/components/simple-grid/simple-grid.d.ts +2 -2
  163. package/dist/types/components/skeleton/skeleton.d.ts +2 -2
  164. package/dist/types/components/slide/slide.d.ts +2 -2
  165. package/dist/types/components/slide-fade/slide-fade.d.ts +2 -2
  166. package/dist/types/components/slider/slider.d.ts +2 -2
  167. package/dist/types/components/slider/use-slider.d.ts +2 -2
  168. package/dist/types/components/stack/h-stack.d.ts +2 -2
  169. package/dist/types/components/stack/stack.d.ts +2 -2
  170. package/dist/types/components/stack/v-stack.d.ts +2 -2
  171. package/dist/types/components/stack/z-stack.d.ts +2 -2
  172. package/dist/types/components/stat/stat.d.ts +2 -2
  173. package/dist/types/components/status/status.d.ts +2 -2
  174. package/dist/types/components/status/status.style.d.ts +2 -2
  175. package/dist/types/components/steps/steps.d.ts +2 -2
  176. package/dist/types/components/steps/steps.style.d.ts +1 -1
  177. package/dist/types/components/steps/use-steps.d.ts +10 -10
  178. package/dist/types/components/switch/switch.d.ts +2 -2
  179. package/dist/types/components/table/table.d.ts +2 -2
  180. package/dist/types/components/tabs/tabs.d.ts +2 -2
  181. package/dist/types/components/tabs/tabs.style.d.ts +1 -1
  182. package/dist/types/components/tabs/use-tabs.d.ts +16 -16
  183. package/dist/types/components/tag/tag.d.ts +2 -2
  184. package/dist/types/components/text/text.d.ts +2 -2
  185. package/dist/types/components/textarea/textarea.d.ts +2 -2
  186. package/dist/types/components/textarea/use-autosize.d.ts +2 -2
  187. package/dist/types/components/timeline/timeline.d.ts +5 -5
  188. package/dist/types/components/timeline/timeline.style.d.ts +1 -1
  189. package/dist/types/components/toggle/toggle.d.ts +3 -3
  190. package/dist/types/components/toggle/use-toggle-group.d.ts +2 -2
  191. package/dist/types/components/toggle/use-toggle.d.ts +2 -2
  192. package/dist/types/components/tooltip/tooltip.d.ts +2 -2
  193. package/dist/types/components/tree/tree.d.ts +2 -2
  194. package/dist/types/components/tree/tree.style.d.ts +1 -1
  195. package/dist/types/components/tree/use-tree.d.ts +184 -184
  196. package/dist/types/components/visually-hidden/visually-hidden.d.ts +2 -2
  197. package/dist/types/components/wrap/wrap.d.ts +2 -2
  198. package/dist/types/core/components/create-component.d.ts +7 -7
  199. package/dist/types/core/system/color-mode-provider.d.ts +2 -2
  200. package/dist/types/core/system/storage-script.d.ts +3 -3
  201. package/dist/types/core/system/styled.d.ts +2 -2
  202. package/dist/types/core/system/system-provider.d.ts +2 -2
  203. package/dist/types/hooks/use-breakpoint/use-breakpoint-state.d.ts +2 -2
  204. package/dist/types/hooks/use-clickable/index.d.ts +2 -2
  205. package/dist/types/hooks/use-clipboard/index.d.ts +2 -2
  206. package/dist/types/hooks/use-combobox/index.d.ts +12 -12
  207. package/dist/types/hooks/use-counter/index.d.ts +2 -2
  208. package/dist/types/hooks/use-descendants/index.d.ts +2 -2
  209. package/dist/types/providers/i18n-provider/i18n-provider.d.ts +3 -3
  210. package/dist/types/providers/ui-provider/ui-provider.d.ts +2 -2
  211. package/dist/types/utils/children.d.ts +2 -2
  212. package/package.json +2 -2
@@ -3,8 +3,9 @@
3
3
  const require_rolldown_runtime = require('../../_virtual/rolldown_runtime.cjs');
4
4
  const require_context = require('../../utils/context.cjs');
5
5
  const require_dom = require('../../utils/dom.cjs');
6
- const require_ref = require('../../utils/ref.cjs');
7
6
  const require_utils_index = require('../../utils/index.cjs');
7
+ const require_props = require('../../core/components/props.cjs');
8
+ require('../../core/index.cjs');
8
9
  const require_hooks_use_controllable_state_index = require('../../hooks/use-controllable-state/index.cjs');
9
10
  const require_use_field_props = require('../field/use-field-props.cjs');
10
11
  require('../field/index.cjs');
@@ -99,23 +100,21 @@ const useRating = (props = {}) => {
99
100
  ariaProps,
100
101
  dataProps,
101
102
  eventProps,
102
- getRootProps: (0, react.useCallback)(({ ref, ...props$1 } = {}) => ({
103
- ...dataProps,
104
- ...eventProps,
105
- ...ariaProps,
106
- id,
107
- "aria-label": `${value} Stars`,
108
- "aria-readonly": (0, require_utils_index.utils_exports.ariaAttr)(readOnly),
109
- role: "radiogroup",
110
- ...rest,
111
- ...props$1,
112
- ref: require_ref.mergeRefs(ref, rest.ref, rootRef),
113
- onMouseEnter: (0, require_utils_index.utils_exports.handlerAll)(props$1.onMouseEnter, rest.onMouseEnter, onMouseEnter),
114
- onMouseLeave: (0, require_utils_index.utils_exports.handlerAll)(props$1.onMouseLeave, rest.onMouseLeave, onMouseLeave),
115
- onMouseMove: (0, require_utils_index.utils_exports.handlerAll)(props$1.onMouseMove, rest.onMouseMove, onMouseMove),
116
- onTouchEnd: (0, require_utils_index.utils_exports.handlerAll)(props$1.onTouchEnd, rest.onTouchEnd, onTouchEnd),
117
- onTouchStart: (0, require_utils_index.utils_exports.handlerAll)(props$1.onTouchStart, rest.onTouchStart, onTouchStart)
118
- }), [
103
+ getRootProps: (0, react.useCallback)(({ ref, ...props$1 } = {}) => {
104
+ return {
105
+ ...require_props.mergeProps(dataProps, eventProps, ariaProps, {
106
+ id,
107
+ "aria-label": `${value} Stars`,
108
+ "aria-readonly": (0, require_utils_index.utils_exports.ariaAttr)(readOnly),
109
+ role: "radiogroup"
110
+ }, rest, props$1, { ref }, { ref: rootRef })(),
111
+ onMouseEnter: (0, require_utils_index.utils_exports.handlerAll)(props$1.onMouseEnter, rest.onMouseEnter, onMouseEnter),
112
+ onMouseLeave: (0, require_utils_index.utils_exports.handlerAll)(props$1.onMouseLeave, rest.onMouseLeave, onMouseLeave),
113
+ onMouseMove: (0, require_utils_index.utils_exports.handlerAll)(props$1.onMouseMove, rest.onMouseMove, onMouseMove),
114
+ onTouchEnd: (0, require_utils_index.utils_exports.handlerAll)(props$1.onTouchEnd, rest.onTouchEnd, onTouchEnd),
115
+ onTouchStart: (0, require_utils_index.utils_exports.handlerAll)(props$1.onTouchStart, rest.onTouchStart, onTouchStart)
116
+ };
117
+ }, [
119
118
  ariaProps,
120
119
  dataProps,
121
120
  eventProps,
@@ -163,21 +162,14 @@ const useRatingItem = ({ groupValue, index, ...rest }) => {
163
162
  const onKeyDown = (0, react.useCallback)((ev) => {
164
163
  require_dom.runKeyAction(ev, { Space: () => onChange(value) });
165
164
  }, [onChange, value]);
166
- const getLabelProps = (0, react.useCallback)(({ style, ...props } = {}) => ({
167
- ...dataProps,
168
- ...ariaProps,
165
+ const getLabelProps = (0, react.useCallback)(({ style, ...props } = {}) => require_props.mergeProps(dataProps, ariaProps, {
169
166
  htmlFor: id,
170
167
  "data-active": (0, require_utils_index.utils_exports.dataAttr)(active),
171
- "data-filled": (0, require_utils_index.utils_exports.dataAttr)(filled),
172
- ...rest,
173
- ...props,
174
- style: {
175
- ...style,
176
- zIndex: fractionValue !== 1 ? active ? 1 : -1 : void 0
177
- },
178
- onMouseDown: (0, require_utils_index.utils_exports.handlerAll)(props.onMouseDown, onMouseDown),
179
- onTouchStart: (0, require_utils_index.utils_exports.handlerAll)(props.onTouchStart, onTouchStart)
180
- }), [
168
+ "data-filled": (0, require_utils_index.utils_exports.dataAttr)(filled)
169
+ }, rest, props, { style }, { style: { zIndex: fractionValue !== 1 ? active ? 1 : -1 : void 0 } }, {
170
+ onMouseDown,
171
+ onTouchStart
172
+ })(), [
181
173
  active,
182
174
  ariaProps,
183
175
  dataProps,
@@ -1 +1 @@
1
- {"version":3,"file":"use-rating.cjs","names":["createContext","useFieldProps","useControllableState","roundedValue","props","mergeRefs","value","getLabelProps: PropGetter<\"label\">","visuallyHiddenAttributes"],"sources":["../../../../src/components/rating/use-rating.tsx"],"sourcesContent":["\"use client\"\n\nimport type { ChangeEvent, KeyboardEvent, MouseEvent, TouchEvent } from \"react\"\nimport type { HTMLProps, PropGetter } from \"../../core\"\nimport type { FieldProps } from \"../field\"\nimport { useCallback, useId, useMemo, useRef, useState } from \"react\"\nimport { useControllableState } from \"../../hooks/use-controllable-state\"\nimport {\n ariaAttr,\n clampNumber,\n createContext,\n dataAttr,\n handlerAll,\n mergeRefs,\n runKeyAction,\n visuallyHiddenAttributes,\n} from \"../../utils\"\nimport { useFieldProps } from \"../field\"\n\nconst getRoundedValue = (value: number, to: number) => {\n const rounded = Math.round(value / to) * to\n const precision = `${to}`.split(\".\")[1]?.length || 0\n\n return Number(rounded.toFixed(precision))\n}\n\nexport interface RatingContext extends Omit<UseRatingReturn, \"getRootProps\"> {}\n\nconst [RatingContext, useRatingContext] = createContext<RatingContext>({\n name: \"RatingContext\",\n})\n\nexport { RatingContext, useRatingContext }\n\nexport interface UseRatingProps\n extends FieldProps, Omit<HTMLProps, \"color\" | \"defaultValue\" | \"onChange\"> {\n /**\n * Number of controls that should be rendered.\n *\n * @default 5\n */\n count?: number\n /**\n * The initial value of the rating.\n *\n * @default 0\n */\n defaultValue?: number\n /**\n * Number of fractions each item can be divided into,\n *\n * @default 1\n */\n fractions?: number\n /**\n * If `true`, only the selected icons will be filled.\n *\n * @default false\n */\n highlightSelectedOnly?: boolean\n /**\n * The top-level id string that will be applied to the rating.\n * The index of the rating item will be appended to this top-level id.\n */\n id?: string\n /**\n * The name of the input element.\n */\n name?: string\n /**\n * The value of the rating.\n */\n value?: number\n /**\n * The callback invoked when value state changes.\n */\n onChange?: (value: number) => void\n /**\n * The callback invoked when hovering over the rating.\n */\n onHover?: (value: number) => void\n}\n\nexport const useRating = (props: UseRatingProps = {}) => {\n const uuid = useId()\n const {\n props: {\n id = uuid,\n name = uuid,\n count: countProp = 5,\n defaultValue = 0,\n disabled,\n fractions: fractionsProp = 1,\n highlightSelectedOnly = false,\n readOnly,\n required,\n value: valueProp,\n onChange: onChangeProp,\n onHover,\n ...rest\n },\n ariaProps,\n dataProps,\n eventProps,\n } = useFieldProps({ ...props, notSupportReadOnly: true })\n const rootRef = useRef<HTMLDivElement>(null)\n const [value, setValue] = useControllableState({\n defaultValue,\n value: valueProp,\n onChange: onChangeProp,\n })\n const [hoveredValue, setHoveredValue] = useState(-1)\n const outsideRef = useRef(true)\n const fractions = Math.floor(fractionsProp)\n const count = Math.floor(countProp)\n const decimal = 1 / fractions\n const roundedValue = useMemo(\n () => getRoundedValue(value, decimal),\n [decimal, value],\n )\n const interactive = !(readOnly || disabled)\n const displayValue = hoveredValue !== -1 ? hoveredValue : roundedValue\n\n const getHoveredValue = useCallback(\n (x: number) => {\n if (!rootRef.current) return -1\n\n const { left, width } = rootRef.current.getBoundingClientRect()\n const itemWidth = width / count\n\n const hoveredValue = (x - left) / itemWidth\n\n const value = clampNumber(\n getRoundedValue(hoveredValue + decimal / 2, decimal),\n decimal,\n count,\n )\n\n return value\n },\n [count, decimal],\n )\n\n const onMouseEnter = useCallback(() => {\n if (interactive) outsideRef.current = false\n }, [interactive])\n\n const onMouseLeave = useCallback(() => {\n if (!interactive) return\n\n setHoveredValue(-1)\n outsideRef.current = true\n\n if (hoveredValue !== -1) onHover?.(-1)\n }, [hoveredValue, onHover, interactive, setHoveredValue])\n\n const onMouseMove = useCallback(\n (ev: MouseEvent<HTMLDivElement>) => {\n if (disabled || readOnly) return\n\n const roundedValue = getHoveredValue(ev.clientX)\n\n setHoveredValue(roundedValue)\n\n if (roundedValue !== hoveredValue) onHover?.(roundedValue)\n },\n [disabled, getHoveredValue, hoveredValue, readOnly, onHover],\n )\n\n const onTouchStart = useCallback(\n (ev: TouchEvent<HTMLDivElement>) => {\n ev.preventDefault()\n\n const el = ev.touches[0]\n\n if (!el) return\n\n const value = getHoveredValue(el.clientX)\n\n setValue(value)\n },\n [getHoveredValue, setValue],\n )\n\n const onTouchEnd = useCallback((ev: TouchEvent<HTMLDivElement>) => {\n ev.preventDefault()\n }, [])\n\n const getRootProps: PropGetter = useCallback(\n ({ ref, ...props } = {}) => ({\n ...dataProps,\n ...eventProps,\n ...ariaProps,\n id,\n \"aria-label\": `${value} Stars`,\n \"aria-readonly\": ariaAttr(readOnly),\n role: \"radiogroup\",\n ...rest,\n ...props,\n ref: mergeRefs(ref, rest.ref, rootRef),\n onMouseEnter: handlerAll(\n props.onMouseEnter,\n rest.onMouseEnter,\n onMouseEnter,\n ),\n onMouseLeave: handlerAll(\n props.onMouseLeave,\n rest.onMouseLeave,\n onMouseLeave,\n ),\n onMouseMove: handlerAll(props.onMouseMove, rest.onMouseMove, onMouseMove),\n onTouchEnd: handlerAll(props.onTouchEnd, rest.onTouchEnd, onTouchEnd),\n onTouchStart: handlerAll(\n props.onTouchStart,\n rest.onTouchStart,\n onTouchStart,\n ),\n }),\n [\n ariaProps,\n dataProps,\n eventProps,\n id,\n onMouseEnter,\n onMouseLeave,\n onMouseMove,\n onTouchEnd,\n onTouchStart,\n readOnly,\n rest,\n value,\n ],\n )\n\n return {\n id,\n name,\n count,\n decimal,\n disabled,\n displayValue,\n fractions,\n highlightSelectedOnly,\n hoveredValue,\n interactive,\n outsideRef,\n readOnly,\n required,\n roundedValue,\n setHoveredValue,\n setValue,\n value,\n ariaProps,\n dataProps,\n eventProps,\n getRootProps,\n }\n}\n\nexport type UseRatingReturn = ReturnType<typeof useRating>\n\nexport interface UseRatingItemProps extends HTMLProps<\"label\"> {\n groupValue: number\n index: number\n}\n\nexport const useRatingItem = ({\n groupValue,\n index,\n ...rest\n}: UseRatingItemProps) => {\n const {\n id: rootId,\n name,\n decimal,\n disabled,\n displayValue,\n highlightSelectedOnly,\n interactive,\n outsideRef,\n readOnly,\n required,\n roundedValue,\n setHoveredValue,\n setValue,\n ariaProps,\n dataProps,\n eventProps,\n } = useRatingContext()\n const fractionValue = decimal * (groupValue === 1 ? index : index + 1)\n const value = useMemo(\n () => getRoundedValue(groupValue - 1 + fractionValue, decimal),\n [decimal, fractionValue, groupValue],\n )\n const active = value === displayValue\n const checked = value === roundedValue\n const filled = highlightSelectedOnly\n ? value === displayValue\n : value <= displayValue\n const id = `${rootId}-${groupValue}-${value}`\n\n const onBlur = useCallback(() => {\n if (outsideRef.current) setHoveredValue(-1)\n }, [outsideRef, setHoveredValue])\n\n const onInputChange = useCallback(\n (ev: ChangeEvent<HTMLInputElement>) => {\n if (!interactive) return\n\n const value = parseFloat(ev.target.value)\n\n setHoveredValue(value)\n },\n [interactive, setHoveredValue],\n )\n\n const onChange = useCallback(\n (value: number) => {\n if (!interactive) return\n\n setValue(value)\n },\n [interactive, setValue],\n )\n\n const onMouseDown = useCallback(() => {\n onChange(value)\n }, [onChange, value])\n\n const onTouchStart = useCallback(() => {\n onChange(value)\n }, [onChange, value])\n\n const onKeyDown = useCallback(\n (ev: KeyboardEvent<HTMLInputElement>) => {\n runKeyAction(ev, {\n Space: () => onChange(value),\n })\n },\n [onChange, value],\n )\n\n const getLabelProps: PropGetter<\"label\"> = useCallback(\n ({ style, ...props } = {}) => ({\n ...dataProps,\n ...ariaProps,\n htmlFor: id,\n \"data-active\": dataAttr(active),\n \"data-filled\": dataAttr(filled),\n ...rest,\n ...props,\n style: {\n ...style,\n zIndex: fractionValue !== 1 ? (active ? 1 : -1) : undefined,\n },\n onMouseDown: handlerAll(props.onMouseDown, onMouseDown),\n onTouchStart: handlerAll(props.onTouchStart, onTouchStart),\n }),\n [\n active,\n ariaProps,\n dataProps,\n filled,\n fractionValue,\n id,\n onMouseDown,\n onTouchStart,\n rest,\n ],\n )\n\n const getInputProps: PropGetter<\"input\"> = useCallback(\n (props = {}) => ({\n ...dataProps,\n ...eventProps,\n ...ariaProps,\n id,\n type: \"radio\",\n name,\n style: visuallyHiddenAttributes.style,\n \"aria-label\": value.toString(),\n \"data-active\": dataAttr(active),\n \"data-checked\": dataAttr(checked),\n checked,\n disabled,\n readOnly,\n required,\n value,\n ...props,\n onBlur: handlerAll(onBlur, props.onBlur),\n onChange: handlerAll(props.onChange, onInputChange),\n onKeyDown: handlerAll(props.onKeyDown, onKeyDown),\n }),\n [\n id,\n name,\n value,\n active,\n checked,\n dataProps,\n eventProps,\n ariaProps,\n disabled,\n readOnly,\n required,\n onBlur,\n onInputChange,\n onKeyDown,\n ],\n )\n\n return {\n active,\n checked,\n filled,\n fractionValue,\n groupValue,\n value,\n getInputProps,\n getLabelProps,\n }\n}\n\nexport type UseRatingItemReturn = ReturnType<typeof useRatingItem>\n"],"mappings":"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"}
1
+ {"version":3,"file":"use-rating.cjs","names":["createContext","useFieldProps","useControllableState","roundedValue","props","mergeProps","value","getLabelProps: PropGetter<\"label\">","visuallyHiddenAttributes"],"sources":["../../../../src/components/rating/use-rating.tsx"],"sourcesContent":["\"use client\"\n\nimport type { ChangeEvent, KeyboardEvent, MouseEvent, TouchEvent } from \"react\"\nimport type { HTMLProps, PropGetter } from \"../../core\"\nimport type { FieldProps } from \"../field\"\nimport { useCallback, useId, useMemo, useRef, useState } from \"react\"\nimport { mergeProps } from \"../../core\"\nimport { useControllableState } from \"../../hooks/use-controllable-state\"\nimport {\n ariaAttr,\n clampNumber,\n createContext,\n dataAttr,\n handlerAll,\n runKeyAction,\n visuallyHiddenAttributes,\n} from \"../../utils\"\nimport { useFieldProps } from \"../field\"\n\nconst getRoundedValue = (value: number, to: number) => {\n const rounded = Math.round(value / to) * to\n const precision = `${to}`.split(\".\")[1]?.length || 0\n\n return Number(rounded.toFixed(precision))\n}\n\nexport interface RatingContext extends Omit<UseRatingReturn, \"getRootProps\"> {}\n\nconst [RatingContext, useRatingContext] = createContext<RatingContext>({\n name: \"RatingContext\",\n})\n\nexport { RatingContext, useRatingContext }\n\nexport interface UseRatingProps\n extends FieldProps, Omit<HTMLProps, \"color\" | \"defaultValue\" | \"onChange\"> {\n /**\n * Number of controls that should be rendered.\n *\n * @default 5\n */\n count?: number\n /**\n * The initial value of the rating.\n *\n * @default 0\n */\n defaultValue?: number\n /**\n * Number of fractions each item can be divided into,\n *\n * @default 1\n */\n fractions?: number\n /**\n * If `true`, only the selected icons will be filled.\n *\n * @default false\n */\n highlightSelectedOnly?: boolean\n /**\n * The top-level id string that will be applied to the rating.\n * The index of the rating item will be appended to this top-level id.\n */\n id?: string\n /**\n * The name of the input element.\n */\n name?: string\n /**\n * The value of the rating.\n */\n value?: number\n /**\n * The callback invoked when value state changes.\n */\n onChange?: (value: number) => void\n /**\n * The callback invoked when hovering over the rating.\n */\n onHover?: (value: number) => void\n}\n\nexport const useRating = (props: UseRatingProps = {}) => {\n const uuid = useId()\n const {\n props: {\n id = uuid,\n name = uuid,\n count: countProp = 5,\n defaultValue = 0,\n disabled,\n fractions: fractionsProp = 1,\n highlightSelectedOnly = false,\n readOnly,\n required,\n value: valueProp,\n onChange: onChangeProp,\n onHover,\n ...rest\n },\n ariaProps,\n dataProps,\n eventProps,\n } = useFieldProps({ ...props, notSupportReadOnly: true })\n const rootRef = useRef<HTMLDivElement>(null)\n const [value, setValue] = useControllableState({\n defaultValue,\n value: valueProp,\n onChange: onChangeProp,\n })\n const [hoveredValue, setHoveredValue] = useState(-1)\n const outsideRef = useRef(true)\n const fractions = Math.floor(fractionsProp)\n const count = Math.floor(countProp)\n const decimal = 1 / fractions\n const roundedValue = useMemo(\n () => getRoundedValue(value, decimal),\n [decimal, value],\n )\n const interactive = !(readOnly || disabled)\n const displayValue = hoveredValue !== -1 ? hoveredValue : roundedValue\n\n const getHoveredValue = useCallback(\n (x: number) => {\n if (!rootRef.current) return -1\n\n const { left, width } = rootRef.current.getBoundingClientRect()\n const itemWidth = width / count\n\n const hoveredValue = (x - left) / itemWidth\n\n const value = clampNumber(\n getRoundedValue(hoveredValue + decimal / 2, decimal),\n decimal,\n count,\n )\n\n return value\n },\n [count, decimal],\n )\n\n const onMouseEnter = useCallback(() => {\n if (interactive) outsideRef.current = false\n }, [interactive])\n\n const onMouseLeave = useCallback(() => {\n if (!interactive) return\n\n setHoveredValue(-1)\n outsideRef.current = true\n\n if (hoveredValue !== -1) onHover?.(-1)\n }, [hoveredValue, onHover, interactive, setHoveredValue])\n\n const onMouseMove = useCallback(\n (ev: MouseEvent<HTMLDivElement>) => {\n if (disabled || readOnly) return\n\n const roundedValue = getHoveredValue(ev.clientX)\n\n setHoveredValue(roundedValue)\n\n if (roundedValue !== hoveredValue) onHover?.(roundedValue)\n },\n [disabled, getHoveredValue, hoveredValue, readOnly, onHover],\n )\n\n const onTouchStart = useCallback(\n (ev: TouchEvent<HTMLDivElement>) => {\n ev.preventDefault()\n\n const el = ev.touches[0]\n\n if (!el) return\n\n const value = getHoveredValue(el.clientX)\n\n setValue(value)\n },\n [getHoveredValue, setValue],\n )\n\n const onTouchEnd = useCallback((ev: TouchEvent<HTMLDivElement>) => {\n ev.preventDefault()\n }, [])\n\n const getRootProps: PropGetter = useCallback(\n ({ ref, ...props } = {}) => {\n const merged = mergeProps(\n dataProps,\n eventProps,\n ariaProps,\n {\n id,\n \"aria-label\": `${value} Stars`,\n \"aria-readonly\": ariaAttr(readOnly),\n role: \"radiogroup\",\n },\n rest,\n props,\n { ref },\n { ref: rootRef },\n )()\n return {\n ...merged,\n onMouseEnter: handlerAll(\n props.onMouseEnter,\n rest.onMouseEnter,\n onMouseEnter,\n ),\n onMouseLeave: handlerAll(\n props.onMouseLeave,\n rest.onMouseLeave,\n onMouseLeave,\n ),\n onMouseMove: handlerAll(\n props.onMouseMove,\n rest.onMouseMove,\n onMouseMove,\n ),\n onTouchEnd: handlerAll(props.onTouchEnd, rest.onTouchEnd, onTouchEnd),\n onTouchStart: handlerAll(\n props.onTouchStart,\n rest.onTouchStart,\n onTouchStart,\n ),\n }\n },\n [\n ariaProps,\n dataProps,\n eventProps,\n id,\n onMouseEnter,\n onMouseLeave,\n onMouseMove,\n onTouchEnd,\n onTouchStart,\n readOnly,\n rest,\n value,\n ],\n )\n\n return {\n id,\n name,\n count,\n decimal,\n disabled,\n displayValue,\n fractions,\n highlightSelectedOnly,\n hoveredValue,\n interactive,\n outsideRef,\n readOnly,\n required,\n roundedValue,\n setHoveredValue,\n setValue,\n value,\n ariaProps,\n dataProps,\n eventProps,\n getRootProps,\n }\n}\n\nexport type UseRatingReturn = ReturnType<typeof useRating>\n\nexport interface UseRatingItemProps extends HTMLProps<\"label\"> {\n groupValue: number\n index: number\n}\n\nexport const useRatingItem = ({\n groupValue,\n index,\n ...rest\n}: UseRatingItemProps) => {\n const {\n id: rootId,\n name,\n decimal,\n disabled,\n displayValue,\n highlightSelectedOnly,\n interactive,\n outsideRef,\n readOnly,\n required,\n roundedValue,\n setHoveredValue,\n setValue,\n ariaProps,\n dataProps,\n eventProps,\n } = useRatingContext()\n const fractionValue = decimal * (groupValue === 1 ? index : index + 1)\n const value = useMemo(\n () => getRoundedValue(groupValue - 1 + fractionValue, decimal),\n [decimal, fractionValue, groupValue],\n )\n const active = value === displayValue\n const checked = value === roundedValue\n const filled = highlightSelectedOnly\n ? value === displayValue\n : value <= displayValue\n const id = `${rootId}-${groupValue}-${value}`\n\n const onBlur = useCallback(() => {\n if (outsideRef.current) setHoveredValue(-1)\n }, [outsideRef, setHoveredValue])\n\n const onInputChange = useCallback(\n (ev: ChangeEvent<HTMLInputElement>) => {\n if (!interactive) return\n\n const value = parseFloat(ev.target.value)\n\n setHoveredValue(value)\n },\n [interactive, setHoveredValue],\n )\n\n const onChange = useCallback(\n (value: number) => {\n if (!interactive) return\n\n setValue(value)\n },\n [interactive, setValue],\n )\n\n const onMouseDown = useCallback(() => {\n onChange(value)\n }, [onChange, value])\n\n const onTouchStart = useCallback(() => {\n onChange(value)\n }, [onChange, value])\n\n const onKeyDown = useCallback(\n (ev: KeyboardEvent<HTMLInputElement>) => {\n runKeyAction(ev, {\n Space: () => onChange(value),\n })\n },\n [onChange, value],\n )\n\n const getLabelProps: PropGetter<\"label\"> = useCallback(\n ({ style, ...props } = {}) =>\n mergeProps(\n dataProps,\n ariaProps,\n {\n htmlFor: id,\n \"data-active\": dataAttr(active),\n \"data-filled\": dataAttr(filled),\n },\n rest,\n props,\n { style },\n {\n style: {\n zIndex: fractionValue !== 1 ? (active ? 1 : -1) : undefined,\n },\n },\n { onMouseDown, onTouchStart },\n )(),\n [\n active,\n ariaProps,\n dataProps,\n filled,\n fractionValue,\n id,\n onMouseDown,\n onTouchStart,\n rest,\n ],\n )\n\n const getInputProps: PropGetter<\"input\"> = useCallback(\n (props = {}) => ({\n ...dataProps,\n ...eventProps,\n ...ariaProps,\n id,\n type: \"radio\",\n name,\n style: visuallyHiddenAttributes.style,\n \"aria-label\": value.toString(),\n \"data-active\": dataAttr(active),\n \"data-checked\": dataAttr(checked),\n checked,\n disabled,\n readOnly,\n required,\n value,\n ...props,\n onBlur: handlerAll(onBlur, props.onBlur),\n onChange: handlerAll(props.onChange, onInputChange),\n onKeyDown: handlerAll(props.onKeyDown, onKeyDown),\n }),\n [\n id,\n name,\n value,\n active,\n checked,\n dataProps,\n eventProps,\n ariaProps,\n disabled,\n readOnly,\n required,\n onBlur,\n onInputChange,\n onKeyDown,\n ],\n )\n\n return {\n active,\n checked,\n filled,\n fractionValue,\n groupValue,\n value,\n getInputProps,\n getLabelProps,\n }\n}\n\nexport type UseRatingItemReturn = ReturnType<typeof useRatingItem>\n"],"mappings":"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"}
@@ -6,6 +6,8 @@ const require_context = require('../../utils/context.cjs');
6
6
  const require_effect = require('../../utils/effect.cjs');
7
7
  const require_ref = require('../../utils/ref.cjs');
8
8
  const require_utils_index = require('../../utils/index.cjs');
9
+ const require_props = require('../../core/components/props.cjs');
10
+ require('../../core/index.cjs');
9
11
  let react = require("react");
10
12
  let motion_react = require("motion/react");
11
13
 
@@ -72,16 +74,14 @@ const useReorder = ({ ref, children, item, items = [], orientation = "vertical",
72
74
  children: cloneChildren,
73
75
  orientation,
74
76
  values,
75
- getRootProps: (0, react.useCallback)((props = {}) => ({
77
+ getRootProps: (0, react.useCallback)((props = {}) => require_props.mergeProps({
76
78
  axis,
77
- values,
78
- ...rest,
79
- ...props,
80
- ref: require_ref.mergeRefs(props.ref, ref),
81
- onMouseUp: (0, require_utils_index.utils_exports.handlerAll)(props.onMouseUp, rest.onMouseUp, onCompleteReorder),
82
- onReorder: (0, require_utils_index.utils_exports.handlerAll)(props.onReorder, rest.onReorder, onReorder),
83
- onTouchEnd: (0, require_utils_index.utils_exports.handlerAll)(props.onTouchEnd, rest.onTouchEnd, onCompleteReorder)
84
- }), [
79
+ values
80
+ }, rest, props, { ref }, {
81
+ onMouseUp: onCompleteReorder,
82
+ onReorder,
83
+ onTouchEnd: onCompleteReorder
84
+ })(), [
85
85
  rest,
86
86
  ref,
87
87
  onCompleteReorder,
@@ -119,14 +119,13 @@ const useReorderItem = ({ ref, label, value, ...rest }) => {
119
119
  getItemProps: (0, react.useCallback)((props = {}) => {
120
120
  const children = props.children ?? rest.children ?? label;
121
121
  return {
122
- "data-has-trigger": (0, require_utils_index.utils_exports.dataAttr)(hasTrigger),
123
- "data-selected": (0, require_utils_index.utils_exports.dataAttr)(drag),
124
- dragControls,
125
- dragListener: !hasTrigger,
126
- value: value ?? getAlternativeValue({ children }),
127
- ...props,
128
- ...rest,
129
- ref: require_ref.mergeRefs(props.ref, ref),
122
+ ...require_props.mergeProps({
123
+ "data-has-trigger": (0, require_utils_index.utils_exports.dataAttr)(hasTrigger),
124
+ "data-selected": (0, require_utils_index.utils_exports.dataAttr)(drag),
125
+ dragControls,
126
+ dragListener: !hasTrigger,
127
+ value: value ?? getAlternativeValue({ children })
128
+ }, props, rest, { ref })(),
130
129
  style: {
131
130
  x,
132
131
  y,
@@ -1 +1 @@
1
- {"version":3,"file":"use-reorder.cjs","names":["createContext","useValidChildren","values","mergeRefs","x","y"],"sources":["../../../../src/components/reorder/use-reorder.ts"],"sourcesContent":["\"use client\"\n\nimport type { HTMLMotionProps, Reorder } from \"motion/react\"\nimport type { PropsWithChildren, ReactElement, ReactNode } from \"react\"\nimport type { Orientation, PropGetter } from \"../../core\"\nimport type { Dict, Merge } from \"../../utils\"\nimport { useDragControls, useMotionValue } from \"motion/react\"\nimport {\n cloneElement,\n useCallback,\n useEffect,\n useMemo,\n useRef,\n useState,\n} from \"react\"\nimport {\n createContext,\n dataAttr,\n handlerAll,\n isArray,\n isObject,\n mergeRefs,\n useUpdateEffect,\n useValidChildren,\n} from \"../../utils\"\n\nconst getAlternativeValue = ({ children, label }: Dict = {}) =>\n serializeValue(children ?? label)\n\nconst serializeValue = (value: any) =>\n isObject(value) || isArray(value) ? JSON.stringify(value) : value\n\ntype ReorderGroupProps<Y = string> = Merge<\n HTMLMotionProps<\"ul\">,\n Pick<Parameters<typeof Reorder.Group<Y>>[0], \"axis\" | \"onReorder\" | \"values\">\n>\ntype ReorderItemProps<Y = string> = Merge<\n HTMLMotionProps<\"li\">,\n Partial<Pick<Parameters<typeof Reorder.Item<Y>>[0], \"layout\" | \"value\">>\n>\n\ninterface ReorderContext extends Pick<UseReorderProps, \"orientation\"> {}\n\nconst [ReorderContext, useReorderContext] = createContext<ReorderContext>({\n name: \"ReorderContext\",\n})\n\nexport { ReorderContext, useReorderContext }\n\ninterface ReorderItemContext {\n getTriggerProps: PropGetter\n}\n\nconst [ReorderItemContext, useReorderItemContext] =\n createContext<ReorderItemContext>({\n name: \"ReorderItemContext\",\n })\n\nexport { ReorderItemContext, useReorderItemContext }\n\nexport interface UseReorderProps<Y = string>\n extends\n Partial<Omit<ReorderGroupProps<Y>, \"children\" | \"onChange\" | \"values\">>,\n PropsWithChildren {\n /**\n * The component to be used for the item.\n */\n item?: ReactElement<any>\n /**\n * If provided, generate reorder items based on items.\n *\n */\n items?: UseReorderItemProps<Y>[]\n /**\n * The orientation of the reorder.\n *\n * @default 'vertical'\n */\n orientation?: Orientation\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 const useReorder = <Y = string>({\n ref,\n children,\n item,\n items = [],\n orientation = \"vertical\",\n onChange,\n onCompleteChange,\n ...rest\n}: UseReorderProps<Y> = {}) => {\n const axis = orientation === \"vertical\" ? \"y\" : \"x\"\n const validChildren = useValidChildren(children)\n const hasChildren = !!validChildren.length\n const defaultValues = useMemo(() => {\n const values = hasChildren\n ? validChildren.map(\n ({ props }) => props.value ?? getAlternativeValue(props),\n )\n : items.map((props) => props.value ?? getAlternativeValue(props))\n\n const duplicatedValues = values.filter(\n (value, index, self) =>\n self.indexOf(value) === index && index !== self.lastIndexOf(value),\n )\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 Array.from(new Set(values))\n }, [hasChildren, validChildren, items])\n const childMap = useMemo(() => {\n return Object.fromEntries(\n validChildren.map((child) => [\n serializeValue(child.props.value) ??\n serializeValue(getAlternativeValue(child.props)),\n child,\n ]),\n )\n }, [validChildren])\n const itemMap = useMemo(() => {\n return Object.fromEntries(\n items.map((props) => [\n serializeValue(props.value) ??\n serializeValue(getAlternativeValue(props)),\n props,\n ]),\n )\n }, [items])\n const prevDefaultValues = useRef<Y[]>(defaultValues)\n const [values, setValues] = useState<Y[]>(defaultValues)\n const prevValues = useRef<Y[]>(defaultValues)\n const cloneChildren = useMemo(\n () =>\n values.map((value) => {\n if (hasChildren) {\n return childMap[serializeValue(value)]\n } else {\n const props = itemMap[serializeValue(value)]\n\n return props && item\n ? cloneElement(item, { key: serializeValue(props.value), ...props })\n : null\n }\n }),\n [values, hasChildren, childMap, itemMap, item],\n )\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 equal = JSON.stringify(prevValues.current) === JSON.stringify(values)\n\n if (equal) return\n\n prevValues.current = values\n\n onCompleteChange?.(values)\n }, [onCompleteChange, values])\n\n useUpdateEffect(() => {\n const equal =\n JSON.stringify(defaultValues) ===\n JSON.stringify(prevDefaultValues.current)\n\n if (equal) return\n\n prevValues.current = defaultValues\n prevDefaultValues.current = defaultValues\n\n setValues(defaultValues)\n }, [defaultValues])\n\n const getRootProps: PropGetter<\n Partial<Omit<ReorderGroupProps<Y>, \"values\">>,\n undefined,\n ReorderGroupProps<Y>\n > = useCallback(\n (props = {}) => ({\n axis,\n values,\n ...rest,\n ...props,\n ref: mergeRefs(props.ref, ref),\n onMouseUp: handlerAll(props.onMouseUp, rest.onMouseUp, onCompleteReorder),\n onReorder: handlerAll(props.onReorder, rest.onReorder, onReorder),\n onTouchEnd: handlerAll(\n props.onTouchEnd,\n rest.onTouchEnd,\n onCompleteReorder,\n ),\n }),\n [rest, ref, onCompleteReorder, onReorder, axis, values],\n )\n\n return { children: cloneChildren, orientation, values, getRootProps }\n}\n\nexport type UseReorderReturn<Y = string> = ReturnType<typeof useReorder<Y>>\n\nexport interface UseReorderItemProps<Y = string> extends ReorderItemProps<Y> {\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 const useReorderItem = <Y = string>({\n ref,\n label,\n value,\n ...rest\n}: UseReorderItemProps<Y>) => {\n const { orientation } = useReorderContext()\n const dragControls = useDragControls()\n const [hasTrigger, setHasTrigger] = useState<boolean>(false)\n const [drag, setDrag] = useState<boolean>(false)\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\") setDrag(x !== 0)\n })\n const unsubscribeY = y.on(\"change\", (y) => {\n if (orientation === \"vertical\") setDrag(y !== 0)\n })\n\n return () => {\n unsubscribeX()\n unsubscribeY()\n }\n }, [orientation, x, y])\n\n const getItemProps: PropGetter<\n Omit<HTMLMotionProps<\"li\">, \"layout\" | \"value\"> &\n Pick<ReorderItemProps<Y>, \"layout\">,\n undefined,\n ReorderItemProps<Y>\n > = useCallback(\n (props = {}) => {\n const children = props.children ?? rest.children ?? label\n\n return {\n \"data-has-trigger\": dataAttr(hasTrigger),\n \"data-selected\": dataAttr(drag),\n dragControls,\n dragListener: !hasTrigger,\n value: value ?? getAlternativeValue({ children }),\n ...props,\n ...rest,\n ref: mergeRefs(props.ref, ref),\n style: { x, y, ...props.style, ...rest.style },\n children,\n }\n },\n [ref, rest, dragControls, hasTrigger, value, x, y, drag, label],\n )\n\n const getTriggerProps: PropGetter = useCallback(\n (props = {}) => ({\n ...props,\n ref: mergeRefs(register, props.ref),\n \"data-selected\": dataAttr(drag),\n onPointerDown: handlerAll(props.onPointerDown, (ev) =>\n dragControls.start(ev),\n ),\n }),\n [drag, dragControls, register],\n )\n\n return { getItemProps, getTriggerProps }\n}\n\nexport type UseReorderItemReturn<Y = string> = ReturnType<\n typeof useReorderItem<Y>\n>\n"],"mappings":"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"}
1
+ {"version":3,"file":"use-reorder.cjs","names":["createContext","useValidChildren","values","mergeProps","x","y","mergeRefs"],"sources":["../../../../src/components/reorder/use-reorder.ts"],"sourcesContent":["\"use client\"\n\nimport type { HTMLMotionProps, Reorder } from \"motion/react\"\nimport type { PropsWithChildren, ReactElement, ReactNode } from \"react\"\nimport type { Orientation, PropGetter } from \"../../core\"\nimport type { Dict, Merge } from \"../../utils\"\nimport { useDragControls, useMotionValue } from \"motion/react\"\nimport {\n cloneElement,\n useCallback,\n useEffect,\n useMemo,\n useRef,\n useState,\n} from \"react\"\nimport { mergeProps } from \"../../core\"\nimport {\n createContext,\n dataAttr,\n handlerAll,\n isArray,\n isObject,\n mergeRefs,\n useUpdateEffect,\n useValidChildren,\n} from \"../../utils\"\n\nconst getAlternativeValue = ({ children, label }: Dict = {}) =>\n serializeValue(children ?? label)\n\nconst serializeValue = (value: any) =>\n isObject(value) || isArray(value) ? JSON.stringify(value) : value\n\ntype ReorderGroupProps<Y = string> = Merge<\n HTMLMotionProps<\"ul\">,\n Pick<Parameters<typeof Reorder.Group<Y>>[0], \"axis\" | \"onReorder\" | \"values\">\n>\ntype ReorderItemProps<Y = string> = Merge<\n HTMLMotionProps<\"li\">,\n Partial<Pick<Parameters<typeof Reorder.Item<Y>>[0], \"layout\" | \"value\">>\n>\n\ninterface ReorderContext extends Pick<UseReorderProps, \"orientation\"> {}\n\nconst [ReorderContext, useReorderContext] = createContext<ReorderContext>({\n name: \"ReorderContext\",\n})\n\nexport { ReorderContext, useReorderContext }\n\ninterface ReorderItemContext {\n getTriggerProps: PropGetter\n}\n\nconst [ReorderItemContext, useReorderItemContext] =\n createContext<ReorderItemContext>({\n name: \"ReorderItemContext\",\n })\n\nexport { ReorderItemContext, useReorderItemContext }\n\nexport interface UseReorderProps<Y = string>\n extends\n Partial<Omit<ReorderGroupProps<Y>, \"children\" | \"onChange\" | \"values\">>,\n PropsWithChildren {\n /**\n * The component to be used for the item.\n */\n item?: ReactElement<any>\n /**\n * If provided, generate reorder items based on items.\n *\n */\n items?: UseReorderItemProps<Y>[]\n /**\n * The orientation of the reorder.\n *\n * @default 'vertical'\n */\n orientation?: Orientation\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 const useReorder = <Y = string>({\n ref,\n children,\n item,\n items = [],\n orientation = \"vertical\",\n onChange,\n onCompleteChange,\n ...rest\n}: UseReorderProps<Y> = {}) => {\n const axis = orientation === \"vertical\" ? \"y\" : \"x\"\n const validChildren = useValidChildren(children)\n const hasChildren = !!validChildren.length\n const defaultValues = useMemo(() => {\n const values = hasChildren\n ? validChildren.map(\n ({ props }) => props.value ?? getAlternativeValue(props),\n )\n : items.map((props) => props.value ?? getAlternativeValue(props))\n\n const duplicatedValues = values.filter(\n (value, index, self) =>\n self.indexOf(value) === index && index !== self.lastIndexOf(value),\n )\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 Array.from(new Set(values))\n }, [hasChildren, validChildren, items])\n const childMap = useMemo(() => {\n return Object.fromEntries(\n validChildren.map((child) => [\n serializeValue(child.props.value) ??\n serializeValue(getAlternativeValue(child.props)),\n child,\n ]),\n )\n }, [validChildren])\n const itemMap = useMemo(() => {\n return Object.fromEntries(\n items.map((props) => [\n serializeValue(props.value) ??\n serializeValue(getAlternativeValue(props)),\n props,\n ]),\n )\n }, [items])\n const prevDefaultValues = useRef<Y[]>(defaultValues)\n const [values, setValues] = useState<Y[]>(defaultValues)\n const prevValues = useRef<Y[]>(defaultValues)\n const cloneChildren = useMemo(\n () =>\n values.map((value) => {\n if (hasChildren) {\n return childMap[serializeValue(value)]\n } else {\n const props = itemMap[serializeValue(value)]\n\n return props && item\n ? cloneElement(item, { key: serializeValue(props.value), ...props })\n : null\n }\n }),\n [values, hasChildren, childMap, itemMap, item],\n )\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 equal = JSON.stringify(prevValues.current) === JSON.stringify(values)\n\n if (equal) return\n\n prevValues.current = values\n\n onCompleteChange?.(values)\n }, [onCompleteChange, values])\n\n useUpdateEffect(() => {\n const equal =\n JSON.stringify(defaultValues) ===\n JSON.stringify(prevDefaultValues.current)\n\n if (equal) return\n\n prevValues.current = defaultValues\n prevDefaultValues.current = defaultValues\n\n setValues(defaultValues)\n }, [defaultValues])\n\n const getRootProps: PropGetter<\n Partial<Omit<ReorderGroupProps<Y>, \"values\">>,\n undefined,\n ReorderGroupProps<Y>\n > = useCallback(\n (props = {}) =>\n mergeProps(\n { axis, values },\n rest,\n props,\n { ref },\n {\n onMouseUp: onCompleteReorder,\n onReorder,\n onTouchEnd: onCompleteReorder,\n },\n )(),\n [rest, ref, onCompleteReorder, onReorder, axis, values],\n )\n\n return { children: cloneChildren, orientation, values, getRootProps }\n}\n\nexport type UseReorderReturn<Y = string> = ReturnType<typeof useReorder<Y>>\n\nexport interface UseReorderItemProps<Y = string> extends ReorderItemProps<Y> {\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 const useReorderItem = <Y = string>({\n ref,\n label,\n value,\n ...rest\n}: UseReorderItemProps<Y>) => {\n const { orientation } = useReorderContext()\n const dragControls = useDragControls()\n const [hasTrigger, setHasTrigger] = useState<boolean>(false)\n const [drag, setDrag] = useState<boolean>(false)\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\") setDrag(x !== 0)\n })\n const unsubscribeY = y.on(\"change\", (y) => {\n if (orientation === \"vertical\") setDrag(y !== 0)\n })\n\n return () => {\n unsubscribeX()\n unsubscribeY()\n }\n }, [orientation, x, y])\n\n const getItemProps: PropGetter<\n Omit<HTMLMotionProps<\"li\">, \"layout\" | \"value\"> &\n Pick<ReorderItemProps<Y>, \"layout\">,\n undefined,\n ReorderItemProps<Y>\n > = useCallback(\n (props = {}) => {\n const children = props.children ?? rest.children ?? label\n\n const merged = mergeProps(\n {\n \"data-has-trigger\": dataAttr(hasTrigger),\n \"data-selected\": dataAttr(drag),\n dragControls,\n dragListener: !hasTrigger,\n value: value ?? getAlternativeValue({ children }),\n },\n props,\n rest,\n { ref },\n )()\n\n return {\n ...merged,\n style: { x, y, ...props.style, ...rest.style },\n children,\n }\n },\n [ref, rest, dragControls, hasTrigger, value, x, y, drag, label],\n )\n\n const getTriggerProps: PropGetter = useCallback(\n (props = {}) => ({\n ...props,\n ref: mergeRefs(register, props.ref),\n \"data-selected\": dataAttr(drag),\n onPointerDown: handlerAll(props.onPointerDown, (ev) =>\n dragControls.start(ev),\n ),\n }),\n [drag, dragControls, register],\n )\n\n return { getItemProps, getTriggerProps }\n}\n\nexport type UseReorderItemReturn<Y = string> = ReturnType<\n typeof useReorderItem<Y>\n>\n"],"mappings":"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"}
@@ -2,8 +2,9 @@
2
2
 
3
3
  import { createContext as createContext$1 } from "../../utils/context.js";
4
4
  import { runKeyAction, visuallyHiddenAttributes } from "../../utils/dom.js";
5
- import { mergeRefs } from "../../utils/ref.js";
6
5
  import { utils_exports } from "../../utils/index.js";
6
+ import { mergeProps } from "../../core/components/props.js";
7
+ import "../../core/index.js";
7
8
  import { useControllableState } from "../../hooks/use-controllable-state/index.js";
8
9
  import { useFieldProps } from "../field/use-field-props.js";
9
10
  import "../field/index.js";
@@ -98,23 +99,21 @@ const useRating = (props = {}) => {
98
99
  ariaProps,
99
100
  dataProps,
100
101
  eventProps,
101
- getRootProps: useCallback(({ ref, ...props$1 } = {}) => ({
102
- ...dataProps,
103
- ...eventProps,
104
- ...ariaProps,
105
- id,
106
- "aria-label": `${value} Stars`,
107
- "aria-readonly": (0, utils_exports.ariaAttr)(readOnly),
108
- role: "radiogroup",
109
- ...rest,
110
- ...props$1,
111
- ref: mergeRefs(ref, rest.ref, rootRef),
112
- onMouseEnter: (0, utils_exports.handlerAll)(props$1.onMouseEnter, rest.onMouseEnter, onMouseEnter),
113
- onMouseLeave: (0, utils_exports.handlerAll)(props$1.onMouseLeave, rest.onMouseLeave, onMouseLeave),
114
- onMouseMove: (0, utils_exports.handlerAll)(props$1.onMouseMove, rest.onMouseMove, onMouseMove),
115
- onTouchEnd: (0, utils_exports.handlerAll)(props$1.onTouchEnd, rest.onTouchEnd, onTouchEnd),
116
- onTouchStart: (0, utils_exports.handlerAll)(props$1.onTouchStart, rest.onTouchStart, onTouchStart)
117
- }), [
102
+ getRootProps: useCallback(({ ref, ...props$1 } = {}) => {
103
+ return {
104
+ ...mergeProps(dataProps, eventProps, ariaProps, {
105
+ id,
106
+ "aria-label": `${value} Stars`,
107
+ "aria-readonly": (0, utils_exports.ariaAttr)(readOnly),
108
+ role: "radiogroup"
109
+ }, rest, props$1, { ref }, { ref: rootRef })(),
110
+ onMouseEnter: (0, utils_exports.handlerAll)(props$1.onMouseEnter, rest.onMouseEnter, onMouseEnter),
111
+ onMouseLeave: (0, utils_exports.handlerAll)(props$1.onMouseLeave, rest.onMouseLeave, onMouseLeave),
112
+ onMouseMove: (0, utils_exports.handlerAll)(props$1.onMouseMove, rest.onMouseMove, onMouseMove),
113
+ onTouchEnd: (0, utils_exports.handlerAll)(props$1.onTouchEnd, rest.onTouchEnd, onTouchEnd),
114
+ onTouchStart: (0, utils_exports.handlerAll)(props$1.onTouchStart, rest.onTouchStart, onTouchStart)
115
+ };
116
+ }, [
118
117
  ariaProps,
119
118
  dataProps,
120
119
  eventProps,
@@ -162,21 +161,14 @@ const useRatingItem = ({ groupValue, index, ...rest }) => {
162
161
  const onKeyDown = useCallback((ev) => {
163
162
  runKeyAction(ev, { Space: () => onChange(value) });
164
163
  }, [onChange, value]);
165
- const getLabelProps = useCallback(({ style, ...props } = {}) => ({
166
- ...dataProps,
167
- ...ariaProps,
164
+ const getLabelProps = useCallback(({ style, ...props } = {}) => mergeProps(dataProps, ariaProps, {
168
165
  htmlFor: id,
169
166
  "data-active": (0, utils_exports.dataAttr)(active),
170
- "data-filled": (0, utils_exports.dataAttr)(filled),
171
- ...rest,
172
- ...props,
173
- style: {
174
- ...style,
175
- zIndex: fractionValue !== 1 ? active ? 1 : -1 : void 0
176
- },
177
- onMouseDown: (0, utils_exports.handlerAll)(props.onMouseDown, onMouseDown),
178
- onTouchStart: (0, utils_exports.handlerAll)(props.onTouchStart, onTouchStart)
179
- }), [
167
+ "data-filled": (0, utils_exports.dataAttr)(filled)
168
+ }, rest, props, { style }, { style: { zIndex: fractionValue !== 1 ? active ? 1 : -1 : void 0 } }, {
169
+ onMouseDown,
170
+ onTouchStart
171
+ })(), [
180
172
  active,
181
173
  ariaProps,
182
174
  dataProps,
@@ -1 +1 @@
1
- {"version":3,"file":"use-rating.js","names":["createContext","roundedValue","props","value","getLabelProps: PropGetter<\"label\">"],"sources":["../../../../src/components/rating/use-rating.tsx"],"sourcesContent":["\"use client\"\n\nimport type { ChangeEvent, KeyboardEvent, MouseEvent, TouchEvent } from \"react\"\nimport type { HTMLProps, PropGetter } from \"../../core\"\nimport type { FieldProps } from \"../field\"\nimport { useCallback, useId, useMemo, useRef, useState } from \"react\"\nimport { useControllableState } from \"../../hooks/use-controllable-state\"\nimport {\n ariaAttr,\n clampNumber,\n createContext,\n dataAttr,\n handlerAll,\n mergeRefs,\n runKeyAction,\n visuallyHiddenAttributes,\n} from \"../../utils\"\nimport { useFieldProps } from \"../field\"\n\nconst getRoundedValue = (value: number, to: number) => {\n const rounded = Math.round(value / to) * to\n const precision = `${to}`.split(\".\")[1]?.length || 0\n\n return Number(rounded.toFixed(precision))\n}\n\nexport interface RatingContext extends Omit<UseRatingReturn, \"getRootProps\"> {}\n\nconst [RatingContext, useRatingContext] = createContext<RatingContext>({\n name: \"RatingContext\",\n})\n\nexport { RatingContext, useRatingContext }\n\nexport interface UseRatingProps\n extends FieldProps, Omit<HTMLProps, \"color\" | \"defaultValue\" | \"onChange\"> {\n /**\n * Number of controls that should be rendered.\n *\n * @default 5\n */\n count?: number\n /**\n * The initial value of the rating.\n *\n * @default 0\n */\n defaultValue?: number\n /**\n * Number of fractions each item can be divided into,\n *\n * @default 1\n */\n fractions?: number\n /**\n * If `true`, only the selected icons will be filled.\n *\n * @default false\n */\n highlightSelectedOnly?: boolean\n /**\n * The top-level id string that will be applied to the rating.\n * The index of the rating item will be appended to this top-level id.\n */\n id?: string\n /**\n * The name of the input element.\n */\n name?: string\n /**\n * The value of the rating.\n */\n value?: number\n /**\n * The callback invoked when value state changes.\n */\n onChange?: (value: number) => void\n /**\n * The callback invoked when hovering over the rating.\n */\n onHover?: (value: number) => void\n}\n\nexport const useRating = (props: UseRatingProps = {}) => {\n const uuid = useId()\n const {\n props: {\n id = uuid,\n name = uuid,\n count: countProp = 5,\n defaultValue = 0,\n disabled,\n fractions: fractionsProp = 1,\n highlightSelectedOnly = false,\n readOnly,\n required,\n value: valueProp,\n onChange: onChangeProp,\n onHover,\n ...rest\n },\n ariaProps,\n dataProps,\n eventProps,\n } = useFieldProps({ ...props, notSupportReadOnly: true })\n const rootRef = useRef<HTMLDivElement>(null)\n const [value, setValue] = useControllableState({\n defaultValue,\n value: valueProp,\n onChange: onChangeProp,\n })\n const [hoveredValue, setHoveredValue] = useState(-1)\n const outsideRef = useRef(true)\n const fractions = Math.floor(fractionsProp)\n const count = Math.floor(countProp)\n const decimal = 1 / fractions\n const roundedValue = useMemo(\n () => getRoundedValue(value, decimal),\n [decimal, value],\n )\n const interactive = !(readOnly || disabled)\n const displayValue = hoveredValue !== -1 ? hoveredValue : roundedValue\n\n const getHoveredValue = useCallback(\n (x: number) => {\n if (!rootRef.current) return -1\n\n const { left, width } = rootRef.current.getBoundingClientRect()\n const itemWidth = width / count\n\n const hoveredValue = (x - left) / itemWidth\n\n const value = clampNumber(\n getRoundedValue(hoveredValue + decimal / 2, decimal),\n decimal,\n count,\n )\n\n return value\n },\n [count, decimal],\n )\n\n const onMouseEnter = useCallback(() => {\n if (interactive) outsideRef.current = false\n }, [interactive])\n\n const onMouseLeave = useCallback(() => {\n if (!interactive) return\n\n setHoveredValue(-1)\n outsideRef.current = true\n\n if (hoveredValue !== -1) onHover?.(-1)\n }, [hoveredValue, onHover, interactive, setHoveredValue])\n\n const onMouseMove = useCallback(\n (ev: MouseEvent<HTMLDivElement>) => {\n if (disabled || readOnly) return\n\n const roundedValue = getHoveredValue(ev.clientX)\n\n setHoveredValue(roundedValue)\n\n if (roundedValue !== hoveredValue) onHover?.(roundedValue)\n },\n [disabled, getHoveredValue, hoveredValue, readOnly, onHover],\n )\n\n const onTouchStart = useCallback(\n (ev: TouchEvent<HTMLDivElement>) => {\n ev.preventDefault()\n\n const el = ev.touches[0]\n\n if (!el) return\n\n const value = getHoveredValue(el.clientX)\n\n setValue(value)\n },\n [getHoveredValue, setValue],\n )\n\n const onTouchEnd = useCallback((ev: TouchEvent<HTMLDivElement>) => {\n ev.preventDefault()\n }, [])\n\n const getRootProps: PropGetter = useCallback(\n ({ ref, ...props } = {}) => ({\n ...dataProps,\n ...eventProps,\n ...ariaProps,\n id,\n \"aria-label\": `${value} Stars`,\n \"aria-readonly\": ariaAttr(readOnly),\n role: \"radiogroup\",\n ...rest,\n ...props,\n ref: mergeRefs(ref, rest.ref, rootRef),\n onMouseEnter: handlerAll(\n props.onMouseEnter,\n rest.onMouseEnter,\n onMouseEnter,\n ),\n onMouseLeave: handlerAll(\n props.onMouseLeave,\n rest.onMouseLeave,\n onMouseLeave,\n ),\n onMouseMove: handlerAll(props.onMouseMove, rest.onMouseMove, onMouseMove),\n onTouchEnd: handlerAll(props.onTouchEnd, rest.onTouchEnd, onTouchEnd),\n onTouchStart: handlerAll(\n props.onTouchStart,\n rest.onTouchStart,\n onTouchStart,\n ),\n }),\n [\n ariaProps,\n dataProps,\n eventProps,\n id,\n onMouseEnter,\n onMouseLeave,\n onMouseMove,\n onTouchEnd,\n onTouchStart,\n readOnly,\n rest,\n value,\n ],\n )\n\n return {\n id,\n name,\n count,\n decimal,\n disabled,\n displayValue,\n fractions,\n highlightSelectedOnly,\n hoveredValue,\n interactive,\n outsideRef,\n readOnly,\n required,\n roundedValue,\n setHoveredValue,\n setValue,\n value,\n ariaProps,\n dataProps,\n eventProps,\n getRootProps,\n }\n}\n\nexport type UseRatingReturn = ReturnType<typeof useRating>\n\nexport interface UseRatingItemProps extends HTMLProps<\"label\"> {\n groupValue: number\n index: number\n}\n\nexport const useRatingItem = ({\n groupValue,\n index,\n ...rest\n}: UseRatingItemProps) => {\n const {\n id: rootId,\n name,\n decimal,\n disabled,\n displayValue,\n highlightSelectedOnly,\n interactive,\n outsideRef,\n readOnly,\n required,\n roundedValue,\n setHoveredValue,\n setValue,\n ariaProps,\n dataProps,\n eventProps,\n } = useRatingContext()\n const fractionValue = decimal * (groupValue === 1 ? index : index + 1)\n const value = useMemo(\n () => getRoundedValue(groupValue - 1 + fractionValue, decimal),\n [decimal, fractionValue, groupValue],\n )\n const active = value === displayValue\n const checked = value === roundedValue\n const filled = highlightSelectedOnly\n ? value === displayValue\n : value <= displayValue\n const id = `${rootId}-${groupValue}-${value}`\n\n const onBlur = useCallback(() => {\n if (outsideRef.current) setHoveredValue(-1)\n }, [outsideRef, setHoveredValue])\n\n const onInputChange = useCallback(\n (ev: ChangeEvent<HTMLInputElement>) => {\n if (!interactive) return\n\n const value = parseFloat(ev.target.value)\n\n setHoveredValue(value)\n },\n [interactive, setHoveredValue],\n )\n\n const onChange = useCallback(\n (value: number) => {\n if (!interactive) return\n\n setValue(value)\n },\n [interactive, setValue],\n )\n\n const onMouseDown = useCallback(() => {\n onChange(value)\n }, [onChange, value])\n\n const onTouchStart = useCallback(() => {\n onChange(value)\n }, [onChange, value])\n\n const onKeyDown = useCallback(\n (ev: KeyboardEvent<HTMLInputElement>) => {\n runKeyAction(ev, {\n Space: () => onChange(value),\n })\n },\n [onChange, value],\n )\n\n const getLabelProps: PropGetter<\"label\"> = useCallback(\n ({ style, ...props } = {}) => ({\n ...dataProps,\n ...ariaProps,\n htmlFor: id,\n \"data-active\": dataAttr(active),\n \"data-filled\": dataAttr(filled),\n ...rest,\n ...props,\n style: {\n ...style,\n zIndex: fractionValue !== 1 ? (active ? 1 : -1) : undefined,\n },\n onMouseDown: handlerAll(props.onMouseDown, onMouseDown),\n onTouchStart: handlerAll(props.onTouchStart, onTouchStart),\n }),\n [\n active,\n ariaProps,\n dataProps,\n filled,\n fractionValue,\n id,\n onMouseDown,\n onTouchStart,\n rest,\n ],\n )\n\n const getInputProps: PropGetter<\"input\"> = useCallback(\n (props = {}) => ({\n ...dataProps,\n ...eventProps,\n ...ariaProps,\n id,\n type: \"radio\",\n name,\n style: visuallyHiddenAttributes.style,\n \"aria-label\": value.toString(),\n \"data-active\": dataAttr(active),\n \"data-checked\": dataAttr(checked),\n checked,\n disabled,\n readOnly,\n required,\n value,\n ...props,\n onBlur: handlerAll(onBlur, props.onBlur),\n onChange: handlerAll(props.onChange, onInputChange),\n onKeyDown: handlerAll(props.onKeyDown, onKeyDown),\n }),\n [\n id,\n name,\n value,\n active,\n checked,\n dataProps,\n eventProps,\n ariaProps,\n disabled,\n readOnly,\n required,\n onBlur,\n onInputChange,\n onKeyDown,\n ],\n )\n\n return {\n active,\n checked,\n filled,\n fractionValue,\n groupValue,\n value,\n getInputProps,\n getLabelProps,\n }\n}\n\nexport type UseRatingItemReturn = ReturnType<typeof useRatingItem>\n"],"mappings":"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"}
1
+ {"version":3,"file":"use-rating.js","names":["createContext","roundedValue","props","value","getLabelProps: PropGetter<\"label\">"],"sources":["../../../../src/components/rating/use-rating.tsx"],"sourcesContent":["\"use client\"\n\nimport type { ChangeEvent, KeyboardEvent, MouseEvent, TouchEvent } from \"react\"\nimport type { HTMLProps, PropGetter } from \"../../core\"\nimport type { FieldProps } from \"../field\"\nimport { useCallback, useId, useMemo, useRef, useState } from \"react\"\nimport { mergeProps } from \"../../core\"\nimport { useControllableState } from \"../../hooks/use-controllable-state\"\nimport {\n ariaAttr,\n clampNumber,\n createContext,\n dataAttr,\n handlerAll,\n runKeyAction,\n visuallyHiddenAttributes,\n} from \"../../utils\"\nimport { useFieldProps } from \"../field\"\n\nconst getRoundedValue = (value: number, to: number) => {\n const rounded = Math.round(value / to) * to\n const precision = `${to}`.split(\".\")[1]?.length || 0\n\n return Number(rounded.toFixed(precision))\n}\n\nexport interface RatingContext extends Omit<UseRatingReturn, \"getRootProps\"> {}\n\nconst [RatingContext, useRatingContext] = createContext<RatingContext>({\n name: \"RatingContext\",\n})\n\nexport { RatingContext, useRatingContext }\n\nexport interface UseRatingProps\n extends FieldProps, Omit<HTMLProps, \"color\" | \"defaultValue\" | \"onChange\"> {\n /**\n * Number of controls that should be rendered.\n *\n * @default 5\n */\n count?: number\n /**\n * The initial value of the rating.\n *\n * @default 0\n */\n defaultValue?: number\n /**\n * Number of fractions each item can be divided into,\n *\n * @default 1\n */\n fractions?: number\n /**\n * If `true`, only the selected icons will be filled.\n *\n * @default false\n */\n highlightSelectedOnly?: boolean\n /**\n * The top-level id string that will be applied to the rating.\n * The index of the rating item will be appended to this top-level id.\n */\n id?: string\n /**\n * The name of the input element.\n */\n name?: string\n /**\n * The value of the rating.\n */\n value?: number\n /**\n * The callback invoked when value state changes.\n */\n onChange?: (value: number) => void\n /**\n * The callback invoked when hovering over the rating.\n */\n onHover?: (value: number) => void\n}\n\nexport const useRating = (props: UseRatingProps = {}) => {\n const uuid = useId()\n const {\n props: {\n id = uuid,\n name = uuid,\n count: countProp = 5,\n defaultValue = 0,\n disabled,\n fractions: fractionsProp = 1,\n highlightSelectedOnly = false,\n readOnly,\n required,\n value: valueProp,\n onChange: onChangeProp,\n onHover,\n ...rest\n },\n ariaProps,\n dataProps,\n eventProps,\n } = useFieldProps({ ...props, notSupportReadOnly: true })\n const rootRef = useRef<HTMLDivElement>(null)\n const [value, setValue] = useControllableState({\n defaultValue,\n value: valueProp,\n onChange: onChangeProp,\n })\n const [hoveredValue, setHoveredValue] = useState(-1)\n const outsideRef = useRef(true)\n const fractions = Math.floor(fractionsProp)\n const count = Math.floor(countProp)\n const decimal = 1 / fractions\n const roundedValue = useMemo(\n () => getRoundedValue(value, decimal),\n [decimal, value],\n )\n const interactive = !(readOnly || disabled)\n const displayValue = hoveredValue !== -1 ? hoveredValue : roundedValue\n\n const getHoveredValue = useCallback(\n (x: number) => {\n if (!rootRef.current) return -1\n\n const { left, width } = rootRef.current.getBoundingClientRect()\n const itemWidth = width / count\n\n const hoveredValue = (x - left) / itemWidth\n\n const value = clampNumber(\n getRoundedValue(hoveredValue + decimal / 2, decimal),\n decimal,\n count,\n )\n\n return value\n },\n [count, decimal],\n )\n\n const onMouseEnter = useCallback(() => {\n if (interactive) outsideRef.current = false\n }, [interactive])\n\n const onMouseLeave = useCallback(() => {\n if (!interactive) return\n\n setHoveredValue(-1)\n outsideRef.current = true\n\n if (hoveredValue !== -1) onHover?.(-1)\n }, [hoveredValue, onHover, interactive, setHoveredValue])\n\n const onMouseMove = useCallback(\n (ev: MouseEvent<HTMLDivElement>) => {\n if (disabled || readOnly) return\n\n const roundedValue = getHoveredValue(ev.clientX)\n\n setHoveredValue(roundedValue)\n\n if (roundedValue !== hoveredValue) onHover?.(roundedValue)\n },\n [disabled, getHoveredValue, hoveredValue, readOnly, onHover],\n )\n\n const onTouchStart = useCallback(\n (ev: TouchEvent<HTMLDivElement>) => {\n ev.preventDefault()\n\n const el = ev.touches[0]\n\n if (!el) return\n\n const value = getHoveredValue(el.clientX)\n\n setValue(value)\n },\n [getHoveredValue, setValue],\n )\n\n const onTouchEnd = useCallback((ev: TouchEvent<HTMLDivElement>) => {\n ev.preventDefault()\n }, [])\n\n const getRootProps: PropGetter = useCallback(\n ({ ref, ...props } = {}) => {\n const merged = mergeProps(\n dataProps,\n eventProps,\n ariaProps,\n {\n id,\n \"aria-label\": `${value} Stars`,\n \"aria-readonly\": ariaAttr(readOnly),\n role: \"radiogroup\",\n },\n rest,\n props,\n { ref },\n { ref: rootRef },\n )()\n return {\n ...merged,\n onMouseEnter: handlerAll(\n props.onMouseEnter,\n rest.onMouseEnter,\n onMouseEnter,\n ),\n onMouseLeave: handlerAll(\n props.onMouseLeave,\n rest.onMouseLeave,\n onMouseLeave,\n ),\n onMouseMove: handlerAll(\n props.onMouseMove,\n rest.onMouseMove,\n onMouseMove,\n ),\n onTouchEnd: handlerAll(props.onTouchEnd, rest.onTouchEnd, onTouchEnd),\n onTouchStart: handlerAll(\n props.onTouchStart,\n rest.onTouchStart,\n onTouchStart,\n ),\n }\n },\n [\n ariaProps,\n dataProps,\n eventProps,\n id,\n onMouseEnter,\n onMouseLeave,\n onMouseMove,\n onTouchEnd,\n onTouchStart,\n readOnly,\n rest,\n value,\n ],\n )\n\n return {\n id,\n name,\n count,\n decimal,\n disabled,\n displayValue,\n fractions,\n highlightSelectedOnly,\n hoveredValue,\n interactive,\n outsideRef,\n readOnly,\n required,\n roundedValue,\n setHoveredValue,\n setValue,\n value,\n ariaProps,\n dataProps,\n eventProps,\n getRootProps,\n }\n}\n\nexport type UseRatingReturn = ReturnType<typeof useRating>\n\nexport interface UseRatingItemProps extends HTMLProps<\"label\"> {\n groupValue: number\n index: number\n}\n\nexport const useRatingItem = ({\n groupValue,\n index,\n ...rest\n}: UseRatingItemProps) => {\n const {\n id: rootId,\n name,\n decimal,\n disabled,\n displayValue,\n highlightSelectedOnly,\n interactive,\n outsideRef,\n readOnly,\n required,\n roundedValue,\n setHoveredValue,\n setValue,\n ariaProps,\n dataProps,\n eventProps,\n } = useRatingContext()\n const fractionValue = decimal * (groupValue === 1 ? index : index + 1)\n const value = useMemo(\n () => getRoundedValue(groupValue - 1 + fractionValue, decimal),\n [decimal, fractionValue, groupValue],\n )\n const active = value === displayValue\n const checked = value === roundedValue\n const filled = highlightSelectedOnly\n ? value === displayValue\n : value <= displayValue\n const id = `${rootId}-${groupValue}-${value}`\n\n const onBlur = useCallback(() => {\n if (outsideRef.current) setHoveredValue(-1)\n }, [outsideRef, setHoveredValue])\n\n const onInputChange = useCallback(\n (ev: ChangeEvent<HTMLInputElement>) => {\n if (!interactive) return\n\n const value = parseFloat(ev.target.value)\n\n setHoveredValue(value)\n },\n [interactive, setHoveredValue],\n )\n\n const onChange = useCallback(\n (value: number) => {\n if (!interactive) return\n\n setValue(value)\n },\n [interactive, setValue],\n )\n\n const onMouseDown = useCallback(() => {\n onChange(value)\n }, [onChange, value])\n\n const onTouchStart = useCallback(() => {\n onChange(value)\n }, [onChange, value])\n\n const onKeyDown = useCallback(\n (ev: KeyboardEvent<HTMLInputElement>) => {\n runKeyAction(ev, {\n Space: () => onChange(value),\n })\n },\n [onChange, value],\n )\n\n const getLabelProps: PropGetter<\"label\"> = useCallback(\n ({ style, ...props } = {}) =>\n mergeProps(\n dataProps,\n ariaProps,\n {\n htmlFor: id,\n \"data-active\": dataAttr(active),\n \"data-filled\": dataAttr(filled),\n },\n rest,\n props,\n { style },\n {\n style: {\n zIndex: fractionValue !== 1 ? (active ? 1 : -1) : undefined,\n },\n },\n { onMouseDown, onTouchStart },\n )(),\n [\n active,\n ariaProps,\n dataProps,\n filled,\n fractionValue,\n id,\n onMouseDown,\n onTouchStart,\n rest,\n ],\n )\n\n const getInputProps: PropGetter<\"input\"> = useCallback(\n (props = {}) => ({\n ...dataProps,\n ...eventProps,\n ...ariaProps,\n id,\n type: \"radio\",\n name,\n style: visuallyHiddenAttributes.style,\n \"aria-label\": value.toString(),\n \"data-active\": dataAttr(active),\n \"data-checked\": dataAttr(checked),\n checked,\n disabled,\n readOnly,\n required,\n value,\n ...props,\n onBlur: handlerAll(onBlur, props.onBlur),\n onChange: handlerAll(props.onChange, onInputChange),\n onKeyDown: handlerAll(props.onKeyDown, onKeyDown),\n }),\n [\n id,\n name,\n value,\n active,\n checked,\n dataProps,\n eventProps,\n ariaProps,\n disabled,\n readOnly,\n required,\n onBlur,\n onInputChange,\n onKeyDown,\n ],\n )\n\n return {\n active,\n checked,\n filled,\n fractionValue,\n groupValue,\n value,\n getInputProps,\n getLabelProps,\n }\n}\n\nexport type UseRatingItemReturn = ReturnType<typeof useRatingItem>\n"],"mappings":"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"}
@@ -5,6 +5,8 @@ import { createContext as createContext$1 } from "../../utils/context.js";
5
5
  import { useUpdateEffect } from "../../utils/effect.js";
6
6
  import { mergeRefs } from "../../utils/ref.js";
7
7
  import { utils_exports } from "../../utils/index.js";
8
+ import { mergeProps } from "../../core/components/props.js";
9
+ import "../../core/index.js";
8
10
  import { cloneElement, useCallback, useEffect, useMemo, useRef, useState } from "react";
9
11
  import { useDragControls, useMotionValue } from "motion/react";
10
12
 
@@ -71,16 +73,14 @@ const useReorder = ({ ref, children, item, items = [], orientation = "vertical",
71
73
  children: cloneChildren,
72
74
  orientation,
73
75
  values,
74
- getRootProps: useCallback((props = {}) => ({
76
+ getRootProps: useCallback((props = {}) => mergeProps({
75
77
  axis,
76
- values,
77
- ...rest,
78
- ...props,
79
- ref: mergeRefs(props.ref, ref),
80
- onMouseUp: (0, utils_exports.handlerAll)(props.onMouseUp, rest.onMouseUp, onCompleteReorder),
81
- onReorder: (0, utils_exports.handlerAll)(props.onReorder, rest.onReorder, onReorder),
82
- onTouchEnd: (0, utils_exports.handlerAll)(props.onTouchEnd, rest.onTouchEnd, onCompleteReorder)
83
- }), [
78
+ values
79
+ }, rest, props, { ref }, {
80
+ onMouseUp: onCompleteReorder,
81
+ onReorder,
82
+ onTouchEnd: onCompleteReorder
83
+ })(), [
84
84
  rest,
85
85
  ref,
86
86
  onCompleteReorder,
@@ -118,14 +118,13 @@ const useReorderItem = ({ ref, label, value, ...rest }) => {
118
118
  getItemProps: useCallback((props = {}) => {
119
119
  const children = props.children ?? rest.children ?? label;
120
120
  return {
121
- "data-has-trigger": (0, utils_exports.dataAttr)(hasTrigger),
122
- "data-selected": (0, utils_exports.dataAttr)(drag),
123
- dragControls,
124
- dragListener: !hasTrigger,
125
- value: value ?? getAlternativeValue({ children }),
126
- ...props,
127
- ...rest,
128
- ref: mergeRefs(props.ref, ref),
121
+ ...mergeProps({
122
+ "data-has-trigger": (0, utils_exports.dataAttr)(hasTrigger),
123
+ "data-selected": (0, utils_exports.dataAttr)(drag),
124
+ dragControls,
125
+ dragListener: !hasTrigger,
126
+ value: value ?? getAlternativeValue({ children })
127
+ }, props, rest, { ref })(),
129
128
  style: {
130
129
  x,
131
130
  y,
@@ -1 +1 @@
1
- {"version":3,"file":"use-reorder.js","names":["createContext","values","x","y"],"sources":["../../../../src/components/reorder/use-reorder.ts"],"sourcesContent":["\"use client\"\n\nimport type { HTMLMotionProps, Reorder } from \"motion/react\"\nimport type { PropsWithChildren, ReactElement, ReactNode } from \"react\"\nimport type { Orientation, PropGetter } from \"../../core\"\nimport type { Dict, Merge } from \"../../utils\"\nimport { useDragControls, useMotionValue } from \"motion/react\"\nimport {\n cloneElement,\n useCallback,\n useEffect,\n useMemo,\n useRef,\n useState,\n} from \"react\"\nimport {\n createContext,\n dataAttr,\n handlerAll,\n isArray,\n isObject,\n mergeRefs,\n useUpdateEffect,\n useValidChildren,\n} from \"../../utils\"\n\nconst getAlternativeValue = ({ children, label }: Dict = {}) =>\n serializeValue(children ?? label)\n\nconst serializeValue = (value: any) =>\n isObject(value) || isArray(value) ? JSON.stringify(value) : value\n\ntype ReorderGroupProps<Y = string> = Merge<\n HTMLMotionProps<\"ul\">,\n Pick<Parameters<typeof Reorder.Group<Y>>[0], \"axis\" | \"onReorder\" | \"values\">\n>\ntype ReorderItemProps<Y = string> = Merge<\n HTMLMotionProps<\"li\">,\n Partial<Pick<Parameters<typeof Reorder.Item<Y>>[0], \"layout\" | \"value\">>\n>\n\ninterface ReorderContext extends Pick<UseReorderProps, \"orientation\"> {}\n\nconst [ReorderContext, useReorderContext] = createContext<ReorderContext>({\n name: \"ReorderContext\",\n})\n\nexport { ReorderContext, useReorderContext }\n\ninterface ReorderItemContext {\n getTriggerProps: PropGetter\n}\n\nconst [ReorderItemContext, useReorderItemContext] =\n createContext<ReorderItemContext>({\n name: \"ReorderItemContext\",\n })\n\nexport { ReorderItemContext, useReorderItemContext }\n\nexport interface UseReorderProps<Y = string>\n extends\n Partial<Omit<ReorderGroupProps<Y>, \"children\" | \"onChange\" | \"values\">>,\n PropsWithChildren {\n /**\n * The component to be used for the item.\n */\n item?: ReactElement<any>\n /**\n * If provided, generate reorder items based on items.\n *\n */\n items?: UseReorderItemProps<Y>[]\n /**\n * The orientation of the reorder.\n *\n * @default 'vertical'\n */\n orientation?: Orientation\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 const useReorder = <Y = string>({\n ref,\n children,\n item,\n items = [],\n orientation = \"vertical\",\n onChange,\n onCompleteChange,\n ...rest\n}: UseReorderProps<Y> = {}) => {\n const axis = orientation === \"vertical\" ? \"y\" : \"x\"\n const validChildren = useValidChildren(children)\n const hasChildren = !!validChildren.length\n const defaultValues = useMemo(() => {\n const values = hasChildren\n ? validChildren.map(\n ({ props }) => props.value ?? getAlternativeValue(props),\n )\n : items.map((props) => props.value ?? getAlternativeValue(props))\n\n const duplicatedValues = values.filter(\n (value, index, self) =>\n self.indexOf(value) === index && index !== self.lastIndexOf(value),\n )\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 Array.from(new Set(values))\n }, [hasChildren, validChildren, items])\n const childMap = useMemo(() => {\n return Object.fromEntries(\n validChildren.map((child) => [\n serializeValue(child.props.value) ??\n serializeValue(getAlternativeValue(child.props)),\n child,\n ]),\n )\n }, [validChildren])\n const itemMap = useMemo(() => {\n return Object.fromEntries(\n items.map((props) => [\n serializeValue(props.value) ??\n serializeValue(getAlternativeValue(props)),\n props,\n ]),\n )\n }, [items])\n const prevDefaultValues = useRef<Y[]>(defaultValues)\n const [values, setValues] = useState<Y[]>(defaultValues)\n const prevValues = useRef<Y[]>(defaultValues)\n const cloneChildren = useMemo(\n () =>\n values.map((value) => {\n if (hasChildren) {\n return childMap[serializeValue(value)]\n } else {\n const props = itemMap[serializeValue(value)]\n\n return props && item\n ? cloneElement(item, { key: serializeValue(props.value), ...props })\n : null\n }\n }),\n [values, hasChildren, childMap, itemMap, item],\n )\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 equal = JSON.stringify(prevValues.current) === JSON.stringify(values)\n\n if (equal) return\n\n prevValues.current = values\n\n onCompleteChange?.(values)\n }, [onCompleteChange, values])\n\n useUpdateEffect(() => {\n const equal =\n JSON.stringify(defaultValues) ===\n JSON.stringify(prevDefaultValues.current)\n\n if (equal) return\n\n prevValues.current = defaultValues\n prevDefaultValues.current = defaultValues\n\n setValues(defaultValues)\n }, [defaultValues])\n\n const getRootProps: PropGetter<\n Partial<Omit<ReorderGroupProps<Y>, \"values\">>,\n undefined,\n ReorderGroupProps<Y>\n > = useCallback(\n (props = {}) => ({\n axis,\n values,\n ...rest,\n ...props,\n ref: mergeRefs(props.ref, ref),\n onMouseUp: handlerAll(props.onMouseUp, rest.onMouseUp, onCompleteReorder),\n onReorder: handlerAll(props.onReorder, rest.onReorder, onReorder),\n onTouchEnd: handlerAll(\n props.onTouchEnd,\n rest.onTouchEnd,\n onCompleteReorder,\n ),\n }),\n [rest, ref, onCompleteReorder, onReorder, axis, values],\n )\n\n return { children: cloneChildren, orientation, values, getRootProps }\n}\n\nexport type UseReorderReturn<Y = string> = ReturnType<typeof useReorder<Y>>\n\nexport interface UseReorderItemProps<Y = string> extends ReorderItemProps<Y> {\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 const useReorderItem = <Y = string>({\n ref,\n label,\n value,\n ...rest\n}: UseReorderItemProps<Y>) => {\n const { orientation } = useReorderContext()\n const dragControls = useDragControls()\n const [hasTrigger, setHasTrigger] = useState<boolean>(false)\n const [drag, setDrag] = useState<boolean>(false)\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\") setDrag(x !== 0)\n })\n const unsubscribeY = y.on(\"change\", (y) => {\n if (orientation === \"vertical\") setDrag(y !== 0)\n })\n\n return () => {\n unsubscribeX()\n unsubscribeY()\n }\n }, [orientation, x, y])\n\n const getItemProps: PropGetter<\n Omit<HTMLMotionProps<\"li\">, \"layout\" | \"value\"> &\n Pick<ReorderItemProps<Y>, \"layout\">,\n undefined,\n ReorderItemProps<Y>\n > = useCallback(\n (props = {}) => {\n const children = props.children ?? rest.children ?? label\n\n return {\n \"data-has-trigger\": dataAttr(hasTrigger),\n \"data-selected\": dataAttr(drag),\n dragControls,\n dragListener: !hasTrigger,\n value: value ?? getAlternativeValue({ children }),\n ...props,\n ...rest,\n ref: mergeRefs(props.ref, ref),\n style: { x, y, ...props.style, ...rest.style },\n children,\n }\n },\n [ref, rest, dragControls, hasTrigger, value, x, y, drag, label],\n )\n\n const getTriggerProps: PropGetter = useCallback(\n (props = {}) => ({\n ...props,\n ref: mergeRefs(register, props.ref),\n \"data-selected\": dataAttr(drag),\n onPointerDown: handlerAll(props.onPointerDown, (ev) =>\n dragControls.start(ev),\n ),\n }),\n [drag, dragControls, register],\n )\n\n return { getItemProps, getTriggerProps }\n}\n\nexport type UseReorderItemReturn<Y = string> = ReturnType<\n typeof useReorderItem<Y>\n>\n"],"mappings":"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"}
1
+ {"version":3,"file":"use-reorder.js","names":["createContext","values","x","y"],"sources":["../../../../src/components/reorder/use-reorder.ts"],"sourcesContent":["\"use client\"\n\nimport type { HTMLMotionProps, Reorder } from \"motion/react\"\nimport type { PropsWithChildren, ReactElement, ReactNode } from \"react\"\nimport type { Orientation, PropGetter } from \"../../core\"\nimport type { Dict, Merge } from \"../../utils\"\nimport { useDragControls, useMotionValue } from \"motion/react\"\nimport {\n cloneElement,\n useCallback,\n useEffect,\n useMemo,\n useRef,\n useState,\n} from \"react\"\nimport { mergeProps } from \"../../core\"\nimport {\n createContext,\n dataAttr,\n handlerAll,\n isArray,\n isObject,\n mergeRefs,\n useUpdateEffect,\n useValidChildren,\n} from \"../../utils\"\n\nconst getAlternativeValue = ({ children, label }: Dict = {}) =>\n serializeValue(children ?? label)\n\nconst serializeValue = (value: any) =>\n isObject(value) || isArray(value) ? JSON.stringify(value) : value\n\ntype ReorderGroupProps<Y = string> = Merge<\n HTMLMotionProps<\"ul\">,\n Pick<Parameters<typeof Reorder.Group<Y>>[0], \"axis\" | \"onReorder\" | \"values\">\n>\ntype ReorderItemProps<Y = string> = Merge<\n HTMLMotionProps<\"li\">,\n Partial<Pick<Parameters<typeof Reorder.Item<Y>>[0], \"layout\" | \"value\">>\n>\n\ninterface ReorderContext extends Pick<UseReorderProps, \"orientation\"> {}\n\nconst [ReorderContext, useReorderContext] = createContext<ReorderContext>({\n name: \"ReorderContext\",\n})\n\nexport { ReorderContext, useReorderContext }\n\ninterface ReorderItemContext {\n getTriggerProps: PropGetter\n}\n\nconst [ReorderItemContext, useReorderItemContext] =\n createContext<ReorderItemContext>({\n name: \"ReorderItemContext\",\n })\n\nexport { ReorderItemContext, useReorderItemContext }\n\nexport interface UseReorderProps<Y = string>\n extends\n Partial<Omit<ReorderGroupProps<Y>, \"children\" | \"onChange\" | \"values\">>,\n PropsWithChildren {\n /**\n * The component to be used for the item.\n */\n item?: ReactElement<any>\n /**\n * If provided, generate reorder items based on items.\n *\n */\n items?: UseReorderItemProps<Y>[]\n /**\n * The orientation of the reorder.\n *\n * @default 'vertical'\n */\n orientation?: Orientation\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 const useReorder = <Y = string>({\n ref,\n children,\n item,\n items = [],\n orientation = \"vertical\",\n onChange,\n onCompleteChange,\n ...rest\n}: UseReorderProps<Y> = {}) => {\n const axis = orientation === \"vertical\" ? \"y\" : \"x\"\n const validChildren = useValidChildren(children)\n const hasChildren = !!validChildren.length\n const defaultValues = useMemo(() => {\n const values = hasChildren\n ? validChildren.map(\n ({ props }) => props.value ?? getAlternativeValue(props),\n )\n : items.map((props) => props.value ?? getAlternativeValue(props))\n\n const duplicatedValues = values.filter(\n (value, index, self) =>\n self.indexOf(value) === index && index !== self.lastIndexOf(value),\n )\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 Array.from(new Set(values))\n }, [hasChildren, validChildren, items])\n const childMap = useMemo(() => {\n return Object.fromEntries(\n validChildren.map((child) => [\n serializeValue(child.props.value) ??\n serializeValue(getAlternativeValue(child.props)),\n child,\n ]),\n )\n }, [validChildren])\n const itemMap = useMemo(() => {\n return Object.fromEntries(\n items.map((props) => [\n serializeValue(props.value) ??\n serializeValue(getAlternativeValue(props)),\n props,\n ]),\n )\n }, [items])\n const prevDefaultValues = useRef<Y[]>(defaultValues)\n const [values, setValues] = useState<Y[]>(defaultValues)\n const prevValues = useRef<Y[]>(defaultValues)\n const cloneChildren = useMemo(\n () =>\n values.map((value) => {\n if (hasChildren) {\n return childMap[serializeValue(value)]\n } else {\n const props = itemMap[serializeValue(value)]\n\n return props && item\n ? cloneElement(item, { key: serializeValue(props.value), ...props })\n : null\n }\n }),\n [values, hasChildren, childMap, itemMap, item],\n )\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 equal = JSON.stringify(prevValues.current) === JSON.stringify(values)\n\n if (equal) return\n\n prevValues.current = values\n\n onCompleteChange?.(values)\n }, [onCompleteChange, values])\n\n useUpdateEffect(() => {\n const equal =\n JSON.stringify(defaultValues) ===\n JSON.stringify(prevDefaultValues.current)\n\n if (equal) return\n\n prevValues.current = defaultValues\n prevDefaultValues.current = defaultValues\n\n setValues(defaultValues)\n }, [defaultValues])\n\n const getRootProps: PropGetter<\n Partial<Omit<ReorderGroupProps<Y>, \"values\">>,\n undefined,\n ReorderGroupProps<Y>\n > = useCallback(\n (props = {}) =>\n mergeProps(\n { axis, values },\n rest,\n props,\n { ref },\n {\n onMouseUp: onCompleteReorder,\n onReorder,\n onTouchEnd: onCompleteReorder,\n },\n )(),\n [rest, ref, onCompleteReorder, onReorder, axis, values],\n )\n\n return { children: cloneChildren, orientation, values, getRootProps }\n}\n\nexport type UseReorderReturn<Y = string> = ReturnType<typeof useReorder<Y>>\n\nexport interface UseReorderItemProps<Y = string> extends ReorderItemProps<Y> {\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 const useReorderItem = <Y = string>({\n ref,\n label,\n value,\n ...rest\n}: UseReorderItemProps<Y>) => {\n const { orientation } = useReorderContext()\n const dragControls = useDragControls()\n const [hasTrigger, setHasTrigger] = useState<boolean>(false)\n const [drag, setDrag] = useState<boolean>(false)\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\") setDrag(x !== 0)\n })\n const unsubscribeY = y.on(\"change\", (y) => {\n if (orientation === \"vertical\") setDrag(y !== 0)\n })\n\n return () => {\n unsubscribeX()\n unsubscribeY()\n }\n }, [orientation, x, y])\n\n const getItemProps: PropGetter<\n Omit<HTMLMotionProps<\"li\">, \"layout\" | \"value\"> &\n Pick<ReorderItemProps<Y>, \"layout\">,\n undefined,\n ReorderItemProps<Y>\n > = useCallback(\n (props = {}) => {\n const children = props.children ?? rest.children ?? label\n\n const merged = mergeProps(\n {\n \"data-has-trigger\": dataAttr(hasTrigger),\n \"data-selected\": dataAttr(drag),\n dragControls,\n dragListener: !hasTrigger,\n value: value ?? getAlternativeValue({ children }),\n },\n props,\n rest,\n { ref },\n )()\n\n return {\n ...merged,\n style: { x, y, ...props.style, ...rest.style },\n children,\n }\n },\n [ref, rest, dragControls, hasTrigger, value, x, y, drag, label],\n )\n\n const getTriggerProps: PropGetter = useCallback(\n (props = {}) => ({\n ...props,\n ref: mergeRefs(register, props.ref),\n \"data-selected\": dataAttr(drag),\n onPointerDown: handlerAll(props.onPointerDown, (ev) =>\n dragControls.start(ev),\n ),\n }),\n [drag, dragControls, register],\n )\n\n return { getItemProps, getTriggerProps }\n}\n\nexport type UseReorderItemReturn<Y = string> = ReturnType<\n typeof useReorderItem<Y>\n>\n"],"mappings":"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"}
@@ -7,7 +7,7 @@ import { CollapseProps } from "../collapse/collapse.js";
7
7
  import "../../index.js";
8
8
  import { AccordionStyle } from "./accordion.style.js";
9
9
  import { UseAccordionItemProps, UseAccordionProps } from "./use-accordion.js";
10
- import * as react1212 from "react";
10
+ import * as react1239 from "react";
11
11
 
12
12
  //#region src/components/accordion/accordion.d.ts
13
13
  interface AccordionCallBackProps {
@@ -31,7 +31,7 @@ interface AccordionRootProps extends Omit<HTMLStyledProps, "onChange">, ThemePro
31
31
  */
32
32
  items?: AccordionItem[];
33
33
  }
34
- declare const AccordionPropsContext: react1212.Context<Partial<AccordionRootProps> | undefined>, useAccordionPropsContext: () => Partial<AccordionRootProps> | undefined;
34
+ declare const AccordionPropsContext: react1239.Context<Partial<AccordionRootProps> | undefined>, useAccordionPropsContext: () => Partial<AccordionRootProps> | undefined;
35
35
  /**
36
36
  * `Accordion` is a component for a list that displays information in an expandable or collapsible manner.
37
37
  *
@@ -3,7 +3,7 @@ import { CSSModifierObject, CSSPropObject, CSSSlotObject } from "../../core/css/
3
3
  import "../../index.js";
4
4
 
5
5
  //#region src/components/accordion/accordion.style.d.ts
6
- declare const accordionStyle: ComponentSlotStyle<"button" | "panel" | "icon" | "item" | "root", CSSPropObject<CSSSlotObject<"button" | "panel" | "icon" | "item" | "root">>, CSSModifierObject<CSSSlotObject<"button" | "panel" | "icon" | "item" | "root">>, {
6
+ declare const accordionStyle: ComponentSlotStyle<"button" | "panel" | "icon" | "root" | "item", CSSPropObject<CSSSlotObject<"button" | "panel" | "icon" | "root" | "item">>, CSSModifierObject<CSSSlotObject<"button" | "panel" | "icon" | "root" | "item">>, {
7
7
  panel: {
8
8
  button: {
9
9
  rounded: "l2";