VRadioGroup.mjs 3.2 KB

123456789101112131415161718192021222324252627282930313233343536373839404142434445464748495051525354555657585960616263646566676869707172737475767778798081828384858687888990919293949596979899100
  1. import { mergeProps as _mergeProps, resolveDirective as _resolveDirective, createVNode as _createVNode, Fragment as _Fragment } from "vue";
  2. // Styles
  3. import "./VRadioGroup.css";
  4. // Components
  5. import { makeVInputProps, VInput } from "../VInput/VInput.mjs";
  6. import { VLabel } from "../VLabel/index.mjs";
  7. import { VSelectionControl } from "../VSelectionControl/index.mjs";
  8. import { makeSelectionControlGroupProps, VSelectionControlGroup } from "../VSelectionControlGroup/VSelectionControlGroup.mjs"; // Composables
  9. import { IconValue } from "../../composables/icons.mjs";
  10. import { useProxiedModel } from "../../composables/proxiedModel.mjs"; // Utilities
  11. import { computed } from 'vue';
  12. import { filterInputAttrs, genericComponent, getUid, omit, propsFactory, useRender } from "../../util/index.mjs"; // Types
  13. export const makeVRadioGroupProps = propsFactory({
  14. height: {
  15. type: [Number, String],
  16. default: 'auto'
  17. },
  18. ...makeVInputProps(),
  19. ...omit(makeSelectionControlGroupProps(), ['multiple']),
  20. trueIcon: {
  21. type: IconValue,
  22. default: '$radioOn'
  23. },
  24. falseIcon: {
  25. type: IconValue,
  26. default: '$radioOff'
  27. },
  28. type: {
  29. type: String,
  30. default: 'radio'
  31. }
  32. }, 'VRadioGroup');
  33. export const VRadioGroup = genericComponent()({
  34. name: 'VRadioGroup',
  35. inheritAttrs: false,
  36. props: makeVRadioGroupProps(),
  37. emits: {
  38. 'update:modelValue': value => true
  39. },
  40. setup(props, _ref) {
  41. let {
  42. attrs,
  43. slots
  44. } = _ref;
  45. const uid = getUid();
  46. const id = computed(() => props.id || `radio-group-${uid}`);
  47. const model = useProxiedModel(props, 'modelValue');
  48. useRender(() => {
  49. const [rootAttrs, controlAttrs] = filterInputAttrs(attrs);
  50. const inputProps = VInput.filterProps(props);
  51. const controlProps = VSelectionControl.filterProps(props);
  52. const label = slots.label ? slots.label({
  53. label: props.label,
  54. props: {
  55. for: id.value
  56. }
  57. }) : props.label;
  58. return _createVNode(VInput, _mergeProps({
  59. "class": ['v-radio-group', props.class],
  60. "style": props.style
  61. }, rootAttrs, inputProps, {
  62. "modelValue": model.value,
  63. "onUpdate:modelValue": $event => model.value = $event,
  64. "id": id.value
  65. }), {
  66. ...slots,
  67. default: _ref2 => {
  68. let {
  69. id,
  70. messagesId,
  71. isDisabled,
  72. isReadonly
  73. } = _ref2;
  74. return _createVNode(_Fragment, null, [label && _createVNode(VLabel, {
  75. "id": id.value
  76. }, {
  77. default: () => [label]
  78. }), _createVNode(VSelectionControlGroup, _mergeProps(controlProps, {
  79. "id": id.value,
  80. "aria-describedby": messagesId.value,
  81. "defaultsTarget": "VRadio",
  82. "trueIcon": props.trueIcon,
  83. "falseIcon": props.falseIcon,
  84. "type": props.type,
  85. "disabled": isDisabled.value,
  86. "readonly": isReadonly.value,
  87. "aria-labelledby": label ? id.value : undefined,
  88. "multiple": false
  89. }, controlAttrs, {
  90. "modelValue": model.value,
  91. "onUpdate:modelValue": $event => model.value = $event
  92. }), slots)]);
  93. }
  94. });
  95. });
  96. return {};
  97. }
  98. });
  99. //# sourceMappingURL=VRadioGroup.mjs.map