ropav 0.12.1 → 0.12.3
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/components/alert-dialog/alert-dialog-container.js +2 -4
- package/dist/components/alert-dialog/alert-dialog-trigger.js +26 -19
- package/dist/components/autocomplete/autocomplete-indicator.js +32 -19
- package/dist/components/autocomplete/autocomplete-value.js +1 -1
- package/dist/components/avatar-group/avatar-group-overflow.js +1 -1
- package/dist/components/breadcrumbs/breadcrumbs-item.js +6 -3
- package/dist/components/button/button-root.js +44 -25
- package/dist/components/calendar/calendar-cell.js +60 -40
- package/dist/components/calendar/calendar-grid.js +17 -9
- package/dist/components/calendar/calendar-nav-button.js +31 -18
- package/dist/components/calendar/calendar-root.js +2 -1
- package/dist/components/calendar-year-picker/calendar-year-picker-grid.js +1 -0
- package/dist/components/close-button/close-button-root.js +45 -26
- package/dist/components/color-area/color-area-root.js +5 -4
- package/dist/components/color-area/color-area-thumb.js +28 -13
- package/dist/components/color-input-group/color-input-group-input.js +31 -19
- package/dist/components/color-picker/color-picker-trigger.js +30 -19
- package/dist/components/color-slider/color-slider-output.js +2 -1
- package/dist/components/color-slider/color-slider-thumb.js +6 -4
- package/dist/components/color-slider/color-slider-track.js +7 -5
- package/dist/components/combo-box/combo-box-trigger.js +33 -20
- package/dist/components/combo-box/combo-box-value.js +1 -1
- package/dist/components/date-input-group/date-input-group-hidden-input.js +2 -1
- package/dist/components/date-input-group/date-input-group-input.js +23 -13
- package/dist/components/date-input-group/date-input-group-root.js +21 -13
- package/dist/components/date-input-group/date-input-group-segment.js +21 -12
- package/dist/components/date-picker/date-picker-trigger.js +19 -10
- package/dist/components/date-range-picker/date-range-picker-trigger.js +19 -10
- package/dist/components/drawer/drawer-content.js +2 -4
- package/dist/components/drawer/drawer-trigger.js +39 -23
- package/dist/components/dropdown/dropdown-menu.js +17 -10
- package/dist/components/dropdown/dropdown-trigger.js +39 -23
- package/dist/components/input/input-root.js +30 -18
- package/dist/components/input-group/input-group-input.js +30 -18
- package/dist/components/input-group/input-group-textarea.js +30 -18
- package/dist/components/input-otp/input-otp-root.js +38 -21
- package/dist/components/list-box/list-box-drop-indicator.js +4 -6
- package/dist/components/list-box-item/list-box-item-root.js +38 -16
- package/dist/components/menu/menu-root.js +17 -9
- package/dist/components/modal/modal-container.js +2 -4
- package/dist/components/modal/modal-trigger.js +26 -19
- package/dist/components/number-field/number-field-decrement-button.js +30 -18
- package/dist/components/number-field/number-field-group.js +25 -13
- package/dist/components/number-field/number-field-increment-button.js +30 -18
- package/dist/components/number-field/number-field-input.js +31 -19
- package/dist/components/popover/popover-trigger.js +31 -19
- package/dist/components/radio-group/radio-group-root.js +2 -1
- package/dist/components/range-calendar/range-calendar-cell.js +65 -43
- package/dist/components/range-calendar/range-calendar-grid.js +17 -9
- package/dist/components/range-calendar/range-calendar-nav-button.js +31 -18
- package/dist/components/range-calendar/range-calendar-root.js +13 -8
- package/dist/components/search-field/search-field-input.js +30 -18
- package/dist/components/search-field/search-field-search-icon.js +1 -1
- package/dist/components/segmented-control/segmented-control-root.js +1 -3
- package/dist/components/segmented-control/segmented-control.types.d.ts +0 -1
- package/dist/components/select/select-trigger.js +36 -22
- package/dist/components/select/select-value.js +1 -1
- package/dist/components/slider/slider-output.js +2 -1
- package/dist/components/slider/slider-root.js +5 -4
- package/dist/components/slider/slider-thumb.js +5 -4
- package/dist/components/splitter/splitter.state.js +6 -1
- package/dist/components/table/table-body.js +1 -1
- package/dist/components/table/table-cell.js +3 -1
- package/dist/components/table/table-column-resizer.js +2 -1
- package/dist/components/table/table-drop-indicator.js +9 -6
- package/dist/components/table/table-load-more.js +1 -1
- package/dist/components/table/table-row.js +9 -6
- package/dist/components/table/use-grid-selection-announcement.js +3 -1
- package/dist/components/table/use-table-collection.js +3 -0
- package/dist/components/tabs/tabs-list-container.js +2 -1
- package/dist/components/tabs/tabs-root.js +1 -3
- package/dist/components/tabs/tabs.types.d.ts +0 -1
- package/dist/components/textarea/textarea-root.js +30 -18
- package/dist/components/toast/toast-default-content.js +1 -1
- package/dist/components/toast/toast-provider.js +19 -13
- package/dist/components/toast/toast-renderable.js +1 -1
- package/dist/components/toast/toast-root.js +10 -1
- package/dist/components/tooltip/tooltip-trigger.js +27 -15
- package/dist/composables/use-calendar-grid.js +2 -1
- package/dist/composables/use-collection.js +12 -0
- package/dist/composables/use-color-field.js +31 -29
- package/dist/composables/use-combo-box-state.js +2 -1
- package/dist/composables/use-combo-box.js +2 -1
- package/dist/composables/use-disclosure-panel.js +2 -1
- package/dist/composables/use-drag.js +9 -6
- package/dist/composables/use-drop.js +2 -1
- package/dist/composables/use-droppable-collection.js +2 -1
- package/dist/composables/use-input-otp.js +5 -2
- package/dist/composables/use-move.js +2 -1
- package/dist/composables/use-single-select-list-state.js +1 -0
- package/dist/composables/use-time-field-state.js +2 -1
- package/dist/composables/use-virtualizer.js +1 -0
- package/dist/ropav.min.css +1 -1
- package/dist/utils/create-context.js +2 -1
- package/dist/utils/platform.js +2 -1
- package/dist/utils/position.js +4 -2
- package/dist/version.js +1 -1
- package/package.json +2 -6
- package/dist/styles-compat-0.10.css +0 -3
|
@@ -41,11 +41,9 @@ var alert_dialog_container_vue_vue_type_script_setup_true_vapor_true_lang_defaul
|
|
|
41
41
|
const onKeydown = (event) => overlay?.onKeydown(event);
|
|
42
42
|
const n4 = t0();
|
|
43
43
|
renderEffect(() => {
|
|
44
|
-
const _dataAttr = unref(dataAttr);
|
|
45
|
-
const _overlay = unref(overlay);
|
|
46
44
|
setClass(n4, styles.value);
|
|
47
|
-
setAttr(n4, "data-entering",
|
|
48
|
-
setAttr(n4, "data-exiting",
|
|
45
|
+
setAttr(n4, "data-entering", unref(dataAttr)(unref(overlay)?.isContentEntering.value));
|
|
46
|
+
setAttr(n4, "data-exiting", unref(dataAttr)(unref(overlay)?.isExiting.value));
|
|
49
47
|
setAttr(n4, "data-placement", props.placement);
|
|
50
48
|
});
|
|
51
49
|
setInsertionState(n4);
|
|
@@ -1,9 +1,10 @@
|
|
|
1
1
|
import { dataAttr } from "../../utils/assertion.js";
|
|
2
2
|
import { useInteractionStates } from "../../composables/use-interaction-states.js";
|
|
3
3
|
import { composePressResponder, usePressResponder } from "../../composables/press-responder.js";
|
|
4
|
-
import { createSlot, defineVaporComponent,
|
|
4
|
+
import { createSlot, defineVaporComponent, renderEffect, setDynamicProps, setInsertionState, setTemplateRefBinding, template, unref } from "vue";
|
|
5
5
|
//#region src/components/alert-dialog/alert-dialog-trigger.vue?vue&type=script&setup=true&vapor=true&lang.ts
|
|
6
6
|
var t0 = template("<div>", 1);
|
|
7
|
+
var k0 = ["data-focus-visible", "data-pressed"];
|
|
7
8
|
var alert_dialog_trigger_vue_vue_type_script_setup_true_vapor_true_lang_default = /*@__PURE__*/ defineVaporComponent({
|
|
8
9
|
__name: "alert-dialog-trigger",
|
|
9
10
|
props: { class: {} },
|
|
@@ -19,27 +20,33 @@ var alert_dialog_trigger_vue_vue_type_script_setup_true_vapor_true_lang_default
|
|
|
19
20
|
renderEffect(() => {
|
|
20
21
|
const _dataAttr = unref(dataAttr);
|
|
21
22
|
const _responder = unref(responder);
|
|
22
|
-
|
|
23
|
-
|
|
24
|
-
|
|
25
|
-
|
|
26
|
-
|
|
27
|
-
|
|
28
|
-
|
|
29
|
-
|
|
23
|
+
const _press = unref(press);
|
|
24
|
+
setDynamicProps(n1, [
|
|
25
|
+
{
|
|
26
|
+
class: ["rp-alert-dialog__trigger", props.class],
|
|
27
|
+
"data-focus-visible": _dataAttr(unref(isFocusVisible)),
|
|
28
|
+
"data-pressed": _dataAttr(_responder?.isPressed.value),
|
|
29
|
+
"data-slot": "alert-dialog-trigger",
|
|
30
|
+
role: "button",
|
|
31
|
+
tabindex: "0"
|
|
32
|
+
},
|
|
33
|
+
_responder?.attrs.value,
|
|
34
|
+
{
|
|
35
|
+
onBlur: (e) => unref(onBlur)(e),
|
|
36
|
+
onClick: (e) => _press.onClick(e),
|
|
37
|
+
onDragstart: (e) => _press.onDragstart(e),
|
|
38
|
+
onFocus: (e) => unref(onFocus)(e),
|
|
39
|
+
onKeydown: (e) => _press.onKeydown(e),
|
|
40
|
+
onMousedown: (e) => _press.onMousedown(e),
|
|
41
|
+
onPointerdown: (e) => _press.onPointerdown(e),
|
|
42
|
+
onPointerenter: (e) => _press.onPointerenter(e),
|
|
43
|
+
onPointerleave: (e) => _press.onPointerleave(e),
|
|
44
|
+
onPointerup: (e) => _press.onPointerup(e)
|
|
45
|
+
}
|
|
46
|
+
], k0);
|
|
30
47
|
});
|
|
31
48
|
setInsertionState(n1);
|
|
32
49
|
createSlot();
|
|
33
|
-
on(n1, "blur", (e) => unref(onBlur)(e));
|
|
34
|
-
on(n1, "click", (e) => unref(press).onClick(e));
|
|
35
|
-
on(n1, "dragstart", (e) => unref(press).onDragstart(e));
|
|
36
|
-
on(n1, "focus", (e) => unref(onFocus)(e));
|
|
37
|
-
on(n1, "keydown", (e) => unref(press).onKeydown(e));
|
|
38
|
-
on(n1, "mousedown", (e) => unref(press).onMousedown(e));
|
|
39
|
-
on(n1, "pointerdown", (e) => unref(press).onPointerdown(e));
|
|
40
|
-
on(n1, "pointerenter", (e) => unref(press).onPointerenter(e));
|
|
41
|
-
on(n1, "pointerleave", (e) => unref(press).onPointerleave(e));
|
|
42
|
-
on(n1, "pointerup", (e) => unref(press).onPointerup(e));
|
|
43
50
|
setTemplateRefBinding(n1, () => setElement);
|
|
44
51
|
return n1;
|
|
45
52
|
}
|
|
@@ -4,9 +4,15 @@ import { composeSlotClassName } from "../../utils/compose.js";
|
|
|
4
4
|
import { useInteractionStates } from "../../composables/use-interaction-states.js";
|
|
5
5
|
import { composePressResponder, usePressResponder } from "../../composables/press-responder.js";
|
|
6
6
|
import { useAutocompleteContext } from "./autocomplete.context.js";
|
|
7
|
-
import { child, computed, createComponent, createIf, createSlot, defineVaporComponent,
|
|
7
|
+
import { child, computed, createComponent, createIf, createSlot, defineVaporComponent, renderEffect, setAttr, setClass, setDynamicProps, setInsertionState, setTemplateRefBinding, template, unref, useSlots } from "vue";
|
|
8
8
|
//#region src/components/autocomplete/autocomplete-indicator.vue?vue&type=script&setup=true&vapor=true&lang.ts
|
|
9
9
|
var t0 = template("<button><span>", 1);
|
|
10
|
+
var k0 = [
|
|
11
|
+
"data-focus-visible",
|
|
12
|
+
"data-focused",
|
|
13
|
+
"data-hovered",
|
|
14
|
+
"data-pressed"
|
|
15
|
+
];
|
|
10
16
|
var autocomplete_indicator_vue_vue_type_script_setup_true_vapor_true_lang_default = /*@__PURE__*/ defineVaporComponent({
|
|
11
17
|
__name: "autocomplete-indicator",
|
|
12
18
|
props: { class: {} },
|
|
@@ -55,13 +61,31 @@ var autocomplete_indicator_vue_vue_type_script_setup_true_vapor_true_lang_defaul
|
|
|
55
61
|
const n5 = child(n6);
|
|
56
62
|
renderEffect(() => {
|
|
57
63
|
const _dataAttr = unref(dataAttr);
|
|
58
|
-
|
|
59
|
-
|
|
60
|
-
|
|
61
|
-
|
|
62
|
-
|
|
63
|
-
|
|
64
|
-
|
|
64
|
+
const _select = unref(select);
|
|
65
|
+
const _press = unref(press);
|
|
66
|
+
setDynamicProps(n6, [
|
|
67
|
+
{
|
|
68
|
+
"data-focus-visible": _dataAttr(unref(isFocusVisible)),
|
|
69
|
+
"data-focused": _dataAttr(unref(isFocused)),
|
|
70
|
+
"data-hovered": _dataAttr(unref(isHovered)),
|
|
71
|
+
"data-pressed": _dataAttr(unref(responder)?.isPressed.value),
|
|
72
|
+
tabindex: "0"
|
|
73
|
+
},
|
|
74
|
+
_select.triggerAttributes.value,
|
|
75
|
+
{
|
|
76
|
+
onBlur: onTriggerBlur,
|
|
77
|
+
onClick: (e) => _press.onClick(e),
|
|
78
|
+
onDragstart: (e) => _press.onDragstart(e),
|
|
79
|
+
onFocus: onTriggerFocus,
|
|
80
|
+
onKeydown,
|
|
81
|
+
onKeydownCapture: (e) => _select.onKeydownCapture(e),
|
|
82
|
+
onMousedown: (e) => _press.onMousedown(e),
|
|
83
|
+
onPointerdown: (e) => _press.onPointerdown(e),
|
|
84
|
+
onPointerenter: (e) => unref(onPointerenter)(e),
|
|
85
|
+
onPointerleave: (e) => unref(onPointerleave)(e),
|
|
86
|
+
onPointerup: (e) => _press.onPointerup(e)
|
|
87
|
+
}
|
|
88
|
+
], k0);
|
|
65
89
|
setClass(n5, styles.value);
|
|
66
90
|
setAttr(n5, "data-open", _dataAttr(unref(state).isOpen.value));
|
|
67
91
|
setAttr(n5, "data-slot", dataSlot.value);
|
|
@@ -72,17 +96,6 @@ var autocomplete_indicator_vue_vue_type_script_setup_true_vapor_true_lang_defaul
|
|
|
72
96
|
}, () => {
|
|
73
97
|
return createComponent(unref(icon_chevron_down_default));
|
|
74
98
|
}, 261);
|
|
75
|
-
on(n6, "blur", onTriggerBlur);
|
|
76
|
-
on(n6, "click", (e) => unref(press).onClick(e));
|
|
77
|
-
on(n6, "dragstart", (e) => unref(press).onDragstart(e));
|
|
78
|
-
on(n6, "focus", onTriggerFocus);
|
|
79
|
-
on(n6, "keydown", onKeydown);
|
|
80
|
-
on(n6, "keydown", (e) => unref(select).onKeydownCapture(e), { capture: true });
|
|
81
|
-
on(n6, "mousedown", (e) => unref(press).onMousedown(e));
|
|
82
|
-
on(n6, "pointerdown", (e) => unref(press).onPointerdown(e));
|
|
83
|
-
on(n6, "pointerenter", (e) => unref(onPointerenter)(e));
|
|
84
|
-
on(n6, "pointerleave", (e) => unref(onPointerleave)(e));
|
|
85
|
-
on(n6, "pointerup", (e) => unref(press).onPointerup(e));
|
|
86
99
|
setTemplateRefBinding(n6, () => setElement);
|
|
87
100
|
return n6;
|
|
88
101
|
}
|
|
@@ -47,7 +47,7 @@ var autocomplete_value_vue_vue_type_script_setup_true_vapor_true_lang_default =
|
|
|
47
47
|
const n4 = t0();
|
|
48
48
|
renderEffect(() => setText(n4, toDisplayString(isPlaceholder.value ? unref(placeholder) : unref(selectedText))));
|
|
49
49
|
return n4;
|
|
50
|
-
},
|
|
50
|
+
}, 265);
|
|
51
51
|
return n5;
|
|
52
52
|
}
|
|
53
53
|
});
|
|
@@ -33,7 +33,7 @@ var avatar_group_overflow_vue_vue_type_script_setup_true_vapor_true_lang_default
|
|
|
33
33
|
const n5 = t0();
|
|
34
34
|
renderEffect(() => setText(n5, "+" + toDisplayString(props.count)));
|
|
35
35
|
return n5;
|
|
36
|
-
}, null,
|
|
36
|
+
}, null, 130), 389);
|
|
37
37
|
}, { _: 1 }));
|
|
38
38
|
}, true);
|
|
39
39
|
}
|
|
@@ -8,6 +8,7 @@ import { computed, createComponent, createDynamicComponent, createIf, createSlot
|
|
|
8
8
|
//#region src/components/breadcrumbs/breadcrumbs-item.vue?vue&type=script&setup=true&vapor=true&lang.ts
|
|
9
9
|
var t0 = template(" ");
|
|
10
10
|
var t1 = template("<li>", 1);
|
|
11
|
+
var k0 = ["data-current", "data-disabled"];
|
|
11
12
|
var breadcrumbs_item_vue_vue_type_script_setup_true_vapor_true_lang_default = /*@__PURE__*/ defineVaporComponent({
|
|
12
13
|
inheritAttrs: false,
|
|
13
14
|
__name: "breadcrumbs-item",
|
|
@@ -54,6 +55,8 @@ var breadcrumbs_item_vue_vue_type_script_setup_true_vapor_true_lang_default = /*
|
|
|
54
55
|
immediate: true
|
|
55
56
|
});
|
|
56
57
|
const isCurrent = computed(() => {
|
|
58
|
+
context.collection.size.value;
|
|
59
|
+
context.orderVersion.value;
|
|
57
60
|
return context.collection.getLastKey() === itemKey.value;
|
|
58
61
|
});
|
|
59
62
|
const isDisabled = computed(() => Boolean(props.isDisabled || context.isDisabled.value || isCurrent.value));
|
|
@@ -74,7 +77,7 @@ var breadcrumbs_item_vue_vue_type_script_setup_true_vapor_true_lang_default = /*
|
|
|
74
77
|
"data-current": _dataAttr(isCurrent.value),
|
|
75
78
|
"data-disabled": _dataAttr(isDisabled.value),
|
|
76
79
|
"data-slot": "breadcrumbs-item"
|
|
77
|
-
}, $attrs]);
|
|
80
|
+
}, $attrs], k0);
|
|
78
81
|
});
|
|
79
82
|
setInsertionState(n13);
|
|
80
83
|
createComponent(unref(link_root_default), {
|
|
@@ -115,8 +118,8 @@ var breadcrumbs_item_vue_vue_type_script_setup_true_vapor_true_lang_default = /*
|
|
|
115
118
|
class: () => unref(context).slots.value.separator(),
|
|
116
119
|
"data-slot": "breadcrumbs-separator"
|
|
117
120
|
});
|
|
118
|
-
},
|
|
119
|
-
});
|
|
121
|
+
}, 518), 261);
|
|
122
|
+
}, null, 2);
|
|
120
123
|
setStaticTemplateRef(n13, element, null, "element");
|
|
121
124
|
return n13;
|
|
122
125
|
}
|
|
@@ -5,10 +5,22 @@ import { composePressResponder, usePressResponder } from "../../composables/pres
|
|
|
5
5
|
import { useFieldsetContext } from "../fieldset/fieldset.context.js";
|
|
6
6
|
import { announce } from "../../utils/live-announcer.js";
|
|
7
7
|
import { useButtonGroupContext } from "../button-group/button-group.context.js";
|
|
8
|
-
import { computed, createSlot, defineVaporComponent,
|
|
8
|
+
import { computed, createSlot, defineVaporComponent, renderEffect, setDynamicProps, setInsertionState, setTemplateRefBinding, template, unref, watch } from "vue";
|
|
9
9
|
import { buttonVariants } from "@ropav/styles";
|
|
10
10
|
//#region src/components/button/button-root.vue?vue&type=script&setup=true&vapor=true&lang.ts
|
|
11
11
|
var t0 = template("<button>", 1);
|
|
12
|
+
var k0 = [
|
|
13
|
+
"aria-disabled",
|
|
14
|
+
"data-disabled",
|
|
15
|
+
"data-focus-visible",
|
|
16
|
+
"data-focused",
|
|
17
|
+
"data-hovered",
|
|
18
|
+
"data-pending",
|
|
19
|
+
"data-pressed",
|
|
20
|
+
"disabled",
|
|
21
|
+
"tabindex",
|
|
22
|
+
"type"
|
|
23
|
+
];
|
|
12
24
|
var button_root_vue_vue_type_script_setup_true_vapor_true_lang_default = /*@__PURE__*/ defineVaporComponent({
|
|
13
25
|
__name: "button-root",
|
|
14
26
|
props: {
|
|
@@ -104,20 +116,37 @@ var button_root_vue_vue_type_script_setup_true_vapor_true_lang_default = /*@__PU
|
|
|
104
116
|
const _props = props;
|
|
105
117
|
const _dataAttr = unref(dataAttr);
|
|
106
118
|
const _resolvedIsDisabled = resolvedIsDisabled.value;
|
|
107
|
-
|
|
108
|
-
|
|
109
|
-
|
|
110
|
-
|
|
111
|
-
|
|
112
|
-
|
|
113
|
-
|
|
114
|
-
|
|
115
|
-
|
|
116
|
-
|
|
117
|
-
|
|
118
|
-
|
|
119
|
-
|
|
120
|
-
|
|
119
|
+
const _focus = unref(focus);
|
|
120
|
+
const _press = unref(press);
|
|
121
|
+
setDynamicProps(n1, [
|
|
122
|
+
{
|
|
123
|
+
"aria-disabled": _props.isPending || void 0,
|
|
124
|
+
class: styles.value,
|
|
125
|
+
"data-disabled": _dataAttr(_resolvedIsDisabled),
|
|
126
|
+
"data-focus-visible": _dataAttr(unref(isFocusVisible)),
|
|
127
|
+
"data-focused": _dataAttr(unref(isFocused)),
|
|
128
|
+
"data-hovered": _dataAttr(unref(isHovered)),
|
|
129
|
+
"data-pending": _dataAttr(_props.isPending),
|
|
130
|
+
"data-pressed": _dataAttr(unref(isPressed) || unref(responder)?.isPressed.value),
|
|
131
|
+
"data-slot": "button",
|
|
132
|
+
disabled: _resolvedIsDisabled || void 0,
|
|
133
|
+
tabindex: tabindex.value,
|
|
134
|
+
type: type.value
|
|
135
|
+
},
|
|
136
|
+
attrs.value,
|
|
137
|
+
{
|
|
138
|
+
onBlur: (e) => _focus.onBlur(e),
|
|
139
|
+
onClick: (e) => _press.onClick(e),
|
|
140
|
+
onDragstart: (e) => _press.onDragstart(e),
|
|
141
|
+
onFocus: (e) => _focus.onFocus(e),
|
|
142
|
+
onKeydown: (e) => _press.onKeydown(e),
|
|
143
|
+
onMousedown: (e) => _press.onMousedown(e),
|
|
144
|
+
onPointerdown: (e) => _press.onPointerdown(e),
|
|
145
|
+
onPointerenter: (e) => _press.onPointerenter(e),
|
|
146
|
+
onPointerleave: (e) => _press.onPointerleave(e),
|
|
147
|
+
onPointerup: (e) => _press.onPointerup(e)
|
|
148
|
+
}
|
|
149
|
+
], k0);
|
|
121
150
|
});
|
|
122
151
|
setInsertionState(n1);
|
|
123
152
|
createSlot("default", {
|
|
@@ -127,16 +156,6 @@ var button_root_vue_vue_type_script_setup_true_vapor_true_lang_default = /*@__PU
|
|
|
127
156
|
isPending: () => Boolean(props.isPending),
|
|
128
157
|
isPressed: () => unref(isPressed)
|
|
129
158
|
});
|
|
130
|
-
on(n1, "blur", (e) => unref(focus).onBlur(e));
|
|
131
|
-
on(n1, "click", (e) => unref(press).onClick(e));
|
|
132
|
-
on(n1, "dragstart", (e) => unref(press).onDragstart(e));
|
|
133
|
-
on(n1, "focus", (e) => unref(focus).onFocus(e));
|
|
134
|
-
on(n1, "keydown", (e) => unref(press).onKeydown(e));
|
|
135
|
-
on(n1, "mousedown", (e) => unref(press).onMousedown(e));
|
|
136
|
-
on(n1, "pointerdown", (e) => unref(press).onPointerdown(e));
|
|
137
|
-
on(n1, "pointerenter", (e) => unref(press).onPointerenter(e));
|
|
138
|
-
on(n1, "pointerleave", (e) => unref(press).onPointerleave(e));
|
|
139
|
-
on(n1, "pointerup", (e) => unref(press).onPointerup(e));
|
|
140
159
|
setTemplateRefBinding(n1, () => setElement);
|
|
141
160
|
return n1;
|
|
142
161
|
}
|
|
@@ -2,11 +2,24 @@ import { dataAttr } from "../../utils/assertion.js";
|
|
|
2
2
|
import { useInteractionStates } from "../../composables/use-interaction-states.js";
|
|
3
3
|
import { useCalendarCell } from "../../composables/use-calendar-cell.js";
|
|
4
4
|
import { useCalendarGridContext, useCalendarStateContext } from "./calendar.context.js";
|
|
5
|
-
import { child, computed, createSlot, defineVaporComponent,
|
|
5
|
+
import { child, computed, createSlot, defineVaporComponent, renderEffect, setDynamicProps, setInsertionState, setStaticTemplateRef, setText, shallowRef, template, toDisplayString, unref } from "vue";
|
|
6
6
|
import { isSameMonth } from "@internationalized/date";
|
|
7
7
|
//#region src/components/calendar/calendar-cell.vue?vue&type=script&setup=true&vapor=true&lang.ts
|
|
8
8
|
var t0 = template(" ");
|
|
9
9
|
var t1 = template("<td><div>", 1);
|
|
10
|
+
var k0 = [
|
|
11
|
+
"data-disabled",
|
|
12
|
+
"data-focus-visible",
|
|
13
|
+
"data-focused",
|
|
14
|
+
"data-hovered",
|
|
15
|
+
"data-invalid",
|
|
16
|
+
"data-outside-month",
|
|
17
|
+
"data-outside-visible-range",
|
|
18
|
+
"data-pressed",
|
|
19
|
+
"data-selected",
|
|
20
|
+
"data-today",
|
|
21
|
+
"data-unavailable"
|
|
22
|
+
];
|
|
10
23
|
var calendar_cell_vue_vue_type_script_setup_true_vapor_true_lang_default = /*@__PURE__*/ defineVaporComponent({
|
|
11
24
|
__name: "calendar-cell",
|
|
12
25
|
props: {
|
|
@@ -56,22 +69,53 @@ var calendar_cell_vue_vue_type_script_setup_true_vapor_true_lang_default = /*@__
|
|
|
56
69
|
renderEffect(() => {
|
|
57
70
|
const _cell = unref(cell);
|
|
58
71
|
const _dataAttr = unref(dataAttr);
|
|
72
|
+
const _interaction = unref(interaction);
|
|
73
|
+
const _cell_handlers = _cell.handlers;
|
|
59
74
|
setDynamicProps(n4, [_cell.cellAttrs.value]);
|
|
60
|
-
setDynamicProps(n3, [
|
|
61
|
-
|
|
62
|
-
|
|
63
|
-
|
|
64
|
-
|
|
65
|
-
|
|
66
|
-
|
|
67
|
-
|
|
68
|
-
|
|
69
|
-
|
|
70
|
-
|
|
71
|
-
|
|
72
|
-
|
|
73
|
-
|
|
74
|
-
|
|
75
|
+
setDynamicProps(n3, [
|
|
76
|
+
{
|
|
77
|
+
class: ["rp-calendar__cell", props.class],
|
|
78
|
+
"data-disabled": _dataAttr(_cell.isDisabled.value),
|
|
79
|
+
"data-focus-visible": _dataAttr(isFocusVisible.value),
|
|
80
|
+
"data-focused": _dataAttr(_cell.isFocused.value),
|
|
81
|
+
"data-hovered": _dataAttr(_interaction.isHovered.value),
|
|
82
|
+
"data-invalid": _dataAttr(_cell.isInvalid.value),
|
|
83
|
+
"data-outside-month": _dataAttr(isOutsideMonth.value),
|
|
84
|
+
"data-outside-visible-range": _dataAttr(_cell.isOutsideVisibleRange.value),
|
|
85
|
+
"data-pressed": _dataAttr(_cell.isPressed.value),
|
|
86
|
+
"data-selected": _dataAttr(_cell.isSelected.value),
|
|
87
|
+
"data-slot": "calendar-cell",
|
|
88
|
+
"data-today": _dataAttr(_cell.isToday.value),
|
|
89
|
+
"data-unavailable": _dataAttr(_cell.isUnavailable.value)
|
|
90
|
+
},
|
|
91
|
+
_cell.buttonAttrs.value,
|
|
92
|
+
{
|
|
93
|
+
onBlur: (e) => _interaction.onBlur(e),
|
|
94
|
+
onClick: (e) => _cell_handlers.onClick(e),
|
|
95
|
+
onContextmenu: (e) => _cell_handlers.onContextmenu(e),
|
|
96
|
+
onDragstart: (e) => _cell_handlers.onDragstart(e),
|
|
97
|
+
onFocus: () => {
|
|
98
|
+
_interaction.onFocus();
|
|
99
|
+
_cell_handlers.onFocus();
|
|
100
|
+
},
|
|
101
|
+
onKeydown: (e) => _cell_handlers.onKeydown(e),
|
|
102
|
+
onMousedown: (e) => _cell_handlers.onMousedown(e),
|
|
103
|
+
onPointercancel: (e) => _cell_handlers.onPointerleave(e),
|
|
104
|
+
onPointerdown: (event) => {
|
|
105
|
+
_interaction.onPointerdown(event);
|
|
106
|
+
_cell_handlers.onPointerdown(event);
|
|
107
|
+
},
|
|
108
|
+
onPointerenter: (event) => {
|
|
109
|
+
_interaction.onPointerenter(event);
|
|
110
|
+
_cell_handlers.onPointerenter(event);
|
|
111
|
+
},
|
|
112
|
+
onPointerleave: (event) => {
|
|
113
|
+
_interaction.onPointerleave();
|
|
114
|
+
_cell_handlers.onPointerleave(event);
|
|
115
|
+
},
|
|
116
|
+
onPointerup: (e) => _cell_handlers.onPointerup(e)
|
|
117
|
+
}
|
|
118
|
+
], k0);
|
|
75
119
|
});
|
|
76
120
|
setInsertionState(n3);
|
|
77
121
|
createSlot("default", { $: [() => slotProps.value] }, () => {
|
|
@@ -79,30 +123,6 @@ var calendar_cell_vue_vue_type_script_setup_true_vapor_true_lang_default = /*@__
|
|
|
79
123
|
renderEffect(() => setText(n2, toDisplayString(unref(cell).formattedDate.value)));
|
|
80
124
|
return n2;
|
|
81
125
|
});
|
|
82
|
-
on(n3, "blur", (e) => unref(interaction).onBlur(e));
|
|
83
|
-
on(n3, "click", (e) => unref(cell).handlers.onClick(e));
|
|
84
|
-
on(n3, "contextmenu", (e) => unref(cell).handlers.onContextmenu(e));
|
|
85
|
-
on(n3, "dragstart", (e) => unref(cell).handlers.onDragstart(e));
|
|
86
|
-
on(n3, "focus", () => {
|
|
87
|
-
unref(interaction).onFocus();
|
|
88
|
-
unref(cell).handlers.onFocus();
|
|
89
|
-
});
|
|
90
|
-
on(n3, "keydown", (e) => unref(cell).handlers.onKeydown(e));
|
|
91
|
-
on(n3, "mousedown", (e) => unref(cell).handlers.onMousedown(e));
|
|
92
|
-
on(n3, "pointercancel", (e) => unref(cell).handlers.onPointerleave(e));
|
|
93
|
-
on(n3, "pointerdown", (event) => {
|
|
94
|
-
unref(interaction).onPointerdown(event);
|
|
95
|
-
unref(cell).handlers.onPointerdown(event);
|
|
96
|
-
});
|
|
97
|
-
on(n3, "pointerenter", (event) => {
|
|
98
|
-
unref(interaction).onPointerenter(event);
|
|
99
|
-
unref(cell).handlers.onPointerenter(event);
|
|
100
|
-
});
|
|
101
|
-
on(n3, "pointerleave", (event) => {
|
|
102
|
-
unref(interaction).onPointerleave();
|
|
103
|
-
unref(cell).handlers.onPointerleave(event);
|
|
104
|
-
});
|
|
105
|
-
on(n3, "pointerup", (e) => unref(cell).handlers.onPointerup(e));
|
|
106
126
|
setStaticTemplateRef(n3, element, null, "element");
|
|
107
127
|
return n4;
|
|
108
128
|
}
|
|
@@ -1,7 +1,7 @@
|
|
|
1
1
|
import { provideCalendarContext, provideCalendarGridContext, useCalendarContext, useCalendarStateContext } from "./calendar.context.js";
|
|
2
2
|
import { DEFAULT_WEEKDAY_STYLE } from "../../utils/calendar.js";
|
|
3
3
|
import { useCalendarGrid } from "../../composables/use-calendar-grid.js";
|
|
4
|
-
import { computed, createSlot, defineVaporComponent,
|
|
4
|
+
import { computed, createSlot, defineVaporComponent, renderEffect, setDynamicProps, setInsertionState, template, unref } from "vue";
|
|
5
5
|
import { endOfMonth } from "@internationalized/date";
|
|
6
6
|
//#region src/components/calendar/calendar-grid.vue?vue&type=script&setup=true&vapor=true&lang.ts
|
|
7
7
|
var t0 = template("<table>", 1);
|
|
@@ -45,16 +45,24 @@ var calendar_grid_vue_vue_type_script_setup_true_vapor_true_lang_default = /*@__
|
|
|
45
45
|
weeksInMonth: grid.weeksInMonth
|
|
46
46
|
});
|
|
47
47
|
const n1 = t0();
|
|
48
|
-
renderEffect(() =>
|
|
49
|
-
|
|
50
|
-
|
|
51
|
-
|
|
52
|
-
|
|
48
|
+
renderEffect(() => {
|
|
49
|
+
const _grid = unref(grid);
|
|
50
|
+
setDynamicProps(n1, [
|
|
51
|
+
{
|
|
52
|
+
cellpadding: "0",
|
|
53
|
+
class: styles.value,
|
|
54
|
+
"data-slot": "calendar-grid"
|
|
55
|
+
},
|
|
56
|
+
_grid.attrs.value,
|
|
57
|
+
{
|
|
58
|
+
onFocusin: (e) => _grid.onFocusin(e),
|
|
59
|
+
onFocusout: (e) => _grid.onFocusout(e),
|
|
60
|
+
onKeydown: (e) => _grid.onKeydown(e)
|
|
61
|
+
}
|
|
62
|
+
]);
|
|
63
|
+
});
|
|
53
64
|
setInsertionState(n1);
|
|
54
65
|
createSlot();
|
|
55
|
-
on(n1, "focusin", (e) => unref(grid).onFocusin(e));
|
|
56
|
-
on(n1, "focusout", (e) => unref(grid).onFocusout(e));
|
|
57
|
-
on(n1, "keydown", (e) => unref(grid).onKeydown(e));
|
|
58
66
|
return n1;
|
|
59
67
|
}
|
|
60
68
|
});
|
|
@@ -3,9 +3,16 @@ import icon_chevron_left_default from "../icons/icon-chevron-left.js";
|
|
|
3
3
|
import icon_chevron_right_default from "../icons/icon-chevron-right.js";
|
|
4
4
|
import { useInteractionStates } from "../../composables/use-interaction-states.js";
|
|
5
5
|
import { useCalendarStateContext } from "./calendar.context.js";
|
|
6
|
-
import { computed, createComponent, createIf, createSlot, defineVaporComponent,
|
|
6
|
+
import { computed, createComponent, createIf, createSlot, defineVaporComponent, renderEffect, setDynamicProps, setInsertionState, template, unref } from "vue";
|
|
7
7
|
//#region src/components/calendar/calendar-nav-button.vue?vue&type=script&setup=true&vapor=true&lang.ts
|
|
8
8
|
var t0 = template("<button>", 1);
|
|
9
|
+
var k0 = [
|
|
10
|
+
"data-disabled",
|
|
11
|
+
"data-focus-visible",
|
|
12
|
+
"data-hovered",
|
|
13
|
+
"data-pressed",
|
|
14
|
+
"disabled"
|
|
15
|
+
];
|
|
9
16
|
var calendar_nav_button_vue_vue_type_script_setup_true_vapor_true_lang_default = /*@__PURE__*/ defineVaporComponent({
|
|
10
17
|
__name: "calendar-nav-button",
|
|
11
18
|
props: {
|
|
@@ -36,16 +43,29 @@ var calendar_nav_button_vue_vue_type_script_setup_true_vapor_true_lang_default =
|
|
|
36
43
|
const _button = button.value;
|
|
37
44
|
const _interaction = unref(interaction);
|
|
38
45
|
const _button_isDisabled = _button.isDisabled;
|
|
39
|
-
|
|
40
|
-
|
|
41
|
-
|
|
42
|
-
|
|
43
|
-
|
|
44
|
-
|
|
45
|
-
|
|
46
|
-
|
|
47
|
-
|
|
48
|
-
|
|
46
|
+
const _interaction_onPointerleave = _interaction.onPointerleave;
|
|
47
|
+
setDynamicProps(n8, [
|
|
48
|
+
{
|
|
49
|
+
class: ["rp-calendar__nav-button", props.class],
|
|
50
|
+
"data-disabled": _dataAttr(_button_isDisabled.value),
|
|
51
|
+
"data-focus-visible": _dataAttr(_interaction.isFocusVisible.value),
|
|
52
|
+
"data-hovered": _dataAttr(_interaction.isHovered.value),
|
|
53
|
+
"data-pressed": _dataAttr(_interaction.isPressed.value),
|
|
54
|
+
"data-slot": "calendar-nav-button",
|
|
55
|
+
disabled: _button_isDisabled.value || void 0,
|
|
56
|
+
type: "button"
|
|
57
|
+
},
|
|
58
|
+
attrs.value,
|
|
59
|
+
{
|
|
60
|
+
onBlur,
|
|
61
|
+
onClick,
|
|
62
|
+
onFocus,
|
|
63
|
+
onPointercancel: (e) => _interaction_onPointerleave(e),
|
|
64
|
+
onPointerdown: (e) => _interaction.onPointerdown(e),
|
|
65
|
+
onPointerenter: (e) => _interaction.onPointerenter(e),
|
|
66
|
+
onPointerleave: (e) => _interaction_onPointerleave(e)
|
|
67
|
+
}
|
|
68
|
+
], k0);
|
|
49
69
|
});
|
|
50
70
|
setInsertionState(n8);
|
|
51
71
|
createSlot("default", null, () => {
|
|
@@ -61,13 +81,6 @@ var calendar_nav_button_vue_vue_type_script_setup_true_vapor_true_lang_default =
|
|
|
61
81
|
});
|
|
62
82
|
}, 261);
|
|
63
83
|
});
|
|
64
|
-
on(n8, "blur", onBlur);
|
|
65
|
-
on(n8, "click", onClick);
|
|
66
|
-
on(n8, "focus", onFocus);
|
|
67
|
-
on(n8, "pointercancel", (e) => unref(interaction).onPointerleave(e));
|
|
68
|
-
on(n8, "pointerdown", (e) => unref(interaction).onPointerdown(e));
|
|
69
|
-
on(n8, "pointerenter", (e) => unref(interaction).onPointerenter(e));
|
|
70
|
-
on(n8, "pointerleave", (e) => unref(interaction).onPointerleave(e));
|
|
71
84
|
return n8;
|
|
72
85
|
}
|
|
73
86
|
});
|
|
@@ -12,6 +12,7 @@ import { calendarVariants } from "@ropav/styles";
|
|
|
12
12
|
import { DateFormatter, GregorianCalendar } from "@internationalized/date";
|
|
13
13
|
//#region src/components/calendar/calendar-root.vue?vue&type=script&setup=true&vapor=true&lang.ts
|
|
14
14
|
var t0 = template("<div><div><h2> </div><!><div><button tabindex=-1 type=button>", 1);
|
|
15
|
+
var k0 = ["data-disabled", "data-invalid"];
|
|
15
16
|
var calendar_root_vue_vue_type_script_setup_true_vapor_true_lang_default = /*@__PURE__*/ defineVaporComponent({
|
|
16
17
|
__name: "calendar-root",
|
|
17
18
|
props: {
|
|
@@ -184,7 +185,7 @@ var calendar_root_vue_vue_type_script_setup_true_vapor_true_lang_default = /*@__
|
|
|
184
185
|
"data-disabled": _dataAttr(props.isDisabled ?? owned.value.isDisabled),
|
|
185
186
|
"data-invalid": _dataAttr(unref(state).isValueInvalid.value),
|
|
186
187
|
"data-slot": "calendar"
|
|
187
|
-
}, _calendar_attrs.value]);
|
|
188
|
+
}, _calendar_attrs.value], k0);
|
|
188
189
|
setStyle(n1, unref(visuallyHiddenStyle));
|
|
189
190
|
setText(x0, toDisplayString(_calendar_attrs.value["aria-label"]));
|
|
190
191
|
});
|
|
@@ -55,6 +55,7 @@ var calendar_year_picker_grid_vue_vue_type_script_setup_true_vapor_true_lang_def
|
|
|
55
55
|
const grid = element.value;
|
|
56
56
|
const calendar = calendarElement.value;
|
|
57
57
|
if (!grid || !calendar) return;
|
|
58
|
+
state.focusedDate.value;
|
|
58
59
|
const dayGrid = calendar.querySelector(`[data-slot='${calendarGridSlot}']`);
|
|
59
60
|
if (!dayGrid) return;
|
|
60
61
|
grid.style.top = `${dayGrid.offsetTop}px`;
|