@yamada-ui/react 2.2.1-dev-20260428085147 → 2.2.1-dev-20260428092839
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.
- package/dist/cjs/components/radio/use-radio-group.cjs +5 -8
- package/dist/cjs/components/radio/use-radio-group.cjs.map +1 -1
- package/dist/cjs/components/radio/use-radio.cjs +3 -6
- package/dist/cjs/components/radio/use-radio.cjs.map +1 -1
- package/dist/cjs/components/rating/use-rating.cjs +23 -31
- package/dist/cjs/components/rating/use-rating.cjs.map +1 -1
- package/dist/esm/components/radio/use-radio-group.js +5 -8
- package/dist/esm/components/radio/use-radio-group.js.map +1 -1
- package/dist/esm/components/radio/use-radio.js +3 -6
- package/dist/esm/components/radio/use-radio.js.map +1 -1
- package/dist/esm/components/rating/use-rating.js +23 -31
- package/dist/esm/components/rating/use-rating.js.map +1 -1
- package/dist/types/components/accordion/accordion.d.ts +2 -4
- package/dist/types/components/accordion/use-accordion.d.ts +11 -11
- package/dist/types/components/action-bar/action-bar.d.ts +2 -3
- package/dist/types/components/airy/airy.d.ts +2 -3
- package/dist/types/components/alert/alert.d.ts +2 -5
- package/dist/types/components/alpha-slider/alpha-slider.d.ts +2 -3
- package/dist/types/components/aspect-ratio/aspect-ratio.d.ts +2 -2
- package/dist/types/components/autocomplete/autocomplete.d.ts +2 -4
- package/dist/types/components/autocomplete/autocomplete.style.d.ts +1 -1
- package/dist/types/components/autocomplete/use-autocomplete.d.ts +5 -7
- package/dist/types/components/avatar/avatar.d.ts +5 -5
- package/dist/types/components/avatar/use-avatar-group.d.ts +2 -2
- package/dist/types/components/badge/badge.d.ts +2 -2
- package/dist/types/components/bleed/bleed.d.ts +2 -2
- package/dist/types/components/blockquote/blockquote.d.ts +2 -2
- package/dist/types/components/breadcrumb/breadcrumb.d.ts +2 -2
- package/dist/types/components/breadcrumb/use-breadcrumb.d.ts +2 -2
- package/dist/types/components/button/button-group.d.ts +0 -1
- package/dist/types/components/button/button.d.ts +2 -3
- package/dist/types/components/button/icon-button.d.ts +2 -2
- package/dist/types/components/calendar/calendar.d.ts +2 -3
- package/dist/types/components/calendar/calendar.style.d.ts +2 -2
- package/dist/types/components/calendar/use-calendar.d.ts +8 -9
- package/dist/types/components/card/card.d.ts +2 -2
- package/dist/types/components/carousel/carousel.d.ts +2 -3
- package/dist/types/components/carousel/carousel.style.d.ts +2 -2
- package/dist/types/components/carousel/use-carousel.d.ts +3 -3
- package/dist/types/components/center/center.d.ts +2 -2
- package/dist/types/components/chart/chart.d.ts +5 -5
- package/dist/types/components/chart/line-chart.d.ts +2 -2
- package/dist/types/components/chart/pie-chart.d.ts +2 -2
- package/dist/types/components/chart/use-chart.d.ts +2 -2
- package/dist/types/components/checkbox/checkbox-group.d.ts +0 -2
- package/dist/types/components/checkbox/checkbox.d.ts +5 -6
- package/dist/types/components/checkbox/checkbox.style.d.ts +1 -1
- package/dist/types/components/checkbox/use-checkbox-group.d.ts +2 -3
- package/dist/types/components/checkbox/use-checkbox.d.ts +0 -1
- package/dist/types/components/checkbox-card/checkbox-card-group.d.ts +0 -3
- package/dist/types/components/checkbox-card/checkbox-card.d.ts +5 -7
- package/dist/types/components/checkbox-card/checkbox-card.style.d.ts +1 -1
- package/dist/types/components/circle-progress/circle-progress.d.ts +2 -3
- package/dist/types/components/close-button/close-button.d.ts +2 -3
- package/dist/types/components/code/code.d.ts +2 -2
- package/dist/types/components/collapse/collapse.d.ts +2 -3
- package/dist/types/components/color-picker/color-picker.d.ts +2 -6
- package/dist/types/components/color-picker/color-picker.style.d.ts +1 -1
- package/dist/types/components/color-picker/use-color-picker.d.ts +2 -5
- package/dist/types/components/color-selector/color-selector.d.ts +2 -6
- package/dist/types/components/color-selector/color-selector.style.d.ts +2 -2
- package/dist/types/components/color-selector/use-color-selector.d.ts +3 -5
- package/dist/types/components/color-swatch/color-swatch.d.ts +2 -2
- package/dist/types/components/container/container.d.ts +2 -2
- package/dist/types/components/data-list/data-list.d.ts +2 -2
- package/dist/types/components/date-picker/date-picker.d.ts +2 -5
- package/dist/types/components/date-picker/use-date-picker.d.ts +4 -7
- package/dist/types/components/drawer/drawer.d.ts +2 -5
- package/dist/types/components/drawer/drawer.style.d.ts +2 -2
- package/dist/types/components/drawer/use-drawer.d.ts +0 -2
- package/dist/types/components/dropzone/dropzone.d.ts +2 -5
- package/dist/types/components/dropzone/use-dropzone.d.ts +0 -1
- package/dist/types/components/editable/editable.d.ts +4 -5
- package/dist/types/components/editable/use-editable.d.ts +2 -3
- package/dist/types/components/em/em.d.ts +2 -2
- package/dist/types/components/empty-state/empty-state.d.ts +2 -2
- package/dist/types/components/empty-state/empty-state.style.d.ts +2 -2
- package/dist/types/components/fade/fade.d.ts +2 -3
- package/dist/types/components/fade-scale/fade-scale.d.ts +0 -1
- package/dist/types/components/field/field.d.ts +3 -3
- package/dist/types/components/field/use-field-props.d.ts +4 -4
- package/dist/types/components/fieldset/fieldset.d.ts +3 -4
- package/dist/types/components/file-button/file-button.d.ts +2 -4
- package/dist/types/components/file-button/use-file-button.d.ts +18 -20
- package/dist/types/components/file-input/file-input.d.ts +2 -4
- package/dist/types/components/file-input/use-file-input.d.ts +15 -16
- package/dist/types/components/flex/flex.d.ts +2 -2
- package/dist/types/components/flip/flip.d.ts +4 -5
- package/dist/types/components/float/float.d.ts +2 -2
- package/dist/types/components/form/form.d.ts +3 -4
- package/dist/types/components/format/format-byte.d.ts +4 -4
- package/dist/types/components/format/format-date-time.d.ts +4 -4
- package/dist/types/components/format/format-number.d.ts +2 -2
- package/dist/types/components/format/use-format-byte.d.ts +0 -1
- package/dist/types/components/format/use-format-date-time.d.ts +0 -1
- package/dist/types/components/format/use-format-number.d.ts +0 -1
- package/dist/types/components/grid/grid-item.d.ts +2 -2
- package/dist/types/components/grid/grid.d.ts +2 -2
- package/dist/types/components/group/group.d.ts +2 -3
- package/dist/types/components/group/use-group.d.ts +2 -2
- package/dist/types/components/heading/heading.d.ts +2 -2
- package/dist/types/components/highlight/highlight.d.ts +0 -2
- package/dist/types/components/hue-slider/hue-slider.d.ts +3 -4
- package/dist/types/components/icon/icon.d.ts +5 -5
- package/dist/types/components/image/image.d.ts +2 -2
- package/dist/types/components/indicator/indicator.d.ts +4 -5
- package/dist/types/components/infinite-scroll-area/infinite-scroll-area.d.ts +2 -2
- package/dist/types/components/input/input-addon.d.ts +2 -2
- package/dist/types/components/input/input-element.d.ts +2 -2
- package/dist/types/components/input/input-group.d.ts +0 -2
- package/dist/types/components/input/input.d.ts +2 -3
- package/dist/types/components/kbd/kbd.d.ts +2 -2
- package/dist/types/components/link/link.d.ts +2 -2
- package/dist/types/components/link-box/link-box.d.ts +2 -2
- package/dist/types/components/list/list.d.ts +2 -2
- package/dist/types/components/loading/loading-provider.d.ts +2 -2
- package/dist/types/components/loading/loading.d.ts +3 -4
- package/dist/types/components/loading/use-loading-component.d.ts +0 -1
- package/dist/types/components/mark/mark.d.ts +2 -2
- package/dist/types/components/menu/menu.d.ts +2 -3
- package/dist/types/components/menu/menu.style.d.ts +2 -2
- package/dist/types/components/menu/use-menu.d.ts +11 -11
- package/dist/types/components/modal/modal.d.ts +2 -6
- package/dist/types/components/modal/modal.style.d.ts +2 -2
- package/dist/types/components/native-accordion/native-accordion.d.ts +2 -2
- package/dist/types/components/native-accordion/use-native-accordion.d.ts +2 -2
- package/dist/types/components/native-popover/native-popover.d.ts +2 -2
- package/dist/types/components/native-select/native-select.d.ts +2 -4
- package/dist/types/components/native-select/use-native-select.d.ts +0 -1
- package/dist/types/components/native-table/native-table.d.ts +4 -4
- package/dist/types/components/notice/notice.style.d.ts +1 -1
- package/dist/types/components/notice/use-notice.d.ts +0 -3
- package/dist/types/components/number-input/number-input.d.ts +2 -3
- package/dist/types/components/number-input/use-number-input.d.ts +0 -1
- package/dist/types/components/pagination/pagination.d.ts +2 -3
- package/dist/types/components/pagination/use-pagination.d.ts +2 -2
- package/dist/types/components/password-input/password-input.d.ts +2 -3
- package/dist/types/components/password-input/strength-meter.d.ts +2 -2
- package/dist/types/components/password-input/strength-meter.style.d.ts +1 -1
- package/dist/types/components/password-input/use-password-input.d.ts +2 -3
- package/dist/types/components/picture/picture.d.ts +0 -1
- package/dist/types/components/pin-input/pin-input.d.ts +2 -4
- package/dist/types/components/pin-input/use-pin-input.d.ts +7 -8
- package/dist/types/components/popover/popover.d.ts +2 -3
- package/dist/types/components/progress/progress.d.ts +4 -4
- package/dist/types/components/progress/use-progress.d.ts +706 -706
- package/dist/types/components/qr-code/qr-code.d.ts +2 -2
- package/dist/types/components/radio/radio-group.d.ts +0 -2
- package/dist/types/components/radio/radio.d.ts +5 -6
- package/dist/types/components/radio/radio.style.d.ts +1 -1
- package/dist/types/components/radio/use-radio-group.d.ts +2 -3
- package/dist/types/components/radio/use-radio.d.ts +0 -1
- package/dist/types/components/radio-card/radio-card-group.d.ts +0 -3
- package/dist/types/components/radio-card/radio-card.d.ts +5 -7
- package/dist/types/components/radio-card/radio-card.style.d.ts +1 -1
- package/dist/types/components/rating/use-rating.d.ts +7 -8
- package/dist/types/components/reorder/reorder.d.ts +2 -3
- package/dist/types/components/reorder/reorder.style.d.ts +1 -1
- package/dist/types/components/reorder/use-reorder.d.ts +3 -3
- package/dist/types/components/resizable/resizable.d.ts +2 -2
- package/dist/types/components/resizable/resizable.style.d.ts +2 -2
- package/dist/types/components/resizable/use-resizable.d.ts +2 -2
- package/dist/types/components/ripple/ripple.d.ts +2 -3
- package/dist/types/components/ripple/use-ripple.d.ts +2 -2
- package/dist/types/components/rotate/rotate.d.ts +2 -3
- package/dist/types/components/saturation-slider/saturation-slider.d.ts +2 -2
- package/dist/types/components/saturation-slider/use-saturation-slider.d.ts +2 -3
- package/dist/types/components/scroll-area/scroll-area.d.ts +2 -2
- package/dist/types/components/segmented-control/segmented-control.d.ts +2 -3
- package/dist/types/components/segmented-control/segmented-control.style.d.ts +2 -2
- package/dist/types/components/segmented-control/use-segmented-control.d.ts +9 -10
- package/dist/types/components/select/select.d.ts +2 -4
- package/dist/types/components/select/select.style.d.ts +1 -1
- package/dist/types/components/select/use-select.d.ts +4 -6
- package/dist/types/components/separator/separator.d.ts +2 -2
- package/dist/types/components/sidebar/sidebar.d.ts +2 -7
- package/dist/types/components/sidebar/use-sidebar.d.ts +9 -9
- package/dist/types/components/simple-grid/simple-grid.d.ts +2 -3
- package/dist/types/components/skeleton/skeleton.d.ts +2 -2
- package/dist/types/components/slide/slide.d.ts +2 -3
- package/dist/types/components/slide-fade/slide-fade.d.ts +2 -3
- package/dist/types/components/slider/slider.d.ts +2 -2
- package/dist/types/components/slider/use-slider.d.ts +2 -3
- package/dist/types/components/snacks/snacks.d.ts +0 -2
- package/dist/types/components/snacks/use-snacks.d.ts +0 -1
- package/dist/types/components/stack/h-stack.d.ts +2 -2
- package/dist/types/components/stack/stack.d.ts +2 -2
- package/dist/types/components/stack/v-stack.d.ts +2 -2
- package/dist/types/components/stack/z-stack.d.ts +2 -2
- package/dist/types/components/stat/stat.d.ts +2 -2
- package/dist/types/components/status/status.d.ts +2 -2
- package/dist/types/components/status/status.style.d.ts +2 -2
- package/dist/types/components/steps/steps.d.ts +2 -2
- package/dist/types/components/steps/steps.style.d.ts +1 -1
- package/dist/types/components/steps/use-steps.d.ts +10 -10
- package/dist/types/components/switch/switch.d.ts +2 -2
- package/dist/types/components/switch/use-switch.d.ts +0 -1
- package/dist/types/components/table/table.d.ts +2 -4
- package/dist/types/components/tabs/tabs.d.ts +2 -2
- package/dist/types/components/tabs/use-tabs.d.ts +16 -16
- package/dist/types/components/tag/tag.d.ts +2 -2
- package/dist/types/components/tag/tag.style.d.ts +1 -1
- package/dist/types/components/text/text.d.ts +2 -2
- package/dist/types/components/textarea/textarea.d.ts +2 -4
- package/dist/types/components/textarea/use-autosize.d.ts +2 -2
- package/dist/types/components/timeline/timeline.d.ts +5 -5
- package/dist/types/components/timeline/timeline.style.d.ts +1 -1
- package/dist/types/components/tip/tip.d.ts +0 -3
- package/dist/types/components/toggle/toggle-group.d.ts +1 -1
- package/dist/types/components/toggle/toggle.d.ts +5 -7
- package/dist/types/components/toggle/use-toggle-group.d.ts +2 -2
- package/dist/types/components/toggle/use-toggle.d.ts +2 -3
- package/dist/types/components/tooltip/tooltip.d.ts +2 -4
- package/dist/types/components/tree/tree.d.ts +2 -6
- package/dist/types/components/tree/tree.style.d.ts +1 -1
- package/dist/types/components/tree/use-tree.d.ts +182 -183
- package/dist/types/components/visually-hidden/visually-hidden.d.ts +2 -2
- package/dist/types/components/wrap/wrap.d.ts +2 -3
- package/dist/types/core/components/create-component.d.ts +9 -7
- package/dist/types/core/components/index.types.d.ts +1 -0
- package/dist/types/core/components/use-component-style.d.ts +2 -0
- package/dist/types/core/components/utils.d.ts +1 -0
- package/dist/types/core/constant.d.ts +1 -0
- package/dist/types/core/css/calc.d.ts +1 -0
- package/dist/types/core/css/config.d.ts +1 -0
- package/dist/types/core/css/css.d.ts +1 -0
- package/dist/types/core/css/index.types.d.ts +1 -0
- package/dist/types/core/css/styles.d.ts +1 -0
- package/dist/types/core/css/token.d.ts +1 -0
- package/dist/types/core/css/use-css.d.ts +1 -0
- package/dist/types/core/css/utils.d.ts +2 -0
- package/dist/types/core/generated-theme-tokens.types.d.ts +1 -0
- package/dist/types/core/index.d.ts +2 -0
- package/dist/types/core/system/color-mode-provider.d.ts +2 -2
- package/dist/types/core/system/config.d.ts +1 -0
- package/dist/types/core/system/create-system.d.ts +1 -0
- package/dist/types/core/system/factory.d.ts +1 -0
- package/dist/types/core/system/index.types.d.ts +1 -0
- package/dist/types/core/system/storage-script.d.ts +3 -3
- package/dist/types/core/system/styled.d.ts +3 -2
- package/dist/types/core/system/system-provider.d.ts +2 -2
- package/dist/types/core/system/var.d.ts +2 -0
- package/dist/types/hooks/use-async-callback/index.d.ts +0 -1
- package/dist/types/hooks/use-breakpoint/use-breakpoint-state.d.ts +2 -2
- package/dist/types/hooks/use-clickable/index.d.ts +7 -7
- package/dist/types/hooks/use-clipboard/index.d.ts +2 -2
- package/dist/types/hooks/use-combobox/index.d.ts +12 -13
- package/dist/types/hooks/use-counter/index.d.ts +2 -2
- package/dist/types/hooks/use-descendants/index.d.ts +2 -2
- package/dist/types/hooks/use-field-sizing/index.d.ts +2 -2
- package/dist/types/hooks/use-hover/index.d.ts +2 -2
- package/dist/types/hooks/use-popper/index.d.ts +2 -2
- package/dist/types/hooks/use-resize-observer/index.d.ts +3 -3
- package/dist/types/index.d.ts +0 -106
- package/dist/types/providers/i18n-provider/i18n-provider.d.ts +3 -3
- package/dist/types/providers/ui-provider/ui-provider.d.ts +2 -3
- package/dist/types/utils/children.d.ts +2 -2
- 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');
|
|
@@ -29,16 +30,12 @@ const useRadioGroup = (props = {}) => {
|
|
|
29
30
|
if ((0, require_utils_index.utils_exports.isObject)(valueOrEv)) setValue(valueOrEv.target.value);
|
|
30
31
|
else setValue(valueOrEv);
|
|
31
32
|
}, [interactive, setValue]);
|
|
32
|
-
const getRootProps = (0, react.useCallback)(({ ref, "aria-describedby": ariaDescribedby, "aria-labelledby": ariaLabelledby, ...props$1 } = {}) => ({
|
|
33
|
-
...dataProps,
|
|
33
|
+
const getRootProps = (0, react.useCallback)(({ ref, "aria-describedby": ariaDescribedby, "aria-labelledby": ariaLabelledby, ...props$1 } = {}) => require_props.mergeProps(dataProps, {
|
|
34
34
|
id,
|
|
35
35
|
"aria-describedby": (0, require_utils_index.utils_exports.cx)(ariaDescribedbyProp, ariaDescribedby),
|
|
36
36
|
"aria-labelledby": (0, require_utils_index.utils_exports.cx)(labelId, ariaLabelledby),
|
|
37
|
-
role: "radiogroup"
|
|
38
|
-
|
|
39
|
-
...props$1,
|
|
40
|
-
ref: require_ref.mergeRefs(ref, rest.ref)
|
|
41
|
-
}), [
|
|
37
|
+
role: "radiogroup"
|
|
38
|
+
}, { ref }, rest, props$1)(), [
|
|
42
39
|
ariaDescribedbyProp,
|
|
43
40
|
dataProps,
|
|
44
41
|
id,
|
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"file":"use-radio-group.cjs","names":["createContext","useFieldProps","useControllableState","getRootProps: PropGetter","props","
|
|
1
|
+
{"version":3,"file":"use-radio-group.cjs","names":["createContext","useFieldProps","useControllableState","getRootProps: PropGetter","props","mergeProps","visuallyHiddenAttributes"],"sources":["../../../../src/components/radio/use-radio-group.ts"],"sourcesContent":["\"use client\"\n\nimport type { ChangeEvent } from \"react\"\nimport type { HTMLProps, PropGetter } from \"../../core\"\nimport type { FieldProps } from \"../field\"\nimport { useCallback, useId } from \"react\"\nimport { mergeProps } from \"../../core\"\nimport { useControllableState } from \"../../hooks/use-controllable-state\"\nimport {\n createContext,\n cx,\n dataAttr,\n handlerAll,\n isObject,\n isUndefined,\n visuallyHiddenAttributes,\n} from \"../../utils\"\nimport { useFieldProps } from \"../field\"\n\ninterface RadioGroupContext extends Omit<UseRadioGroupReturn, \"getRootProps\"> {}\n\nconst [RadioGroupContext, useRadioGroupContext] =\n createContext<RadioGroupContext>({\n name: \"RadioGroupContext\",\n strict: false,\n })\n\nexport { RadioGroupContext, useRadioGroupContext }\n\nexport interface UseRadioGroupProps<Y extends string = string>\n extends Omit<HTMLProps, \"defaultValue\" | \"onChange\" | \"value\">, FieldProps {\n /**\n * The initial value of the radio group.\n */\n defaultValue?: Y\n /**\n * The value of the radio group.\n */\n value?: Y\n /**\n * The callback fired when any children radio is checked or unchecked.\n */\n onChange?: (value: Y) => void\n}\n\nexport const useRadioGroup = <Y extends string = string>(\n props: UseRadioGroupProps<Y> = {},\n) => {\n const uuid = useId()\n const {\n context: { labelId } = {},\n props: {\n id = uuid,\n defaultValue,\n disabled,\n readOnly,\n required,\n value: valueProp,\n onChange: onChangeProp,\n ...rest\n },\n ariaProps: { \"aria-describedby\": ariaDescribedbyProp, ...ariaProps },\n dataProps,\n eventProps,\n } = useFieldProps(props)\n const interactive = !(readOnly || disabled)\n const [value, setValue] = useControllableState({\n defaultValue,\n value: valueProp,\n onChange: onChangeProp,\n })\n\n const onChange = useCallback(\n (valueOrEv: ChangeEvent<HTMLInputElement> | Y) => {\n if (!interactive) return\n\n if (isObject(valueOrEv)) {\n setValue(valueOrEv.target.value as Y)\n } else {\n setValue(valueOrEv)\n }\n },\n [interactive, setValue],\n )\n\n const getRootProps: PropGetter = useCallback(\n ({\n ref,\n \"aria-describedby\": ariaDescribedby,\n \"aria-labelledby\": ariaLabelledby,\n ...props\n } = {}) =>\n mergeProps(\n dataProps,\n {\n id,\n \"aria-describedby\": cx(ariaDescribedbyProp, ariaDescribedby),\n \"aria-labelledby\": cx(labelId, ariaLabelledby),\n role: \"radiogroup\",\n },\n { ref },\n rest,\n props,\n )(),\n [ariaDescribedbyProp, dataProps, id, labelId, rest],\n )\n\n const getInputProps: PropGetter<\"input\"> = useCallback(\n (props = {}) => {\n const checked = !isUndefined(value) && value === props.value\n\n return {\n ...dataProps,\n ...ariaProps,\n type: \"radio\",\n name: id,\n style: visuallyHiddenAttributes.style,\n \"aria-checked\": checked,\n \"data-checked\": dataAttr(checked),\n checked,\n disabled,\n readOnly,\n required,\n ...props,\n onBlur: handlerAll(props.onBlur, eventProps.onBlur),\n onChange: handlerAll(props.onChange, onChange),\n onFocus: handlerAll(props.onFocus, eventProps.onFocus),\n }\n },\n [\n ariaProps,\n dataProps,\n disabled,\n eventProps,\n id,\n onChange,\n readOnly,\n required,\n value,\n ],\n )\n\n const getLabelProps: PropGetter<\"label\"> = useCallback(\n (props) => ({\n ...dataProps,\n ...props,\n }),\n [dataProps],\n )\n\n return {\n name: id,\n value,\n getInputProps,\n getLabelProps,\n getRootProps,\n onChange,\n }\n}\n\nexport type UseRadioGroupReturn = ReturnType<typeof useRadioGroup>\n"],"mappings":";;;;;;;;;;;;;;AAqBA,MAAM,CAAC,mBAAmB,wBACxBA,8BAAiC;CAC/B,MAAM;CACN,QAAQ;CACT,CAAC;AAoBJ,MAAa,iBACX,QAA+B,EAAE,KAC9B;CACH,MAAM,yBAAc;CACpB,MAAM,EACJ,SAAS,EAAE,YAAY,EAAE,EACzB,OAAO,EACL,KAAK,MACL,cACA,UACA,UACA,UACA,OAAO,WACP,UAAU,cACV,GAAG,QAEL,WAAW,EAAE,oBAAoB,qBAAqB,GAAG,aACzD,WACA,eACEC,sCAAc,MAAM;CACxB,MAAM,cAAc,EAAE,YAAY;CAClC,MAAM,CAAC,OAAO,YAAYC,gEAAqB;EAC7C;EACA,OAAO;EACP,UAAU;EACX,CAAC;CAEF,MAAM,mCACH,cAAiD;AAChD,MAAI,CAAC,YAAa;AAElB,sDAAa,UAAU,CACrB,UAAS,UAAU,OAAO,MAAW;MAErC,UAAS,UAAU;IAGvB,CAAC,aAAa,SAAS,CACxB;CAED,MAAMC,uCACH,EACC,KACA,oBAAoB,iBACpB,mBAAmB,gBACnB,GAAGC,YACD,EAAE,KACJC,yBACE,WACA;EACE;EACA,8DAAuB,qBAAqB,gBAAgB;EAC5D,6DAAsB,SAAS,eAAe;EAC9C,MAAM;EACP,EACD,EAAE,KAAK,EACP,MACAD,QACD,EAAE,EACL;EAAC;EAAqB;EAAW;EAAI;EAAS;EAAK,CACpD;AA6CD,QAAO;EACL,MAAM;EACN;EACA,uCA7CC,UAAQ,EAAE,KAAK;GACd,MAAM,UAAU,oDAAa,MAAM,IAAI,UAAUA,QAAM;AAEvD,UAAO;IACL,GAAG;IACH,GAAG;IACH,MAAM;IACN,MAAM;IACN,OAAOE,qCAAyB;IAChC,gBAAgB;IAChB,gEAAyB,QAAQ;IACjC;IACA;IACA;IACA;IACA,GAAGF;IACH,0DAAmBA,QAAM,QAAQ,WAAW,OAAO;IACnD,4DAAqBA,QAAM,UAAU,SAAS;IAC9C,2DAAoBA,QAAM,SAAS,WAAW,QAAQ;IACvD;KAEH;GACE;GACA;GACA;GACA;GACA;GACA;GACA;GACA;GACA;GACD,CACF;EAcC,uCAXC,aAAW;GACV,GAAG;GACH,GAAGA;GACJ,GACD,CAAC,UAAU,CACZ;EAOC;EACA;EACD"}
|
|
@@ -4,6 +4,8 @@ const require_rolldown_runtime = require('../../_virtual/rolldown_runtime.cjs');
|
|
|
4
4
|
const require_dom = require('../../utils/dom.cjs');
|
|
5
5
|
const require_ref = require('../../utils/ref.cjs');
|
|
6
6
|
const require_utils_index = require('../../utils/index.cjs');
|
|
7
|
+
const require_props = require('../../core/components/props.cjs');
|
|
8
|
+
require('../../core/index.cjs');
|
|
7
9
|
const require_hooks_use_controllable_state_index = require('../../hooks/use-controllable-state/index.cjs');
|
|
8
10
|
const require_use_field_props = require('../field/use-field-props.cjs');
|
|
9
11
|
require('../field/index.cjs');
|
|
@@ -32,12 +34,7 @@ const useRadio = ({ "aria-describedby": ariaDescribedbyProp, ...props } = {}) =>
|
|
|
32
34
|
setChecked(ev);
|
|
33
35
|
}, [setChecked, interactive]);
|
|
34
36
|
const getRootProps = (0, react.useCallback)((props$1 = {}) => {
|
|
35
|
-
const sharedProps = {
|
|
36
|
-
...dataProps,
|
|
37
|
-
"data-checked": (0, require_utils_index.utils_exports.dataAttr)(checked),
|
|
38
|
-
...rest,
|
|
39
|
-
...props$1
|
|
40
|
-
};
|
|
37
|
+
const sharedProps = require_props.mergeProps(dataProps, { "data-checked": (0, require_utils_index.utils_exports.dataAttr)(checked) }, rest, props$1)();
|
|
41
38
|
return getLabelProps?.(sharedProps) ?? sharedProps;
|
|
42
39
|
}, [
|
|
43
40
|
dataProps,
|
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"file":"use-radio.cjs","names":["useRadioGroupContext","useFieldProps","useControllableEventState","getRootProps: PropGetter<\"label\">","props","getInputProps: PropGetter<\"input\">","ariaDescribedby","visuallyHiddenAttributes","mergeRefs"],"sources":["../../../../src/components/radio/use-radio.ts"],"sourcesContent":["\"use client\"\n\nimport type { ChangeEvent, ChangeEventHandler, FocusEventHandler } from \"react\"\nimport type { HTMLProps, HTMLRefAttributes, PropGetter } from \"../../core\"\nimport type { FieldProps } from \"../field\"\nimport { useCallback, useId } from \"react\"\nimport { useControllableEventState } from \"../../hooks/use-controllable-state\"\nimport {\n cx,\n dataAttr,\n handlerAll,\n isUndefined,\n mergeRefs,\n visuallyHiddenAttributes,\n} from \"../../utils\"\nimport { useFieldProps } from \"../field\"\nimport { useRadioGroupContext } from \"./use-radio-group\"\n\nexport interface UseRadioProps<Y extends string = string>\n extends\n Omit<HTMLProps<\"label\">, \"onBlur\" | \"onChange\" | \"onFocus\" | \"ref\">,\n HTMLRefAttributes<\"input\">,\n FieldProps {\n /**\n * If `true`, the radio will be checked.\n */\n checked?: boolean\n /**\n * If `true`, the radio will be initially checked.\n *\n * @default false\n */\n defaultChecked?: boolean\n /**\n * id assigned to input.\n */\n id?: string\n /**\n * The name of the input field in a radio.\n */\n name?: string\n /**\n * The value of the radio.\n */\n value?: Y\n /**\n * The callback invoked when the radio is blurred.\n */\n onBlur?: FocusEventHandler<HTMLInputElement>\n /**\n * The callback invoked when the checked state changes.\n */\n onChange?: ChangeEventHandler<HTMLInputElement>\n /**\n * The callback invoked when the radio is focused.\n */\n onFocus?: FocusEventHandler<HTMLInputElement>\n}\n\nexport const useRadio = <Y extends string = string>({\n \"aria-describedby\": ariaDescribedbyProp,\n ...props\n}: UseRadioProps<Y> = {}) => {\n const group = useRadioGroupContext()\n const {\n name: groupName,\n value: groupValue,\n getInputProps: getGroupInputProps,\n getLabelProps,\n } = group ?? {}\n const uuid = useId()\n const {\n props: {\n id,\n ref,\n name = groupName,\n \"aria-controls\": ariaControlsProp,\n \"aria-labelledby\": ariaLabelledbyProp,\n checked: checkedProp,\n defaultChecked = false,\n disabled,\n readOnly,\n required,\n tabIndex,\n value,\n onChange: onChangeProp,\n ...rest\n },\n ariaProps: { \"aria-describedby\": ariaDescribedby, ...ariaProps },\n dataProps,\n eventProps,\n } = useFieldProps({\n id: group ? uuid : undefined,\n ...props,\n notSupportReadOnly: true,\n })\n const interactive = !(readOnly || disabled)\n const resolvedAriaDescribedby = group ? ariaDescribedbyProp : ariaDescribedby\n const resolvedChecked =\n !isUndefined(groupValue) && !isUndefined(value)\n ? groupValue === value\n : checkedProp\n const [checked, setChecked] = useControllableEventState({\n defaultValue: defaultChecked,\n value: resolvedChecked,\n onChange: onChangeProp,\n })\n\n const onChange = useCallback(\n (ev: ChangeEvent<HTMLInputElement>) => {\n if (!interactive) return (ev.defaultPrevented = true)\n\n setChecked(ev)\n },\n [setChecked, interactive],\n )\n\n const getRootProps: PropGetter<\"label\"> = useCallback(\n (props = {}) => {\n const sharedProps =
|
|
1
|
+
{"version":3,"file":"use-radio.cjs","names":["useRadioGroupContext","useFieldProps","useControllableEventState","getRootProps: PropGetter<\"label\">","mergeProps","props","getInputProps: PropGetter<\"input\">","ariaDescribedby","visuallyHiddenAttributes","mergeRefs"],"sources":["../../../../src/components/radio/use-radio.ts"],"sourcesContent":["\"use client\"\n\nimport type { ChangeEvent, ChangeEventHandler, FocusEventHandler } from \"react\"\nimport type { HTMLProps, HTMLRefAttributes, PropGetter } from \"../../core\"\nimport type { FieldProps } from \"../field\"\nimport { useCallback, useId } from \"react\"\nimport { mergeProps } from \"../../core\"\nimport { useControllableEventState } from \"../../hooks/use-controllable-state\"\nimport {\n cx,\n dataAttr,\n handlerAll,\n isUndefined,\n mergeRefs,\n visuallyHiddenAttributes,\n} from \"../../utils\"\nimport { useFieldProps } from \"../field\"\nimport { useRadioGroupContext } from \"./use-radio-group\"\n\nexport interface UseRadioProps<Y extends string = string>\n extends\n Omit<HTMLProps<\"label\">, \"onBlur\" | \"onChange\" | \"onFocus\" | \"ref\">,\n HTMLRefAttributes<\"input\">,\n FieldProps {\n /**\n * If `true`, the radio will be checked.\n */\n checked?: boolean\n /**\n * If `true`, the radio will be initially checked.\n *\n * @default false\n */\n defaultChecked?: boolean\n /**\n * id assigned to input.\n */\n id?: string\n /**\n * The name of the input field in a radio.\n */\n name?: string\n /**\n * The value of the radio.\n */\n value?: Y\n /**\n * The callback invoked when the radio is blurred.\n */\n onBlur?: FocusEventHandler<HTMLInputElement>\n /**\n * The callback invoked when the checked state changes.\n */\n onChange?: ChangeEventHandler<HTMLInputElement>\n /**\n * The callback invoked when the radio is focused.\n */\n onFocus?: FocusEventHandler<HTMLInputElement>\n}\n\nexport const useRadio = <Y extends string = string>({\n \"aria-describedby\": ariaDescribedbyProp,\n ...props\n}: UseRadioProps<Y> = {}) => {\n const group = useRadioGroupContext()\n const {\n name: groupName,\n value: groupValue,\n getInputProps: getGroupInputProps,\n getLabelProps,\n } = group ?? {}\n const uuid = useId()\n const {\n props: {\n id,\n ref,\n name = groupName,\n \"aria-controls\": ariaControlsProp,\n \"aria-labelledby\": ariaLabelledbyProp,\n checked: checkedProp,\n defaultChecked = false,\n disabled,\n readOnly,\n required,\n tabIndex,\n value,\n onChange: onChangeProp,\n ...rest\n },\n ariaProps: { \"aria-describedby\": ariaDescribedby, ...ariaProps },\n dataProps,\n eventProps,\n } = useFieldProps({\n id: group ? uuid : undefined,\n ...props,\n notSupportReadOnly: true,\n })\n const interactive = !(readOnly || disabled)\n const resolvedAriaDescribedby = group ? ariaDescribedbyProp : ariaDescribedby\n const resolvedChecked =\n !isUndefined(groupValue) && !isUndefined(value)\n ? groupValue === value\n : checkedProp\n const [checked, setChecked] = useControllableEventState({\n defaultValue: defaultChecked,\n value: resolvedChecked,\n onChange: onChangeProp,\n })\n\n const onChange = useCallback(\n (ev: ChangeEvent<HTMLInputElement>) => {\n if (!interactive) return (ev.defaultPrevented = true)\n\n setChecked(ev)\n },\n [setChecked, interactive],\n )\n\n const getRootProps: PropGetter<\"label\"> = useCallback(\n (props = {}) => {\n const sharedProps = mergeProps(\n dataProps,\n { \"data-checked\": dataAttr(checked) },\n rest,\n props,\n )()\n\n return getLabelProps?.(sharedProps) ?? sharedProps\n },\n [dataProps, getLabelProps, checked, rest],\n )\n\n const getInputProps: PropGetter<\"input\"> = useCallback(\n ({\n \"aria-controls\": ariaControls,\n \"aria-describedby\": ariaDescribedby,\n \"aria-labelledby\": ariaLabelledby,\n ...props\n } = {}) => {\n const sharedProps = {\n ...dataProps,\n ...ariaProps,\n id,\n type: \"radio\",\n name,\n style: visuallyHiddenAttributes.style,\n \"aria-checked\": checked,\n \"aria-controls\": cx(ariaControls, ariaControlsProp),\n \"aria-describedby\": cx(resolvedAriaDescribedby, ariaDescribedby),\n \"aria-labelledby\": cx(ariaLabelledby, ariaLabelledbyProp),\n \"data-checked\": dataAttr(checked),\n checked,\n disabled,\n readOnly,\n required,\n tabIndex,\n value,\n ...props,\n ref: mergeRefs(props.ref, ref),\n onBlur: handlerAll(props.onBlur, eventProps.onBlur),\n onChange: handlerAll(props.onChange, onChange),\n onFocus: handlerAll(props.onFocus, eventProps.onFocus),\n }\n\n return getGroupInputProps?.(sharedProps) ?? sharedProps\n },\n [\n dataProps,\n ariaProps,\n id,\n name,\n checked,\n ariaControlsProp,\n resolvedAriaDescribedby,\n ariaLabelledbyProp,\n disabled,\n readOnly,\n required,\n tabIndex,\n value,\n ref,\n eventProps.onBlur,\n eventProps.onFocus,\n onChange,\n getGroupInputProps,\n ],\n )\n\n const getIndicatorProps: PropGetter = useCallback(\n (props = {}) => ({\n ...dataProps,\n \"aria-hidden\": \"true\",\n \"data-checked\": dataAttr(checked),\n ...props,\n }),\n [dataProps, checked],\n )\n\n return {\n checked,\n getIndicatorProps,\n getInputProps,\n getRootProps,\n onChange,\n }\n}\n\nexport type UseRadioReturn = ReturnType<typeof useRadio>\n"],"mappings":";;;;;;;;;;;;;;;AA4DA,MAAa,YAAuC,EAClD,oBAAoB,qBACpB,GAAG,UACiB,EAAE,KAAK;CAC3B,MAAM,QAAQA,8CAAsB;CACpC,MAAM,EACJ,MAAM,WACN,OAAO,YACP,eAAe,oBACf,kBACE,SAAS,EAAE;CACf,MAAM,yBAAc;CACpB,MAAM,EACJ,OAAO,EACL,IACA,KACA,OAAO,WACP,iBAAiB,kBACjB,mBAAmB,oBACnB,SAAS,aACT,iBAAiB,OACjB,UACA,UACA,UACA,UACA,OACA,UAAU,cACV,GAAG,QAEL,WAAW,EAAE,oBAAoB,iBAAiB,GAAG,aACrD,WACA,eACEC,sCAAc;EAChB,IAAI,QAAQ,OAAO;EACnB,GAAG;EACH,oBAAoB;EACrB,CAAC;CACF,MAAM,cAAc,EAAE,YAAY;CAClC,MAAM,0BAA0B,QAAQ,sBAAsB;CAK9D,MAAM,CAAC,SAAS,cAAcC,qEAA0B;EACtD,cAAc;EACd,OALA,oDAAa,WAAW,IAAI,oDAAa,MAAM,GAC3C,eAAe,QACf;EAIJ,UAAU;EACX,CAAC;CAEF,MAAM,mCACH,OAAsC;AACrC,MAAI,CAAC,YAAa,QAAQ,GAAG,mBAAmB;AAEhD,aAAW,GAAG;IAEhB,CAAC,YAAY,YAAY,CAC1B;CAED,MAAMC,uCACH,UAAQ,EAAE,KAAK;EACd,MAAM,cAAcC,yBAClB,WACA,EAAE,gEAAyB,QAAQ,EAAE,EACrC,MACAC,QACD,EAAE;AAEH,SAAO,gBAAgB,YAAY,IAAI;IAEzC;EAAC;EAAW;EAAe;EAAS;EAAK,CAC1C;CAED,MAAMC,wCACH,EACC,iBAAiB,cACjB,oBAAoBC,mBACpB,mBAAmB,gBACnB,GAAGF,YACD,EAAE,KAAK;EACT,MAAM,cAAc;GAClB,GAAG;GACH,GAAG;GACH;GACA,MAAM;GACN;GACA,OAAOG,qCAAyB;GAChC,gBAAgB;GAChB,2DAAoB,cAAc,iBAAiB;GACnD,8DAAuB,yBAAyBD,kBAAgB;GAChE,6DAAsB,gBAAgB,mBAAmB;GACzD,gEAAyB,QAAQ;GACjC;GACA;GACA;GACA;GACA;GACA;GACA,GAAGF;GACH,KAAKI,sBAAUJ,QAAM,KAAK,IAAI;GAC9B,0DAAmBA,QAAM,QAAQ,WAAW,OAAO;GACnD,4DAAqBA,QAAM,UAAU,SAAS;GAC9C,2DAAoBA,QAAM,SAAS,WAAW,QAAQ;GACvD;AAED,SAAO,qBAAqB,YAAY,IAAI;IAE9C;EACE;EACA;EACA;EACA;EACA;EACA;EACA;EACA;EACA;EACA;EACA;EACA;EACA;EACA;EACA,WAAW;EACX,WAAW;EACX;EACA;EACD,CACF;AAYD,QAAO;EACL;EACA,2CAXC,UAAQ,EAAE,MAAM;GACf,GAAG;GACH,eAAe;GACf,gEAAyB,QAAQ;GACjC,GAAGA;GACJ,GACD,CAAC,WAAW,QAAQ,CACrB;EAKC;EACA;EACA;EACD"}
|
|
@@ -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
|
-
|
|
104
|
-
|
|
105
|
-
|
|
106
|
-
|
|
107
|
-
|
|
108
|
-
|
|
109
|
-
|
|
110
|
-
|
|
111
|
-
|
|
112
|
-
|
|
113
|
-
|
|
114
|
-
|
|
115
|
-
|
|
116
|
-
|
|
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
|
-
|
|
173
|
-
|
|
174
|
-
|
|
175
|
-
|
|
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":";;;;;;;;;;;;;;AAmBA,MAAM,mBAAmB,OAAe,OAAe;CACrD,MAAM,UAAU,KAAK,MAAM,QAAQ,GAAG,GAAG;CACzC,MAAM,YAAY,GAAG,KAAK,MAAM,IAAI,CAAC,IAAI,UAAU;AAEnD,QAAO,OAAO,QAAQ,QAAQ,UAAU,CAAC;;AAK3C,MAAM,CAAC,eAAe,oBAAoBA,8BAA6B,EACrE,MAAM,iBACP,CAAC;AAqDF,MAAa,aAAa,QAAwB,EAAE,KAAK;CACvD,MAAM,yBAAc;CACpB,MAAM,EACJ,OAAO,EACL,KAAK,MACL,OAAO,MACP,OAAO,YAAY,GACnB,eAAe,GACf,UACA,WAAW,gBAAgB,GAC3B,wBAAwB,OACxB,UACA,UACA,OAAO,WACP,UAAU,cACV,SACA,GAAG,QAEL,WACA,WACA,eACEC,sCAAc;EAAE,GAAG;EAAO,oBAAoB;EAAM,CAAC;CACzD,MAAM,4BAAiC,KAAK;CAC5C,MAAM,CAAC,OAAO,YAAYC,gEAAqB;EAC7C;EACA,OAAO;EACP,UAAU;EACX,CAAC;CACF,MAAM,CAAC,cAAc,uCAA4B,GAAG;CACpD,MAAM,+BAAoB,KAAK;CAC/B,MAAM,YAAY,KAAK,MAAM,cAAc;CAC3C,MAAM,QAAQ,KAAK,MAAM,UAAU;CACnC,MAAM,UAAU,IAAI;CACpB,MAAM,wCACE,gBAAgB,OAAO,QAAQ,EACrC,CAAC,SAAS,MAAM,CACjB;CACD,MAAM,cAAc,EAAE,YAAY;CAClC,MAAM,eAAe,iBAAiB,KAAK,eAAe;CAE1D,MAAM,0CACH,MAAc;AACb,MAAI,CAAC,QAAQ,QAAS,QAAO;EAE7B,MAAM,EAAE,MAAM,UAAU,QAAQ,QAAQ,uBAAuB;EAC/D,MAAM,YAAY,QAAQ;AAU1B,4DALE,iBAHoB,IAAI,QAAQ,YAGD,UAAU,GAAG,QAAQ,EACpD,SACA,MACD;IAIH,CAAC,OAAO,QAAQ,CACjB;CAED,MAAM,4CAAiC;AACrC,MAAI,YAAa,YAAW,UAAU;IACrC,CAAC,YAAY,CAAC;CAEjB,MAAM,4CAAiC;AACrC,MAAI,CAAC,YAAa;AAElB,kBAAgB,GAAG;AACnB,aAAW,UAAU;AAErB,MAAI,iBAAiB,GAAI,WAAU,GAAG;IACrC;EAAC;EAAc;EAAS;EAAa;EAAgB,CAAC;CAEzD,MAAM,sCACH,OAAmC;AAClC,MAAI,YAAY,SAAU;EAE1B,MAAMC,iBAAe,gBAAgB,GAAG,QAAQ;AAEhD,kBAAgBA,eAAa;AAE7B,MAAIA,mBAAiB,aAAc,WAAUA,eAAa;IAE5D;EAAC;EAAU;EAAiB;EAAc;EAAU;EAAQ,CAC7D;CAED,MAAM,uCACH,OAAmC;AAClC,KAAG,gBAAgB;EAEnB,MAAM,KAAK,GAAG,QAAQ;AAEtB,MAAI,CAAC,GAAI;AAIT,WAFc,gBAAgB,GAAG,QAAQ,CAE1B;IAEjB,CAAC,iBAAiB,SAAS,CAC5B;CAED,MAAM,qCAA0B,OAAmC;AACjE,KAAG,gBAAgB;IAClB,EAAE,CAAC;AA4DN,QAAO;EACL;EACA;EACA;EACA;EACA;EACA;EACA;EACA;EACA;EACA;EACA;EACA;EACA;EACA;EACA;EACA;EACA;EACA;EACA;EACA;EACA,sCA9EC,EAAE,KAAK,GAAGC,YAAU,EAAE,KAAK;AAgB1B,UAAO;IACL,GAhBaC,yBACb,WACA,YACA,WACA;KACE;KACA,cAAc,GAAG,MAAM;KACvB,iEAA0B,SAAS;KACnC,MAAM;KACP,EACD,MACAD,SACA,EAAE,KAAK,EACP,EAAE,KAAK,SAAS,CACjB,EAAE;IAGD,gEACEA,QAAM,cACN,KAAK,cACL,aACD;IACD,gEACEA,QAAM,cACN,KAAK,cACL,aACD;IACD,+DACEA,QAAM,aACN,KAAK,aACL,YACD;IACD,8DAAuBA,QAAM,YAAY,KAAK,YAAY,WAAW;IACrE,gEACEA,QAAM,cACN,KAAK,cACL,aACD;IACF;KAEH;GACE;GACA;GACA;GACA;GACA;GACA;GACA;GACA;GACA;GACA;GACA;GACA;GACD,CACF;EAwBA;;AAUH,MAAa,iBAAiB,EAC5B,YACA,OACA,GAAG,WACqB;CACxB,MAAM,EACJ,IAAI,QACJ,MACA,SACA,UACA,cACA,uBACA,aACA,YACA,UACA,UACA,cACA,iBACA,UACA,WACA,WACA,eACE,kBAAkB;CACtB,MAAM,gBAAgB,WAAW,eAAe,IAAI,QAAQ,QAAQ;CACpE,MAAM,iCACE,gBAAgB,aAAa,IAAI,eAAe,QAAQ,EAC9D;EAAC;EAAS;EAAe;EAAW,CACrC;CACD,MAAM,SAAS,UAAU;CACzB,MAAM,UAAU,UAAU;CAC1B,MAAM,SAAS,wBACX,UAAU,eACV,SAAS;CACb,MAAM,KAAK,GAAG,OAAO,GAAG,WAAW,GAAG;CAEtC,MAAM,sCAA2B;AAC/B,MAAI,WAAW,QAAS,iBAAgB,GAAG;IAC1C,CAAC,YAAY,gBAAgB,CAAC;CAEjC,MAAM,wCACH,OAAsC;AACrC,MAAI,CAAC,YAAa;AAIlB,kBAFc,WAAW,GAAG,OAAO,MAAM,CAEnB;IAExB,CAAC,aAAa,gBAAgB,CAC/B;CAED,MAAM,mCACH,YAAkB;AACjB,MAAI,CAAC,YAAa;AAElB,WAASE,QAAM;IAEjB,CAAC,aAAa,SAAS,CACxB;CAED,MAAM,2CAAgC;AACpC,WAAS,MAAM;IACd,CAAC,UAAU,MAAM,CAAC;CAErB,MAAM,4CAAiC;AACrC,WAAS,MAAM;IACd,CAAC,UAAU,MAAM,CAAC;CAErB,MAAM,oCACH,OAAwC;AACvC,2BAAa,IAAI,EACf,aAAa,SAAS,MAAM,EAC7B,CAAC;IAEJ,CAAC,UAAU,MAAM,CAClB;CAED,MAAMC,wCACH,EAAE,OAAO,GAAG,UAAU,EAAE,KACvBF,yBACE,WACA,WACA;EACE,SAAS;EACT,+DAAwB,OAAO;EAC/B,+DAAwB,OAAO;EAChC,EACD,MACA,OACA,EAAE,OAAO,EACT,EACE,OAAO,EACL,QAAQ,kBAAkB,IAAK,SAAS,IAAI,KAAM,QACnD,EACF,EACD;EAAE;EAAa;EAAc,CAC9B,EAAE,EACL;EACE;EACA;EACA;EACA;EACA;EACA;EACA;EACA;EACA;EACD,CACF;AA0CD,QAAO;EACL;EACA;EACA;EACA;EACA;EACA;EACA,uCA9CC,QAAQ,EAAE,MAAM;GACf,GAAG;GACH,GAAG;GACH,GAAG;GACH;GACA,MAAM;GACN;GACA,OAAOG,qCAAyB;GAChC,cAAc,MAAM,UAAU;GAC9B,+DAAwB,OAAO;GAC/B,gEAAyB,QAAQ;GACjC;GACA;GACA;GACA;GACA;GACA,GAAG;GACH,0DAAmB,QAAQ,MAAM,OAAO;GACxC,4DAAqB,MAAM,UAAU,cAAc;GACnD,6DAAsB,MAAM,WAAW,UAAU;GAClD,GACD;GACE;GACA;GACA;GACA;GACA;GACA;GACA;GACA;GACA;GACA;GACA;GACA;GACA;GACA;GACD,CACF;EAUC;EACD"}
|
|
@@ -2,8 +2,9 @@
|
|
|
2
2
|
|
|
3
3
|
import { createContext as createContext$1 } from "../../utils/context.js";
|
|
4
4
|
import { 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";
|
|
@@ -28,16 +29,12 @@ const useRadioGroup = (props = {}) => {
|
|
|
28
29
|
if ((0, utils_exports.isObject)(valueOrEv)) setValue(valueOrEv.target.value);
|
|
29
30
|
else setValue(valueOrEv);
|
|
30
31
|
}, [interactive, setValue]);
|
|
31
|
-
const getRootProps = useCallback(({ ref, "aria-describedby": ariaDescribedby, "aria-labelledby": ariaLabelledby, ...props$1 } = {}) => ({
|
|
32
|
-
...dataProps,
|
|
32
|
+
const getRootProps = useCallback(({ ref, "aria-describedby": ariaDescribedby, "aria-labelledby": ariaLabelledby, ...props$1 } = {}) => mergeProps(dataProps, {
|
|
33
33
|
id,
|
|
34
34
|
"aria-describedby": (0, utils_exports.cx)(ariaDescribedbyProp, ariaDescribedby),
|
|
35
35
|
"aria-labelledby": (0, utils_exports.cx)(labelId, ariaLabelledby),
|
|
36
|
-
role: "radiogroup"
|
|
37
|
-
|
|
38
|
-
...props$1,
|
|
39
|
-
ref: mergeRefs(ref, rest.ref)
|
|
40
|
-
}), [
|
|
36
|
+
role: "radiogroup"
|
|
37
|
+
}, { ref }, rest, props$1)(), [
|
|
41
38
|
ariaDescribedbyProp,
|
|
42
39
|
dataProps,
|
|
43
40
|
id,
|
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"file":"use-radio-group.js","names":["createContext","getRootProps: PropGetter","props"],"sources":["../../../../src/components/radio/use-radio-group.ts"],"sourcesContent":["\"use client\"\n\nimport type { ChangeEvent } from \"react\"\nimport type { HTMLProps, PropGetter } from \"../../core\"\nimport type { FieldProps } from \"../field\"\nimport { useCallback, useId } from \"react\"\nimport { useControllableState } from \"../../hooks/use-controllable-state\"\nimport {\n createContext,\n cx,\n dataAttr,\n handlerAll,\n isObject,\n isUndefined,\n
|
|
1
|
+
{"version":3,"file":"use-radio-group.js","names":["createContext","getRootProps: PropGetter","props"],"sources":["../../../../src/components/radio/use-radio-group.ts"],"sourcesContent":["\"use client\"\n\nimport type { ChangeEvent } from \"react\"\nimport type { HTMLProps, PropGetter } from \"../../core\"\nimport type { FieldProps } from \"../field\"\nimport { useCallback, useId } from \"react\"\nimport { mergeProps } from \"../../core\"\nimport { useControllableState } from \"../../hooks/use-controllable-state\"\nimport {\n createContext,\n cx,\n dataAttr,\n handlerAll,\n isObject,\n isUndefined,\n visuallyHiddenAttributes,\n} from \"../../utils\"\nimport { useFieldProps } from \"../field\"\n\ninterface RadioGroupContext extends Omit<UseRadioGroupReturn, \"getRootProps\"> {}\n\nconst [RadioGroupContext, useRadioGroupContext] =\n createContext<RadioGroupContext>({\n name: \"RadioGroupContext\",\n strict: false,\n })\n\nexport { RadioGroupContext, useRadioGroupContext }\n\nexport interface UseRadioGroupProps<Y extends string = string>\n extends Omit<HTMLProps, \"defaultValue\" | \"onChange\" | \"value\">, FieldProps {\n /**\n * The initial value of the radio group.\n */\n defaultValue?: Y\n /**\n * The value of the radio group.\n */\n value?: Y\n /**\n * The callback fired when any children radio is checked or unchecked.\n */\n onChange?: (value: Y) => void\n}\n\nexport const useRadioGroup = <Y extends string = string>(\n props: UseRadioGroupProps<Y> = {},\n) => {\n const uuid = useId()\n const {\n context: { labelId } = {},\n props: {\n id = uuid,\n defaultValue,\n disabled,\n readOnly,\n required,\n value: valueProp,\n onChange: onChangeProp,\n ...rest\n },\n ariaProps: { \"aria-describedby\": ariaDescribedbyProp, ...ariaProps },\n dataProps,\n eventProps,\n } = useFieldProps(props)\n const interactive = !(readOnly || disabled)\n const [value, setValue] = useControllableState({\n defaultValue,\n value: valueProp,\n onChange: onChangeProp,\n })\n\n const onChange = useCallback(\n (valueOrEv: ChangeEvent<HTMLInputElement> | Y) => {\n if (!interactive) return\n\n if (isObject(valueOrEv)) {\n setValue(valueOrEv.target.value as Y)\n } else {\n setValue(valueOrEv)\n }\n },\n [interactive, setValue],\n )\n\n const getRootProps: PropGetter = useCallback(\n ({\n ref,\n \"aria-describedby\": ariaDescribedby,\n \"aria-labelledby\": ariaLabelledby,\n ...props\n } = {}) =>\n mergeProps(\n dataProps,\n {\n id,\n \"aria-describedby\": cx(ariaDescribedbyProp, ariaDescribedby),\n \"aria-labelledby\": cx(labelId, ariaLabelledby),\n role: \"radiogroup\",\n },\n { ref },\n rest,\n props,\n )(),\n [ariaDescribedbyProp, dataProps, id, labelId, rest],\n )\n\n const getInputProps: PropGetter<\"input\"> = useCallback(\n (props = {}) => {\n const checked = !isUndefined(value) && value === props.value\n\n return {\n ...dataProps,\n ...ariaProps,\n type: \"radio\",\n name: id,\n style: visuallyHiddenAttributes.style,\n \"aria-checked\": checked,\n \"data-checked\": dataAttr(checked),\n checked,\n disabled,\n readOnly,\n required,\n ...props,\n onBlur: handlerAll(props.onBlur, eventProps.onBlur),\n onChange: handlerAll(props.onChange, onChange),\n onFocus: handlerAll(props.onFocus, eventProps.onFocus),\n }\n },\n [\n ariaProps,\n dataProps,\n disabled,\n eventProps,\n id,\n onChange,\n readOnly,\n required,\n value,\n ],\n )\n\n const getLabelProps: PropGetter<\"label\"> = useCallback(\n (props) => ({\n ...dataProps,\n ...props,\n }),\n [dataProps],\n )\n\n return {\n name: id,\n value,\n getInputProps,\n getLabelProps,\n getRootProps,\n onChange,\n }\n}\n\nexport type UseRadioGroupReturn = ReturnType<typeof useRadioGroup>\n"],"mappings":";;;;;;;;;;;;;AAqBA,MAAM,CAAC,mBAAmB,wBACxBA,gBAAiC;CAC/B,MAAM;CACN,QAAQ;CACT,CAAC;AAoBJ,MAAa,iBACX,QAA+B,EAAE,KAC9B;CACH,MAAM,OAAO,OAAO;CACpB,MAAM,EACJ,SAAS,EAAE,YAAY,EAAE,EACzB,OAAO,EACL,KAAK,MACL,cACA,UACA,UACA,UACA,OAAO,WACP,UAAU,cACV,GAAG,QAEL,WAAW,EAAE,oBAAoB,qBAAqB,GAAG,aACzD,WACA,eACE,cAAc,MAAM;CACxB,MAAM,cAAc,EAAE,YAAY;CAClC,MAAM,CAAC,OAAO,YAAY,qBAAqB;EAC7C;EACA,OAAO;EACP,UAAU;EACX,CAAC;CAEF,MAAM,WAAW,aACd,cAAiD;AAChD,MAAI,CAAC,YAAa;AAElB,kCAAa,UAAU,CACrB,UAAS,UAAU,OAAO,MAAW;MAErC,UAAS,UAAU;IAGvB,CAAC,aAAa,SAAS,CACxB;CAED,MAAMC,eAA2B,aAC9B,EACC,KACA,oBAAoB,iBACpB,mBAAmB,gBACnB,GAAGC,YACD,EAAE,KACJ,WACE,WACA;EACE;EACA,0CAAuB,qBAAqB,gBAAgB;EAC5D,yCAAsB,SAAS,eAAe;EAC9C,MAAM;EACP,EACD,EAAE,KAAK,EACP,MACAA,QACD,EAAE,EACL;EAAC;EAAqB;EAAW;EAAI;EAAS;EAAK,CACpD;AA6CD,QAAO;EACL,MAAM;EACN;EACA,eA9CyC,aACxC,UAAQ,EAAE,KAAK;GACd,MAAM,UAAU,gCAAa,MAAM,IAAI,UAAUA,QAAM;AAEvD,UAAO;IACL,GAAG;IACH,GAAG;IACH,MAAM;IACN,MAAM;IACN,OAAO,yBAAyB;IAChC,gBAAgB;IAChB,4CAAyB,QAAQ;IACjC;IACA;IACA;IACA;IACA,GAAGA;IACH,sCAAmBA,QAAM,QAAQ,WAAW,OAAO;IACnD,wCAAqBA,QAAM,UAAU,SAAS;IAC9C,uCAAoBA,QAAM,SAAS,WAAW,QAAQ;IACvD;KAEH;GACE;GACA;GACA;GACA;GACA;GACA;GACA;GACA;GACA;GACD,CACF;EAcC,eAZyC,aACxC,aAAW;GACV,GAAG;GACH,GAAGA;GACJ,GACD,CAAC,UAAU,CACZ;EAOC;EACA;EACD"}
|
|
@@ -3,6 +3,8 @@
|
|
|
3
3
|
import { visuallyHiddenAttributes } from "../../utils/dom.js";
|
|
4
4
|
import { mergeRefs } from "../../utils/ref.js";
|
|
5
5
|
import { utils_exports } from "../../utils/index.js";
|
|
6
|
+
import { mergeProps } from "../../core/components/props.js";
|
|
7
|
+
import "../../core/index.js";
|
|
6
8
|
import { useControllableEventState } from "../../hooks/use-controllable-state/index.js";
|
|
7
9
|
import { useFieldProps } from "../field/use-field-props.js";
|
|
8
10
|
import "../field/index.js";
|
|
@@ -31,12 +33,7 @@ const useRadio = ({ "aria-describedby": ariaDescribedbyProp, ...props } = {}) =>
|
|
|
31
33
|
setChecked(ev);
|
|
32
34
|
}, [setChecked, interactive]);
|
|
33
35
|
const getRootProps = useCallback((props$1 = {}) => {
|
|
34
|
-
const sharedProps = {
|
|
35
|
-
...dataProps,
|
|
36
|
-
"data-checked": (0, utils_exports.dataAttr)(checked),
|
|
37
|
-
...rest,
|
|
38
|
-
...props$1
|
|
39
|
-
};
|
|
36
|
+
const sharedProps = mergeProps(dataProps, { "data-checked": (0, utils_exports.dataAttr)(checked) }, rest, props$1)();
|
|
40
37
|
return getLabelProps?.(sharedProps) ?? sharedProps;
|
|
41
38
|
}, [
|
|
42
39
|
dataProps,
|
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"file":"use-radio.js","names":["getRootProps: PropGetter<\"label\">","props","getInputProps: PropGetter<\"input\">","ariaDescribedby"],"sources":["../../../../src/components/radio/use-radio.ts"],"sourcesContent":["\"use client\"\n\nimport type { ChangeEvent, ChangeEventHandler, FocusEventHandler } from \"react\"\nimport type { HTMLProps, HTMLRefAttributes, PropGetter } from \"../../core\"\nimport type { FieldProps } from \"../field\"\nimport { useCallback, useId } from \"react\"\nimport { useControllableEventState } from \"../../hooks/use-controllable-state\"\nimport {\n cx,\n dataAttr,\n handlerAll,\n isUndefined,\n mergeRefs,\n visuallyHiddenAttributes,\n} from \"../../utils\"\nimport { useFieldProps } from \"../field\"\nimport { useRadioGroupContext } from \"./use-radio-group\"\n\nexport interface UseRadioProps<Y extends string = string>\n extends\n Omit<HTMLProps<\"label\">, \"onBlur\" | \"onChange\" | \"onFocus\" | \"ref\">,\n HTMLRefAttributes<\"input\">,\n FieldProps {\n /**\n * If `true`, the radio will be checked.\n */\n checked?: boolean\n /**\n * If `true`, the radio will be initially checked.\n *\n * @default false\n */\n defaultChecked?: boolean\n /**\n * id assigned to input.\n */\n id?: string\n /**\n * The name of the input field in a radio.\n */\n name?: string\n /**\n * The value of the radio.\n */\n value?: Y\n /**\n * The callback invoked when the radio is blurred.\n */\n onBlur?: FocusEventHandler<HTMLInputElement>\n /**\n * The callback invoked when the checked state changes.\n */\n onChange?: ChangeEventHandler<HTMLInputElement>\n /**\n * The callback invoked when the radio is focused.\n */\n onFocus?: FocusEventHandler<HTMLInputElement>\n}\n\nexport const useRadio = <Y extends string = string>({\n \"aria-describedby\": ariaDescribedbyProp,\n ...props\n}: UseRadioProps<Y> = {}) => {\n const group = useRadioGroupContext()\n const {\n name: groupName,\n value: groupValue,\n getInputProps: getGroupInputProps,\n getLabelProps,\n } = group ?? {}\n const uuid = useId()\n const {\n props: {\n id,\n ref,\n name = groupName,\n \"aria-controls\": ariaControlsProp,\n \"aria-labelledby\": ariaLabelledbyProp,\n checked: checkedProp,\n defaultChecked = false,\n disabled,\n readOnly,\n required,\n tabIndex,\n value,\n onChange: onChangeProp,\n ...rest\n },\n ariaProps: { \"aria-describedby\": ariaDescribedby, ...ariaProps },\n dataProps,\n eventProps,\n } = useFieldProps({\n id: group ? uuid : undefined,\n ...props,\n notSupportReadOnly: true,\n })\n const interactive = !(readOnly || disabled)\n const resolvedAriaDescribedby = group ? ariaDescribedbyProp : ariaDescribedby\n const resolvedChecked =\n !isUndefined(groupValue) && !isUndefined(value)\n ? groupValue === value\n : checkedProp\n const [checked, setChecked] = useControllableEventState({\n defaultValue: defaultChecked,\n value: resolvedChecked,\n onChange: onChangeProp,\n })\n\n const onChange = useCallback(\n (ev: ChangeEvent<HTMLInputElement>) => {\n if (!interactive) return (ev.defaultPrevented = true)\n\n setChecked(ev)\n },\n [setChecked, interactive],\n )\n\n const getRootProps: PropGetter<\"label\"> = useCallback(\n (props = {}) => {\n const sharedProps =
|
|
1
|
+
{"version":3,"file":"use-radio.js","names":["getRootProps: PropGetter<\"label\">","props","getInputProps: PropGetter<\"input\">","ariaDescribedby"],"sources":["../../../../src/components/radio/use-radio.ts"],"sourcesContent":["\"use client\"\n\nimport type { ChangeEvent, ChangeEventHandler, FocusEventHandler } from \"react\"\nimport type { HTMLProps, HTMLRefAttributes, PropGetter } from \"../../core\"\nimport type { FieldProps } from \"../field\"\nimport { useCallback, useId } from \"react\"\nimport { mergeProps } from \"../../core\"\nimport { useControllableEventState } from \"../../hooks/use-controllable-state\"\nimport {\n cx,\n dataAttr,\n handlerAll,\n isUndefined,\n mergeRefs,\n visuallyHiddenAttributes,\n} from \"../../utils\"\nimport { useFieldProps } from \"../field\"\nimport { useRadioGroupContext } from \"./use-radio-group\"\n\nexport interface UseRadioProps<Y extends string = string>\n extends\n Omit<HTMLProps<\"label\">, \"onBlur\" | \"onChange\" | \"onFocus\" | \"ref\">,\n HTMLRefAttributes<\"input\">,\n FieldProps {\n /**\n * If `true`, the radio will be checked.\n */\n checked?: boolean\n /**\n * If `true`, the radio will be initially checked.\n *\n * @default false\n */\n defaultChecked?: boolean\n /**\n * id assigned to input.\n */\n id?: string\n /**\n * The name of the input field in a radio.\n */\n name?: string\n /**\n * The value of the radio.\n */\n value?: Y\n /**\n * The callback invoked when the radio is blurred.\n */\n onBlur?: FocusEventHandler<HTMLInputElement>\n /**\n * The callback invoked when the checked state changes.\n */\n onChange?: ChangeEventHandler<HTMLInputElement>\n /**\n * The callback invoked when the radio is focused.\n */\n onFocus?: FocusEventHandler<HTMLInputElement>\n}\n\nexport const useRadio = <Y extends string = string>({\n \"aria-describedby\": ariaDescribedbyProp,\n ...props\n}: UseRadioProps<Y> = {}) => {\n const group = useRadioGroupContext()\n const {\n name: groupName,\n value: groupValue,\n getInputProps: getGroupInputProps,\n getLabelProps,\n } = group ?? {}\n const uuid = useId()\n const {\n props: {\n id,\n ref,\n name = groupName,\n \"aria-controls\": ariaControlsProp,\n \"aria-labelledby\": ariaLabelledbyProp,\n checked: checkedProp,\n defaultChecked = false,\n disabled,\n readOnly,\n required,\n tabIndex,\n value,\n onChange: onChangeProp,\n ...rest\n },\n ariaProps: { \"aria-describedby\": ariaDescribedby, ...ariaProps },\n dataProps,\n eventProps,\n } = useFieldProps({\n id: group ? uuid : undefined,\n ...props,\n notSupportReadOnly: true,\n })\n const interactive = !(readOnly || disabled)\n const resolvedAriaDescribedby = group ? ariaDescribedbyProp : ariaDescribedby\n const resolvedChecked =\n !isUndefined(groupValue) && !isUndefined(value)\n ? groupValue === value\n : checkedProp\n const [checked, setChecked] = useControllableEventState({\n defaultValue: defaultChecked,\n value: resolvedChecked,\n onChange: onChangeProp,\n })\n\n const onChange = useCallback(\n (ev: ChangeEvent<HTMLInputElement>) => {\n if (!interactive) return (ev.defaultPrevented = true)\n\n setChecked(ev)\n },\n [setChecked, interactive],\n )\n\n const getRootProps: PropGetter<\"label\"> = useCallback(\n (props = {}) => {\n const sharedProps = mergeProps(\n dataProps,\n { \"data-checked\": dataAttr(checked) },\n rest,\n props,\n )()\n\n return getLabelProps?.(sharedProps) ?? sharedProps\n },\n [dataProps, getLabelProps, checked, rest],\n )\n\n const getInputProps: PropGetter<\"input\"> = useCallback(\n ({\n \"aria-controls\": ariaControls,\n \"aria-describedby\": ariaDescribedby,\n \"aria-labelledby\": ariaLabelledby,\n ...props\n } = {}) => {\n const sharedProps = {\n ...dataProps,\n ...ariaProps,\n id,\n type: \"radio\",\n name,\n style: visuallyHiddenAttributes.style,\n \"aria-checked\": checked,\n \"aria-controls\": cx(ariaControls, ariaControlsProp),\n \"aria-describedby\": cx(resolvedAriaDescribedby, ariaDescribedby),\n \"aria-labelledby\": cx(ariaLabelledby, ariaLabelledbyProp),\n \"data-checked\": dataAttr(checked),\n checked,\n disabled,\n readOnly,\n required,\n tabIndex,\n value,\n ...props,\n ref: mergeRefs(props.ref, ref),\n onBlur: handlerAll(props.onBlur, eventProps.onBlur),\n onChange: handlerAll(props.onChange, onChange),\n onFocus: handlerAll(props.onFocus, eventProps.onFocus),\n }\n\n return getGroupInputProps?.(sharedProps) ?? sharedProps\n },\n [\n dataProps,\n ariaProps,\n id,\n name,\n checked,\n ariaControlsProp,\n resolvedAriaDescribedby,\n ariaLabelledbyProp,\n disabled,\n readOnly,\n required,\n tabIndex,\n value,\n ref,\n eventProps.onBlur,\n eventProps.onFocus,\n onChange,\n getGroupInputProps,\n ],\n )\n\n const getIndicatorProps: PropGetter = useCallback(\n (props = {}) => ({\n ...dataProps,\n \"aria-hidden\": \"true\",\n \"data-checked\": dataAttr(checked),\n ...props,\n }),\n [dataProps, checked],\n )\n\n return {\n checked,\n getIndicatorProps,\n getInputProps,\n getRootProps,\n onChange,\n }\n}\n\nexport type UseRadioReturn = ReturnType<typeof useRadio>\n"],"mappings":";;;;;;;;;;;;;;AA4DA,MAAa,YAAuC,EAClD,oBAAoB,qBACpB,GAAG,UACiB,EAAE,KAAK;CAC3B,MAAM,QAAQ,sBAAsB;CACpC,MAAM,EACJ,MAAM,WACN,OAAO,YACP,eAAe,oBACf,kBACE,SAAS,EAAE;CACf,MAAM,OAAO,OAAO;CACpB,MAAM,EACJ,OAAO,EACL,IACA,KACA,OAAO,WACP,iBAAiB,kBACjB,mBAAmB,oBACnB,SAAS,aACT,iBAAiB,OACjB,UACA,UACA,UACA,UACA,OACA,UAAU,cACV,GAAG,QAEL,WAAW,EAAE,oBAAoB,iBAAiB,GAAG,aACrD,WACA,eACE,cAAc;EAChB,IAAI,QAAQ,OAAO;EACnB,GAAG;EACH,oBAAoB;EACrB,CAAC;CACF,MAAM,cAAc,EAAE,YAAY;CAClC,MAAM,0BAA0B,QAAQ,sBAAsB;CAK9D,MAAM,CAAC,SAAS,cAAc,0BAA0B;EACtD,cAAc;EACd,OALA,gCAAa,WAAW,IAAI,gCAAa,MAAM,GAC3C,eAAe,QACf;EAIJ,UAAU;EACX,CAAC;CAEF,MAAM,WAAW,aACd,OAAsC;AACrC,MAAI,CAAC,YAAa,QAAQ,GAAG,mBAAmB;AAEhD,aAAW,GAAG;IAEhB,CAAC,YAAY,YAAY,CAC1B;CAED,MAAMA,eAAoC,aACvC,UAAQ,EAAE,KAAK;EACd,MAAM,cAAc,WAClB,WACA,EAAE,4CAAyB,QAAQ,EAAE,EACrC,MACAC,QACD,EAAE;AAEH,SAAO,gBAAgB,YAAY,IAAI;IAEzC;EAAC;EAAW;EAAe;EAAS;EAAK,CAC1C;CAED,MAAMC,gBAAqC,aACxC,EACC,iBAAiB,cACjB,oBAAoBC,mBACpB,mBAAmB,gBACnB,GAAGF,YACD,EAAE,KAAK;EACT,MAAM,cAAc;GAClB,GAAG;GACH,GAAG;GACH;GACA,MAAM;GACN;GACA,OAAO,yBAAyB;GAChC,gBAAgB;GAChB,uCAAoB,cAAc,iBAAiB;GACnD,0CAAuB,yBAAyBE,kBAAgB;GAChE,yCAAsB,gBAAgB,mBAAmB;GACzD,4CAAyB,QAAQ;GACjC;GACA;GACA;GACA;GACA;GACA;GACA,GAAGF;GACH,KAAK,UAAUA,QAAM,KAAK,IAAI;GAC9B,sCAAmBA,QAAM,QAAQ,WAAW,OAAO;GACnD,wCAAqBA,QAAM,UAAU,SAAS;GAC9C,uCAAoBA,QAAM,SAAS,WAAW,QAAQ;GACvD;AAED,SAAO,qBAAqB,YAAY,IAAI;IAE9C;EACE;EACA;EACA;EACA;EACA;EACA;EACA;EACA;EACA;EACA;EACA;EACA;EACA;EACA;EACA,WAAW;EACX,WAAW;EACX;EACA;EACD,CACF;AAYD,QAAO;EACL;EACA,mBAZoC,aACnC,UAAQ,EAAE,MAAM;GACf,GAAG;GACH,eAAe;GACf,4CAAyB,QAAQ;GACjC,GAAGA;GACJ,GACD,CAAC,WAAW,QAAQ,CACrB;EAKC;EACA;EACA;EACD"}
|
|
@@ -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
|
-
|
|
103
|
-
|
|
104
|
-
|
|
105
|
-
|
|
106
|
-
|
|
107
|
-
|
|
108
|
-
|
|
109
|
-
|
|
110
|
-
|
|
111
|
-
|
|
112
|
-
|
|
113
|
-
|
|
114
|
-
|
|
115
|
-
|
|
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
|
-
|
|
172
|
-
|
|
173
|
-
|
|
174
|
-
|
|
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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"}
|
|
@@ -3,13 +3,11 @@ import { ThemeProps } from "../../core/system/index.types.js";
|
|
|
3
3
|
import { Component, HTMLStyledProps } from "../../core/components/index.types.js";
|
|
4
4
|
import "../../core/index.js";
|
|
5
5
|
import { WithTransitionProps } from "../motion/index.types.js";
|
|
6
|
-
import "../motion/index.js";
|
|
7
6
|
import { CollapseProps } from "../collapse/collapse.js";
|
|
8
|
-
import "../collapse/index.js";
|
|
9
7
|
import "../../index.js";
|
|
10
8
|
import { AccordionStyle } from "./accordion.style.js";
|
|
11
9
|
import { UseAccordionItemProps, UseAccordionProps } from "./use-accordion.js";
|
|
12
|
-
import * as
|
|
10
|
+
import * as react1224 from "react";
|
|
13
11
|
|
|
14
12
|
//#region src/components/accordion/accordion.d.ts
|
|
15
13
|
interface AccordionCallBackProps {
|
|
@@ -33,7 +31,7 @@ interface AccordionRootProps extends Omit<HTMLStyledProps, "onChange">, ThemePro
|
|
|
33
31
|
*/
|
|
34
32
|
items?: AccordionItem[];
|
|
35
33
|
}
|
|
36
|
-
declare const AccordionPropsContext:
|
|
34
|
+
declare const AccordionPropsContext: react1224.Context<Partial<AccordionRootProps> | undefined>, useAccordionPropsContext: () => Partial<AccordionRootProps> | undefined;
|
|
37
35
|
/**
|
|
38
36
|
* `Accordion` is a component for a list that displays information in an expandable or collapsible manner.
|
|
39
37
|
*
|