ropav 0.0.6 → 0.0.7
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/_plugin-vue_export-helper.js +1 -11
- package/dist/accordion.css +112 -0
- package/dist/accordion.js +360 -0
- package/dist/accordion.js.map +1 -0
- package/dist/badge.css +169 -0
- package/dist/badge.js +103 -0
- package/dist/badge.js.map +1 -0
- package/dist/bem.js +11 -0
- package/dist/bem.js.map +1 -0
- package/dist/button-group.css +8 -8
- package/dist/button-group.js +2 -1
- package/dist/button-group.js.map +1 -1
- package/dist/button.js +3 -2
- package/dist/button.js.map +1 -1
- package/dist/card.js +2 -1
- package/dist/card.js.map +1 -1
- package/dist/checkbox.js +2 -1
- package/dist/checkbox.js.map +1 -1
- package/dist/collapse.css +32 -0
- package/dist/collapse.js +68 -0
- package/dist/collapse.js.map +1 -0
- package/dist/components/accordion/accordion-item.d.ts +40 -0
- package/dist/components/accordion/accordion.d.ts +23 -0
- package/dist/components/accordion/index.d.ts +4 -0
- package/dist/components/accordion/index.js +2 -0
- package/dist/components/accordion/types.d.ts +100 -0
- package/dist/components/accordion/useAccordion.d.ts +3 -0
- package/dist/components/badge/badge.d.ts +25 -0
- package/dist/components/badge/index.d.ts +3 -0
- package/dist/components/badge/index.js +2 -0
- package/dist/components/badge/types.d.ts +16 -0
- package/dist/components/badge/useBadgeColor.d.ts +8 -0
- package/dist/components/collapse/collapse.d.ts +36 -0
- package/dist/components/collapse/index.d.ts +3 -0
- package/dist/components/collapse/index.js +3 -0
- package/dist/components/collapse/types.d.ts +76 -0
- package/dist/components/collapse/useCollapse.d.ts +2 -0
- package/dist/components/dropdown-menu/dropdown-menu-items.d.ts +16 -0
- package/dist/components/dropdown-menu/dropdown-menu-utils.d.ts +23 -0
- package/dist/components/dropdown-menu/dropdown-menu.d.ts +26 -0
- package/dist/components/dropdown-menu/index.d.ts +3 -0
- package/dist/components/dropdown-menu/index.js +2 -0
- package/dist/components/dropdown-menu/types.d.ts +104 -0
- package/dist/components/dropdown-menu/useDropdownMenu.d.ts +32 -0
- package/dist/components/dropdown-menu/useDropdownMenuDisclosure.d.ts +30 -0
- package/dist/components/dropdown-menu/useDropdownMenuDom.d.ts +28 -0
- package/dist/components/dropdown-menu/useDropdownMenuHoverIntent.d.ts +24 -0
- package/dist/components/dropdown-menu/useDropdownMenuInteractions.d.ts +51 -0
- package/dist/components/dropdown-menu/useDropdownMenuNavigation.d.ts +16 -0
- package/dist/components/dropdown-menu/useDropdownMenuRenderItems.d.ts +25 -0
- package/dist/components/dropdown-menu/useDropdownSubmenus.d.ts +18 -0
- package/dist/components/field/field.d.ts +2 -2
- package/dist/components/field/useField.d.ts +16 -0
- package/dist/components/input/useInput.d.ts +8 -0
- package/dist/components/modal/index.d.ts +2 -0
- package/dist/components/modal/index.js +2 -0
- package/dist/components/modal/modal.d.ts +42 -0
- package/dist/components/modal/types.d.ts +32 -0
- package/dist/components/modal/useModal.d.ts +29 -0
- package/dist/components/overlay/index.d.ts +2 -0
- package/dist/components/overlay/index.js +2 -0
- package/dist/components/overlay/overlay.d.ts +19 -0
- package/dist/components/overlay/types.d.ts +12 -0
- package/dist/components/overlay/useOverlay.d.ts +7 -0
- package/dist/components/popover/index.d.ts +2 -0
- package/dist/components/popover/index.js +2 -0
- package/dist/components/popover/popover.d.ts +43 -0
- package/dist/components/popover/types.d.ts +40 -0
- package/dist/components/popover/usePopover.d.ts +20 -0
- package/dist/components/tabs/index.d.ts +6 -0
- package/dist/components/tabs/index.js +2 -0
- package/dist/components/tabs/tabs-content.d.ts +24 -0
- package/dist/components/tabs/tabs-list.d.ts +26 -0
- package/dist/components/tabs/tabs-trigger.d.ts +29 -0
- package/dist/components/tabs/tabs.d.ts +31 -0
- package/dist/components/tabs/types.d.ts +160 -0
- package/dist/components/tabs/useTabs.d.ts +5 -0
- package/dist/dropdown-menu.css +159 -0
- package/dist/dropdown-menu.js +903 -0
- package/dist/dropdown-menu.js.map +1 -0
- package/dist/field.css +8 -8
- package/dist/field.js +68 -50
- package/dist/field.js.map +1 -1
- package/dist/icon-button.css +1 -1
- package/dist/icon-button.js +3 -2
- package/dist/icon-button.js.map +1 -1
- package/dist/index.d.ts +8 -0
- package/dist/index.js +12 -1
- package/dist/input.css +25 -25
- package/dist/input.js +57 -38
- package/dist/input.js.map +1 -1
- package/dist/modal.css +134 -0
- package/dist/modal.js +433 -0
- package/dist/modal.js.map +1 -0
- package/dist/overlay.css +28 -0
- package/dist/overlay.js +84 -0
- package/dist/overlay.js.map +1 -0
- package/dist/popover.css +75 -0
- package/dist/popover.js +367 -0
- package/dist/popover.js.map +1 -0
- package/dist/progress.js +2 -1
- package/dist/progress.js.map +1 -1
- package/dist/radio.js +4 -9
- package/dist/radio.js.map +1 -1
- package/dist/select.js +8 -37
- package/dist/select.js.map +1 -1
- package/dist/slider.js +2 -1
- package/dist/slider.js.map +1 -1
- package/dist/switch.js +2 -1
- package/dist/switch.js.map +1 -1
- package/dist/tabs.css +279 -0
- package/dist/tabs.js +515 -0
- package/dist/tabs.js.map +1 -0
- package/dist/textarea.js +2 -1
- package/dist/textarea.js.map +1 -1
- package/dist/tooltip.js +2 -1
- package/dist/tooltip.js.map +1 -1
- package/dist/useClickOutside.js +26 -0
- package/dist/useClickOutside.js.map +1 -0
- package/dist/useCollapse.js +94 -0
- package/dist/useCollapse.js.map +1 -0
- package/dist/useRequiredInject.js +11 -0
- package/dist/useRequiredInject.js.map +1 -0
- package/dist/x.js +14 -0
- package/dist/x.js.map +1 -0
- package/package.json +35 -3
- package/dist/_plugin-vue_export-helper.js.map +0 -1
|
@@ -1,11 +1,3 @@
|
|
|
1
|
-
//#region src/utils/bem.ts
|
|
2
|
-
function bem(block, ...modifiers) {
|
|
3
|
-
const classes = [block];
|
|
4
|
-
for (const mod of modifiers) if (typeof mod === "string") classes.push(`${block}--${mod}`);
|
|
5
|
-
else for (const [key, val] of Object.entries(mod)) if (val) classes.push(`${block}--${key}`);
|
|
6
|
-
return classes;
|
|
7
|
-
}
|
|
8
|
-
//#endregion
|
|
9
1
|
//#region \0plugin-vue:export-helper
|
|
10
2
|
var _plugin_vue_export_helper_default = (sfc, props) => {
|
|
11
3
|
const target = sfc.__vccOpts || sfc;
|
|
@@ -13,6 +5,4 @@ var _plugin_vue_export_helper_default = (sfc, props) => {
|
|
|
13
5
|
return target;
|
|
14
6
|
};
|
|
15
7
|
//#endregion
|
|
16
|
-
export {
|
|
17
|
-
|
|
18
|
-
//# sourceMappingURL=_plugin-vue_export-helper.js.map
|
|
8
|
+
export { _plugin_vue_export_helper_default as t };
|
|
@@ -0,0 +1,112 @@
|
|
|
1
|
+
.rp-accordion[data-v-c0aaa9d9] {
|
|
2
|
+
--_rp-accordion-radius: var(--rp-radius-sm);
|
|
3
|
+
--_rp-accordion-duration: var(--rp-transition-fast);
|
|
4
|
+
box-sizing: border-box;
|
|
5
|
+
display: grid;
|
|
6
|
+
min-width: 0;
|
|
7
|
+
overflow: hidden;
|
|
8
|
+
font-family: var(--rp-font-family);
|
|
9
|
+
color: var(--rp-color-text);
|
|
10
|
+
background-color: var(--rp-color-surface-raised);
|
|
11
|
+
border: var(--rp-border-width-thin) solid var(--rp-color-border);
|
|
12
|
+
border-radius: var(--_rp-accordion-radius);
|
|
13
|
+
}
|
|
14
|
+
.rp-accordion--disabled[data-v-c0aaa9d9] {
|
|
15
|
+
opacity: var(--rp-opacity-disabled);
|
|
16
|
+
cursor: not-allowed;
|
|
17
|
+
}
|
|
18
|
+
.rp-accordion--horizontal[data-v-c0aaa9d9] {
|
|
19
|
+
display: flex;
|
|
20
|
+
align-items: stretch;
|
|
21
|
+
}.rp-accordion-item[data-v-8528e537] {
|
|
22
|
+
--_rp-accordion-duration: var(--rp-transition-fast);
|
|
23
|
+
box-sizing: border-box;
|
|
24
|
+
min-width: 0;
|
|
25
|
+
border-top: var(--rp-border-width-thin) solid var(--rp-color-border);
|
|
26
|
+
}
|
|
27
|
+
.rp-accordion-item[data-v-8528e537]:first-child {
|
|
28
|
+
border-top: 0;
|
|
29
|
+
}
|
|
30
|
+
.rp-accordion-item--horizontal[data-v-8528e537] {
|
|
31
|
+
flex: 1 1 0;
|
|
32
|
+
border-top: 0;
|
|
33
|
+
border-left: var(--rp-border-width-thin) solid var(--rp-color-border);
|
|
34
|
+
}
|
|
35
|
+
.rp-accordion-item--horizontal[data-v-8528e537]:first-child {
|
|
36
|
+
border-left: 0;
|
|
37
|
+
}
|
|
38
|
+
.rp-accordion-item--disabled[data-v-8528e537] {
|
|
39
|
+
opacity: var(--rp-opacity-disabled);
|
|
40
|
+
cursor: not-allowed;
|
|
41
|
+
}
|
|
42
|
+
.rp-accordion-item__heading[data-v-8528e537] {
|
|
43
|
+
margin: 0;
|
|
44
|
+
font: inherit;
|
|
45
|
+
}
|
|
46
|
+
.rp-accordion-item__trigger[data-v-8528e537] {
|
|
47
|
+
display: flex;
|
|
48
|
+
align-items: center;
|
|
49
|
+
justify-content: space-between;
|
|
50
|
+
box-sizing: border-box;
|
|
51
|
+
width: 100%;
|
|
52
|
+
min-height: var(--rp-size-control-lg);
|
|
53
|
+
gap: var(--rp-spacing-3);
|
|
54
|
+
padding: var(--rp-spacing-3) var(--rp-spacing-4);
|
|
55
|
+
color: var(--rp-color-text);
|
|
56
|
+
font-family: var(--rp-font-family);
|
|
57
|
+
font-size: var(--rp-font-size-base);
|
|
58
|
+
font-weight: var(--rp-font-weight-medium);
|
|
59
|
+
line-height: var(--rp-line-height-tight);
|
|
60
|
+
text-align: left;
|
|
61
|
+
appearance: none;
|
|
62
|
+
cursor: pointer;
|
|
63
|
+
background: transparent;
|
|
64
|
+
border: 0;
|
|
65
|
+
transition: background-color var(--_rp-accordion-duration), color var(--_rp-accordion-duration);
|
|
66
|
+
}
|
|
67
|
+
.rp-accordion-item__trigger[data-v-8528e537]:hover:not(:disabled) {
|
|
68
|
+
background-color: var(--rp-color-surface-hover);
|
|
69
|
+
}
|
|
70
|
+
.rp-accordion-item__trigger[data-v-8528e537]:focus-visible {
|
|
71
|
+
outline: none;
|
|
72
|
+
border-color: var(--rp-color-primary);
|
|
73
|
+
box-shadow: 0 0 0 var(--rp-border-width-medium) var(--rp-color-focus-ring);
|
|
74
|
+
}
|
|
75
|
+
.rp-accordion-item__trigger[data-v-8528e537]:disabled {
|
|
76
|
+
cursor: default;
|
|
77
|
+
}
|
|
78
|
+
.rp-accordion-item__title[data-v-8528e537] {
|
|
79
|
+
min-width: 0;
|
|
80
|
+
}
|
|
81
|
+
.rp-accordion-item__icon[data-v-8528e537] {
|
|
82
|
+
display: inline-flex;
|
|
83
|
+
flex: 0 0 auto;
|
|
84
|
+
color: var(--rp-color-control-icon);
|
|
85
|
+
transition: transform var(--_rp-accordion-duration);
|
|
86
|
+
}
|
|
87
|
+
.rp-accordion-item--open .rp-accordion-item__icon[data-v-8528e537] {
|
|
88
|
+
transform: rotate(180deg);
|
|
89
|
+
}
|
|
90
|
+
.rp-accordion-item__content[data-v-8528e537] {
|
|
91
|
+
box-sizing: border-box;
|
|
92
|
+
display: grid;
|
|
93
|
+
min-width: 0;
|
|
94
|
+
overflow: hidden;
|
|
95
|
+
padding: 0 var(--rp-spacing-4) var(--rp-spacing-4);
|
|
96
|
+
color: var(--rp-color-text);
|
|
97
|
+
font-size: var(--rp-font-size-base);
|
|
98
|
+
line-height: var(--rp-line-height-normal);
|
|
99
|
+
grid-template-rows: 1fr;
|
|
100
|
+
transition: grid-template-rows var(--_rp-accordion-duration), opacity var(--_rp-accordion-duration), padding-bottom var(--_rp-accordion-duration);
|
|
101
|
+
}
|
|
102
|
+
.rp-accordion-item__inner[data-v-8528e537] {
|
|
103
|
+
min-height: 0;
|
|
104
|
+
min-width: 0;
|
|
105
|
+
overflow: hidden;
|
|
106
|
+
}
|
|
107
|
+
.rp-accordion-content-enter-from[data-v-8528e537],
|
|
108
|
+
.rp-accordion-content-leave-to[data-v-8528e537] {
|
|
109
|
+
opacity: 0;
|
|
110
|
+
grid-template-rows: 0fr;
|
|
111
|
+
padding-bottom: 0;
|
|
112
|
+
}
|
|
@@ -0,0 +1,360 @@
|
|
|
1
|
+
import './accordion.css';
|
|
2
|
+
import { t as useRequiredInject } from "./useRequiredInject.js";
|
|
3
|
+
import { t as bem } from "./bem.js";
|
|
4
|
+
import { t as useCollapse } from "./useCollapse.js";
|
|
5
|
+
import { t as _plugin_vue_export_helper_default } from "./_plugin-vue_export-helper.js";
|
|
6
|
+
import { VaporTransition, applyVShow, child, computed, createComponent, createIf, createSlot, defineVaporComponent, extend, markRaw, next, provide, ref, renderEffect, setDynamicProps, setInsertionState, setText, template, toDisplayString, unref, useId } from "vue";
|
|
7
|
+
//#region src/components/accordion/types.ts
|
|
8
|
+
var accordionKey = Symbol("accordion");
|
|
9
|
+
//#endregion
|
|
10
|
+
//#region src/components/accordion/useAccordion.ts
|
|
11
|
+
var ACCORDION_SELECTOR = ".rp-accordion";
|
|
12
|
+
var TRIGGER_SELECTOR = ".rp-accordion-item__trigger";
|
|
13
|
+
function normalizeValue(value, multiple) {
|
|
14
|
+
if (value == null) return [];
|
|
15
|
+
const values = Array.isArray(value) ? value : [value];
|
|
16
|
+
return multiple ? values : values.slice(0, 1);
|
|
17
|
+
}
|
|
18
|
+
function toModelValue(values, multiple) {
|
|
19
|
+
return multiple ? [...values] : values[0] ?? null;
|
|
20
|
+
}
|
|
21
|
+
function hasValue(values, value) {
|
|
22
|
+
return values.some((itemValue) => itemValue === value);
|
|
23
|
+
}
|
|
24
|
+
function withoutValue(values, value) {
|
|
25
|
+
return values.filter((itemValue) => itemValue !== value);
|
|
26
|
+
}
|
|
27
|
+
var ORIENTATION_NAVIGATION_KEYS = {
|
|
28
|
+
vertical: {
|
|
29
|
+
ArrowDown: 1,
|
|
30
|
+
ArrowUp: -1
|
|
31
|
+
},
|
|
32
|
+
horizontal: {
|
|
33
|
+
ArrowRight: 1,
|
|
34
|
+
ArrowLeft: -1
|
|
35
|
+
}
|
|
36
|
+
};
|
|
37
|
+
function getAccordionTrigger(event, root) {
|
|
38
|
+
const target = event.target;
|
|
39
|
+
if (!(target instanceof Element)) return void 0;
|
|
40
|
+
const trigger = target.closest(TRIGGER_SELECTOR);
|
|
41
|
+
if (!trigger || trigger.closest(ACCORDION_SELECTOR) !== root) return void 0;
|
|
42
|
+
return trigger;
|
|
43
|
+
}
|
|
44
|
+
function getAccordionTriggers(root) {
|
|
45
|
+
return Array.from(root.querySelectorAll(TRIGGER_SELECTOR)).filter((trigger) => trigger.closest(ACCORDION_SELECTOR) === root && !trigger.disabled);
|
|
46
|
+
}
|
|
47
|
+
function getNextTrigger(root, currentTrigger, key, orientation) {
|
|
48
|
+
const triggers = getAccordionTriggers(root);
|
|
49
|
+
const currentIndex = triggers.indexOf(currentTrigger);
|
|
50
|
+
if (currentIndex === -1 || triggers.length === 0) return void 0;
|
|
51
|
+
if (key === "Home") return triggers[0];
|
|
52
|
+
if (key === "End") return triggers[triggers.length - 1];
|
|
53
|
+
const direction = ORIENTATION_NAVIGATION_KEYS[orientation][key];
|
|
54
|
+
if (!direction) return void 0;
|
|
55
|
+
return triggers[(currentIndex + direction + triggers.length) % triggers.length];
|
|
56
|
+
}
|
|
57
|
+
function useAccordion(props, emitUpdate) {
|
|
58
|
+
const isMultiple = computed(() => Boolean(props.multiple));
|
|
59
|
+
const isCollapsible = computed(() => props.collapsible !== false);
|
|
60
|
+
const isDisabled = computed(() => Boolean(props.disabled));
|
|
61
|
+
const orientation = computed(() => props.orientation ?? "vertical");
|
|
62
|
+
const isControlled = computed(() => props.modelValue !== void 0);
|
|
63
|
+
const uncontrolledValue = ref(props.defaultValue ?? null);
|
|
64
|
+
const openValues = computed(() => normalizeValue(isControlled.value ? props.modelValue : uncontrolledValue.value, isMultiple.value));
|
|
65
|
+
const rootClass = computed(() => bem("rp-accordion", {
|
|
66
|
+
disabled: isDisabled.value,
|
|
67
|
+
multiple: isMultiple.value,
|
|
68
|
+
[`${orientation.value}`]: true
|
|
69
|
+
}));
|
|
70
|
+
const rootProps = computed(() => ({
|
|
71
|
+
id: props.id,
|
|
72
|
+
class: rootClass.value,
|
|
73
|
+
"data-disabled": isDisabled.value || void 0,
|
|
74
|
+
"data-orientation": orientation.value,
|
|
75
|
+
"aria-label": props.ariaLabel || void 0,
|
|
76
|
+
"aria-labelledby": props.labelledby || void 0,
|
|
77
|
+
"aria-describedby": props.describedby || void 0,
|
|
78
|
+
onKeydown: onRootKeydown
|
|
79
|
+
}));
|
|
80
|
+
function setValues(nextValues) {
|
|
81
|
+
const nextModelValue = toModelValue(nextValues, isMultiple.value);
|
|
82
|
+
if (!isControlled.value) uncontrolledValue.value = nextModelValue;
|
|
83
|
+
emitUpdate(nextModelValue);
|
|
84
|
+
}
|
|
85
|
+
function setItemOpen(value, open) {
|
|
86
|
+
if (isDisabled.value) return;
|
|
87
|
+
const values = openValues.value;
|
|
88
|
+
if (hasValue(values, value) === open) return;
|
|
89
|
+
if (!open && !isCollapsible.value) return;
|
|
90
|
+
if (isMultiple.value) {
|
|
91
|
+
setValues(open ? [...values, value] : withoutValue(values, value));
|
|
92
|
+
return;
|
|
93
|
+
}
|
|
94
|
+
setValues(open ? [value] : []);
|
|
95
|
+
}
|
|
96
|
+
function onRootKeydown(event) {
|
|
97
|
+
const root = event.currentTarget;
|
|
98
|
+
if (!root) return;
|
|
99
|
+
const trigger = getAccordionTrigger(event, root);
|
|
100
|
+
if (!trigger) return;
|
|
101
|
+
const nextTrigger = getNextTrigger(root, trigger, event.key, orientation.value);
|
|
102
|
+
if (!nextTrigger) return;
|
|
103
|
+
event.preventDefault();
|
|
104
|
+
nextTrigger.focus();
|
|
105
|
+
}
|
|
106
|
+
provide(accordionKey, {
|
|
107
|
+
get multiple() {
|
|
108
|
+
return isMultiple.value;
|
|
109
|
+
},
|
|
110
|
+
get collapsible() {
|
|
111
|
+
return isCollapsible.value;
|
|
112
|
+
},
|
|
113
|
+
get disabled() {
|
|
114
|
+
return isDisabled.value;
|
|
115
|
+
},
|
|
116
|
+
get unmountOnExit() {
|
|
117
|
+
return Boolean(props.unmountOnExit);
|
|
118
|
+
},
|
|
119
|
+
get orientation() {
|
|
120
|
+
return orientation.value;
|
|
121
|
+
},
|
|
122
|
+
isItemOpen(value) {
|
|
123
|
+
return hasValue(openValues.value, value);
|
|
124
|
+
},
|
|
125
|
+
setItemOpen
|
|
126
|
+
});
|
|
127
|
+
return {
|
|
128
|
+
rootClass,
|
|
129
|
+
rootProps,
|
|
130
|
+
openValues,
|
|
131
|
+
setItemOpen
|
|
132
|
+
};
|
|
133
|
+
}
|
|
134
|
+
function useAccordionItem(props) {
|
|
135
|
+
const group = useRequiredInject(accordionKey, "RpAccordionItem");
|
|
136
|
+
const generatedId = useId();
|
|
137
|
+
const id = computed(() => props.id ?? `${generatedId}-accordion-item`);
|
|
138
|
+
const triggerId = computed(() => `${id.value}-trigger`);
|
|
139
|
+
const contentId = computed(() => `${id.value}-content`);
|
|
140
|
+
const isOpen = computed(() => group.isItemOpen(props.value));
|
|
141
|
+
const isDisabled = computed(() => Boolean(group.disabled || props.disabled));
|
|
142
|
+
const shouldUnmountOnExit = computed(() => props.unmountOnExit ?? group.unmountOnExit);
|
|
143
|
+
const state = computed(() => isOpen.value ? "open" : "closed");
|
|
144
|
+
const triggerAriaDisabled = computed(() => isDisabled.value || !group.collapsible && isOpen.value);
|
|
145
|
+
const collapse = useCollapse({
|
|
146
|
+
id: contentId,
|
|
147
|
+
open: isOpen,
|
|
148
|
+
disabled: isDisabled,
|
|
149
|
+
unmountOnExit: shouldUnmountOnExit,
|
|
150
|
+
role: () => props.role ?? "region",
|
|
151
|
+
ariaLabel: () => props.ariaLabel,
|
|
152
|
+
ariaDescribedby: () => props.ariaDescribedby,
|
|
153
|
+
ariaLabelledby: () => props.ariaLabelledby ?? triggerId.value
|
|
154
|
+
}, (nextOpen) => {
|
|
155
|
+
setOpen(nextOpen);
|
|
156
|
+
});
|
|
157
|
+
const rootClass = computed(() => bem("rp-accordion-item", {
|
|
158
|
+
open: isOpen.value,
|
|
159
|
+
closed: !isOpen.value,
|
|
160
|
+
disabled: isDisabled.value,
|
|
161
|
+
[`${group.orientation}`]: true
|
|
162
|
+
}));
|
|
163
|
+
const rootProps = computed(() => ({
|
|
164
|
+
id: id.value,
|
|
165
|
+
class: rootClass.value,
|
|
166
|
+
"data-state": state.value,
|
|
167
|
+
"data-disabled": isDisabled.value || void 0
|
|
168
|
+
}));
|
|
169
|
+
const triggerProps = computed(() => ({
|
|
170
|
+
...collapse.triggerProps.value,
|
|
171
|
+
id: triggerId.value,
|
|
172
|
+
class: "rp-accordion-item__trigger",
|
|
173
|
+
"aria-controls": contentId.value,
|
|
174
|
+
"aria-expanded": isOpen.value,
|
|
175
|
+
"aria-disabled": triggerAriaDisabled.value || void 0,
|
|
176
|
+
disabled: isDisabled.value || void 0,
|
|
177
|
+
onClick: onTriggerClick
|
|
178
|
+
}));
|
|
179
|
+
const contentProps = computed(() => ({
|
|
180
|
+
...collapse.contentProps.value,
|
|
181
|
+
class: "rp-accordion-item__content",
|
|
182
|
+
id: contentId.value,
|
|
183
|
+
"aria-labelledby": props.ariaLabelledby ?? triggerId.value
|
|
184
|
+
}));
|
|
185
|
+
const contentSlotProps = computed(() => ({
|
|
186
|
+
value: props.value,
|
|
187
|
+
isOpen: isOpen.value,
|
|
188
|
+
disabled: isDisabled.value,
|
|
189
|
+
open,
|
|
190
|
+
close,
|
|
191
|
+
toggle
|
|
192
|
+
}));
|
|
193
|
+
const triggerSlotProps = computed(() => ({
|
|
194
|
+
triggerProps: triggerProps.value,
|
|
195
|
+
...contentSlotProps.value
|
|
196
|
+
}));
|
|
197
|
+
function open() {
|
|
198
|
+
setOpen(true);
|
|
199
|
+
}
|
|
200
|
+
function close() {
|
|
201
|
+
setOpen(false);
|
|
202
|
+
}
|
|
203
|
+
function toggle() {
|
|
204
|
+
setOpen(!isOpen.value);
|
|
205
|
+
}
|
|
206
|
+
function setOpen(nextOpen) {
|
|
207
|
+
if (isDisabled.value) return;
|
|
208
|
+
group.setItemOpen(props.value, nextOpen);
|
|
209
|
+
}
|
|
210
|
+
function onTriggerClick() {
|
|
211
|
+
toggle();
|
|
212
|
+
}
|
|
213
|
+
return {
|
|
214
|
+
group,
|
|
215
|
+
id,
|
|
216
|
+
triggerId,
|
|
217
|
+
contentId,
|
|
218
|
+
state,
|
|
219
|
+
isOpen,
|
|
220
|
+
isDisabled,
|
|
221
|
+
shouldRenderContent: collapse.shouldRenderContent,
|
|
222
|
+
rootClass,
|
|
223
|
+
rootProps,
|
|
224
|
+
triggerProps,
|
|
225
|
+
contentProps,
|
|
226
|
+
triggerSlotProps,
|
|
227
|
+
contentSlotProps,
|
|
228
|
+
open,
|
|
229
|
+
close,
|
|
230
|
+
toggle
|
|
231
|
+
};
|
|
232
|
+
}
|
|
233
|
+
//#endregion
|
|
234
|
+
//#region src/components/accordion/accordion.vue?vue&type=script&setup=true&vapor=true&lang.ts
|
|
235
|
+
var t0$2 = template("<div data-v-c0aaa9d9>", 1);
|
|
236
|
+
//#endregion
|
|
237
|
+
//#region src/components/accordion/accordion.vue
|
|
238
|
+
var accordion_default = /*#__PURE__*/ _plugin_vue_export_helper_default(/* @__PURE__ */ defineVaporComponent({
|
|
239
|
+
name: "RpAccordion",
|
|
240
|
+
__name: "accordion",
|
|
241
|
+
props: {
|
|
242
|
+
id: {},
|
|
243
|
+
modelValue: { default: void 0 },
|
|
244
|
+
defaultValue: { default: void 0 },
|
|
245
|
+
multiple: {
|
|
246
|
+
type: Boolean,
|
|
247
|
+
default: false
|
|
248
|
+
},
|
|
249
|
+
collapsible: {
|
|
250
|
+
type: Boolean,
|
|
251
|
+
default: true
|
|
252
|
+
},
|
|
253
|
+
disabled: {
|
|
254
|
+
type: Boolean,
|
|
255
|
+
default: false
|
|
256
|
+
},
|
|
257
|
+
unmountOnExit: {
|
|
258
|
+
type: Boolean,
|
|
259
|
+
default: false
|
|
260
|
+
},
|
|
261
|
+
orientation: { default: "vertical" },
|
|
262
|
+
ariaLabel: {},
|
|
263
|
+
describedby: {},
|
|
264
|
+
labelledby: {}
|
|
265
|
+
},
|
|
266
|
+
emits: ["update:modelValue"],
|
|
267
|
+
setup(__props, { emit: __emit }) {
|
|
268
|
+
const props = __props;
|
|
269
|
+
const emit = __emit;
|
|
270
|
+
const { rootProps } = useAccordion(props, (value) => {
|
|
271
|
+
emit("update:modelValue", value);
|
|
272
|
+
});
|
|
273
|
+
const n1 = t0$2();
|
|
274
|
+
renderEffect(() => setDynamicProps(n1, [unref(rootProps)]));
|
|
275
|
+
setInsertionState(n1, null, 0);
|
|
276
|
+
createSlot("default", null, null, 1);
|
|
277
|
+
return n1;
|
|
278
|
+
}
|
|
279
|
+
}), [["__scopeId", "data-v-c0aaa9d9"]]);
|
|
280
|
+
//#endregion
|
|
281
|
+
//#region ~icons/lucide/chevron-down
|
|
282
|
+
var t0$1 = template("<svg viewBox=\"0 0 24 24\"width=1.2em height=1.2em><path fill=none stroke=currentColor stroke-linecap=round stroke-linejoin=round stroke-width=2 d=\"m6 9l6 6l6-6\">", 3, 1);
|
|
283
|
+
function render(_ctx) {
|
|
284
|
+
return t0$1();
|
|
285
|
+
}
|
|
286
|
+
var chevron_down_default = markRaw(defineVaporComponent({
|
|
287
|
+
name: "lucide-chevron-down",
|
|
288
|
+
render
|
|
289
|
+
}));
|
|
290
|
+
//#endregion
|
|
291
|
+
//#region src/components/accordion/accordion-item.vue?vue&type=script&setup=true&vapor=true&lang.ts
|
|
292
|
+
var t0 = template(" ");
|
|
293
|
+
var t1 = template("<button data-v-8528e537><span data-v-8528e537 class=rp-accordion-item__title></span><span data-v-8528e537 class=rp-accordion-item__icon aria-hidden=true>");
|
|
294
|
+
var t2 = template("<section data-v-8528e537><div data-v-8528e537 class=rp-accordion-item__inner>");
|
|
295
|
+
var t3 = template("<div data-v-8528e537><h3 data-v-8528e537 class=rp-accordion-item__heading>", 1);
|
|
296
|
+
//#endregion
|
|
297
|
+
//#region src/components/accordion/accordion-item.vue
|
|
298
|
+
var accordion_item_default = /*#__PURE__*/ _plugin_vue_export_helper_default(/* @__PURE__ */ defineVaporComponent({
|
|
299
|
+
name: "RpAccordionItem",
|
|
300
|
+
__name: "accordion-item",
|
|
301
|
+
props: {
|
|
302
|
+
id: {},
|
|
303
|
+
value: {},
|
|
304
|
+
title: { default: "" },
|
|
305
|
+
disabled: {
|
|
306
|
+
type: Boolean,
|
|
307
|
+
default: false
|
|
308
|
+
},
|
|
309
|
+
unmountOnExit: {
|
|
310
|
+
type: Boolean,
|
|
311
|
+
default: void 0
|
|
312
|
+
},
|
|
313
|
+
role: { default: "region" },
|
|
314
|
+
ariaLabel: {},
|
|
315
|
+
ariaDescribedby: {},
|
|
316
|
+
ariaLabelledby: {}
|
|
317
|
+
},
|
|
318
|
+
setup(__props) {
|
|
319
|
+
const { rootProps, triggerProps, contentProps, triggerSlotProps, contentSlotProps, isOpen, shouldRenderContent } = useAccordionItem(__props);
|
|
320
|
+
const n16 = t3();
|
|
321
|
+
const n9 = child(n16);
|
|
322
|
+
renderEffect(() => setDynamicProps(n16, [unref(rootProps)]));
|
|
323
|
+
setInsertionState(n9, null, 0);
|
|
324
|
+
createSlot("trigger", { $: [() => unref(triggerSlotProps)] }, () => {
|
|
325
|
+
const n8 = t1();
|
|
326
|
+
const n5 = child(n8);
|
|
327
|
+
const n7 = next(n5, 1);
|
|
328
|
+
renderEffect(() => setDynamicProps(n8, [unref(triggerProps)]));
|
|
329
|
+
setInsertionState(n5, null, 0);
|
|
330
|
+
createSlot("title", null, () => {
|
|
331
|
+
const n4 = t0();
|
|
332
|
+
renderEffect(() => setText(n4, toDisplayString(__props.title)));
|
|
333
|
+
return n4;
|
|
334
|
+
}, 1);
|
|
335
|
+
setInsertionState(n7, null, 0);
|
|
336
|
+
createComponent(unref(chevron_down_default));
|
|
337
|
+
return n8;
|
|
338
|
+
}, 1);
|
|
339
|
+
setInsertionState(n16, null, 1);
|
|
340
|
+
createComponent(VaporTransition, {
|
|
341
|
+
name: "rp-accordion-content",
|
|
342
|
+
persisted: ""
|
|
343
|
+
}, extend(() => {
|
|
344
|
+
return createIf(() => unref(shouldRenderContent), () => {
|
|
345
|
+
const n14 = t2();
|
|
346
|
+
const n13 = child(n14);
|
|
347
|
+
renderEffect(() => setDynamicProps(n14, [unref(contentProps)]));
|
|
348
|
+
setInsertionState(n13, null, 0);
|
|
349
|
+
createSlot("default", { $: [() => unref(contentSlotProps)] }, null, 1);
|
|
350
|
+
applyVShow(n14, () => unref(isOpen));
|
|
351
|
+
return n14;
|
|
352
|
+
}, null, 129);
|
|
353
|
+
}, { _: 8 }));
|
|
354
|
+
return n16;
|
|
355
|
+
}
|
|
356
|
+
}), [["__scopeId", "data-v-8528e537"]]);
|
|
357
|
+
//#endregion
|
|
358
|
+
export { useAccordionItem as i, accordion_default as n, useAccordion as r, accordion_item_default as t };
|
|
359
|
+
|
|
360
|
+
//# sourceMappingURL=accordion.js.map
|
|
@@ -0,0 +1 @@
|
|
|
1
|
+
{"version":3,"file":"accordion.js","names":[],"sources":["../src/components/accordion/types.ts","../src/components/accordion/useAccordion.ts","../src/components/accordion/accordion.vue","../src/components/accordion/accordion.vue","../src/components/accordion/accordion-item.vue","../src/components/accordion/accordion-item.vue"],"sourcesContent":["import type { ComputedRef, InjectionKey } from 'vue';\nimport type {\n CollapseContentProps,\n CollapseContentRole,\n CollapseTriggerProps,\n} from '../collapse/types';\n\nexport type AccordionItemValue = string | number;\n\nexport type AccordionModelValue = AccordionItemValue | AccordionItemValue[] | null;\n\nexport type AccordionOrientation = 'vertical' | 'horizontal';\n\nexport type AccordionState = 'open' | 'closed';\n\nexport interface AccordionProps {\n id?: string;\n modelValue?: AccordionModelValue;\n defaultValue?: AccordionModelValue;\n multiple?: boolean;\n collapsible?: boolean;\n disabled?: boolean;\n unmountOnExit?: boolean;\n orientation?: AccordionOrientation;\n ariaLabel?: string;\n describedby?: string;\n labelledby?: string;\n}\n\nexport interface AccordionItemProps {\n id?: string;\n value: AccordionItemValue;\n title?: string;\n disabled?: boolean;\n unmountOnExit?: boolean;\n role?: CollapseContentRole;\n ariaLabel?: string;\n ariaDescribedby?: string;\n ariaLabelledby?: string;\n}\n\nexport interface AccordionRootProps {\n id?: string;\n class: string[];\n 'data-disabled'?: boolean;\n 'data-orientation': AccordionOrientation;\n 'aria-label'?: string;\n 'aria-labelledby'?: string;\n 'aria-describedby'?: string;\n onKeydown: (event: KeyboardEvent) => void;\n}\n\nexport interface AccordionItemRootProps {\n id: string;\n class: string[];\n 'data-state': AccordionState;\n 'data-disabled'?: boolean;\n}\n\nexport interface AccordionTriggerProps extends CollapseTriggerProps {\n id: string;\n class: string;\n 'aria-disabled'?: boolean;\n}\n\nexport interface AccordionContentProps extends CollapseContentProps {\n class: string;\n}\n\nexport interface AccordionItemSlotProps {\n value: AccordionItemValue;\n isOpen: boolean;\n disabled: boolean;\n open: () => void;\n close: () => void;\n toggle: () => void;\n}\n\nexport interface AccordionItemTriggerSlotProps extends AccordionItemSlotProps {\n triggerProps: AccordionTriggerProps;\n}\n\nexport interface AccordionContext {\n multiple: boolean;\n collapsible: boolean;\n disabled: boolean;\n unmountOnExit: boolean;\n orientation: AccordionOrientation;\n isItemOpen: (value: AccordionItemValue) => boolean;\n setItemOpen: (value: AccordionItemValue, open: boolean) => void;\n}\n\nexport interface UseAccordionReturn {\n rootClass: ComputedRef<string[]>;\n rootProps: ComputedRef<AccordionRootProps>;\n openValues: ComputedRef<AccordionItemValue[]>;\n setItemOpen: (value: AccordionItemValue, open: boolean) => void;\n}\n\nexport interface UseAccordionItemReturn {\n group: AccordionContext;\n id: ComputedRef<string>;\n triggerId: ComputedRef<string>;\n contentId: ComputedRef<string>;\n state: ComputedRef<AccordionState>;\n isOpen: ComputedRef<boolean>;\n isDisabled: ComputedRef<boolean>;\n shouldRenderContent: ComputedRef<boolean>;\n rootClass: ComputedRef<string[]>;\n rootProps: ComputedRef<AccordionItemRootProps>;\n triggerProps: ComputedRef<AccordionTriggerProps>;\n contentProps: ComputedRef<AccordionContentProps>;\n triggerSlotProps: ComputedRef<AccordionItemTriggerSlotProps>;\n contentSlotProps: ComputedRef<AccordionItemSlotProps>;\n open: () => void;\n close: () => void;\n toggle: () => void;\n}\n\nexport const accordionKey = Symbol('accordion') as InjectionKey<AccordionContext>;\n","import { computed, provide, ref, useId } from 'vue';\nimport { useRequiredInject } from '@/composables/useRequiredInject';\nimport { bem } from '@/utils/bem';\nimport { useCollapse } from '../collapse/useCollapse';\nimport { accordionKey } from './types';\nimport type {\n AccordionContentProps,\n AccordionContext,\n AccordionItemProps,\n AccordionItemRootProps,\n AccordionItemSlotProps,\n AccordionItemTriggerSlotProps,\n AccordionItemValue,\n AccordionModelValue,\n AccordionOrientation,\n AccordionProps,\n AccordionRootProps,\n AccordionState,\n AccordionTriggerProps,\n UseAccordionItemReturn,\n UseAccordionReturn,\n} from './types';\n\nconst ACCORDION_SELECTOR = '.rp-accordion';\nconst TRIGGER_SELECTOR = '.rp-accordion-item__trigger';\n\nfunction normalizeValue(value: AccordionModelValue | undefined, multiple: boolean) {\n if (value == null) return [];\n const values = Array.isArray(value) ? value : [value];\n return multiple ? values : values.slice(0, 1);\n}\n\nfunction toModelValue(values: AccordionItemValue[], multiple: boolean): AccordionModelValue {\n return multiple ? [...values] : (values[0] ?? null);\n}\n\nfunction hasValue(values: AccordionItemValue[], value: AccordionItemValue) {\n return values.some((itemValue) => itemValue === value);\n}\n\nfunction withoutValue(values: AccordionItemValue[], value: AccordionItemValue) {\n return values.filter((itemValue) => itemValue !== value);\n}\n\ntype NavigationDirection = 1 | -1;\n\nconst ORIENTATION_NAVIGATION_KEYS: Record<\n AccordionOrientation,\n Partial<Record<string, NavigationDirection>>\n> = {\n vertical: {\n ArrowDown: 1,\n ArrowUp: -1,\n },\n horizontal: {\n ArrowRight: 1,\n ArrowLeft: -1,\n },\n};\n\nfunction getAccordionTrigger(event: KeyboardEvent, root: HTMLElement) {\n const target = event.target;\n if (!(target instanceof Element)) return undefined;\n\n const trigger = target.closest<HTMLButtonElement>(TRIGGER_SELECTOR);\n if (!trigger || trigger.closest(ACCORDION_SELECTOR) !== root) return undefined;\n\n return trigger;\n}\n\nfunction getAccordionTriggers(root: HTMLElement) {\n return Array.from(root.querySelectorAll<HTMLButtonElement>(TRIGGER_SELECTOR)).filter(\n (trigger) => trigger.closest(ACCORDION_SELECTOR) === root && !trigger.disabled,\n );\n}\n\nfunction getNextTrigger(\n root: HTMLElement,\n currentTrigger: HTMLButtonElement,\n key: string,\n orientation: AccordionOrientation,\n) {\n const triggers = getAccordionTriggers(root);\n const currentIndex = triggers.indexOf(currentTrigger);\n if (currentIndex === -1 || triggers.length === 0) return undefined;\n\n if (key === 'Home') return triggers[0];\n if (key === 'End') return triggers[triggers.length - 1];\n\n const direction = ORIENTATION_NAVIGATION_KEYS[orientation][key];\n if (!direction) return undefined;\n\n return triggers[(currentIndex + direction + triggers.length) % triggers.length];\n}\n\nexport function useAccordion(\n props: Readonly<AccordionProps>,\n emitUpdate: (value: AccordionModelValue) => void,\n): UseAccordionReturn {\n const isMultiple = computed(() => Boolean(props.multiple));\n const isCollapsible = computed(() => props.collapsible !== false);\n const isDisabled = computed(() => Boolean(props.disabled));\n const orientation = computed(() => props.orientation ?? 'vertical');\n const isControlled = computed(() => props.modelValue !== undefined);\n const uncontrolledValue = ref<AccordionModelValue>(props.defaultValue ?? null);\n\n const openValues = computed(() =>\n normalizeValue(\n isControlled.value ? props.modelValue : uncontrolledValue.value,\n isMultiple.value,\n ),\n );\n\n const rootClass = computed(() =>\n bem('rp-accordion', {\n disabled: isDisabled.value,\n multiple: isMultiple.value,\n [`${orientation.value}`]: true,\n }),\n );\n\n const rootProps = computed<AccordionRootProps>(() => ({\n id: props.id,\n class: rootClass.value,\n 'data-disabled': isDisabled.value || undefined,\n 'data-orientation': orientation.value,\n 'aria-label': props.ariaLabel || undefined,\n 'aria-labelledby': props.labelledby || undefined,\n 'aria-describedby': props.describedby || undefined,\n onKeydown: onRootKeydown,\n }));\n\n function setValues(nextValues: AccordionItemValue[]) {\n const nextModelValue = toModelValue(nextValues, isMultiple.value);\n\n if (!isControlled.value) uncontrolledValue.value = nextModelValue;\n emitUpdate(nextModelValue);\n }\n\n function setItemOpen(value: AccordionItemValue, open: boolean) {\n if (isDisabled.value) return;\n\n const values = openValues.value;\n const itemIsOpen = hasValue(values, value);\n if (itemIsOpen === open) return;\n if (!open && !isCollapsible.value) return;\n\n if (isMultiple.value) {\n setValues(open ? [...values, value] : withoutValue(values, value));\n return;\n }\n\n setValues(open ? [value] : []);\n }\n\n function onRootKeydown(event: KeyboardEvent) {\n const root = event.currentTarget as HTMLElement | null;\n if (!root) return;\n\n const trigger = getAccordionTrigger(event, root);\n if (!trigger) return;\n\n const nextTrigger = getNextTrigger(root, trigger, event.key, orientation.value);\n if (!nextTrigger) return;\n\n event.preventDefault();\n nextTrigger.focus();\n }\n\n provide<AccordionContext>(accordionKey, {\n get multiple() {\n return isMultiple.value;\n },\n get collapsible() {\n return isCollapsible.value;\n },\n get disabled() {\n return isDisabled.value;\n },\n get unmountOnExit() {\n return Boolean(props.unmountOnExit);\n },\n get orientation() {\n return orientation.value;\n },\n isItemOpen(value) {\n return hasValue(openValues.value, value);\n },\n setItemOpen,\n });\n\n return {\n rootClass,\n rootProps,\n openValues,\n setItemOpen,\n };\n}\n\nexport function useAccordionItem(props: Readonly<AccordionItemProps>): UseAccordionItemReturn {\n const group = useRequiredInject(accordionKey, 'RpAccordionItem');\n const generatedId = useId();\n\n const id = computed(() => props.id ?? `${generatedId}-accordion-item`);\n const triggerId = computed(() => `${id.value}-trigger`);\n const contentId = computed(() => `${id.value}-content`);\n const isOpen = computed(() => group.isItemOpen(props.value));\n const isDisabled = computed(() => Boolean(group.disabled || props.disabled));\n const shouldUnmountOnExit = computed(() => props.unmountOnExit ?? group.unmountOnExit);\n const state = computed<AccordionState>(() => (isOpen.value ? 'open' : 'closed'));\n const triggerAriaDisabled = computed(\n () => isDisabled.value || (!group.collapsible && isOpen.value),\n );\n\n const collapse = useCollapse(\n {\n id: contentId,\n open: isOpen,\n disabled: isDisabled,\n unmountOnExit: shouldUnmountOnExit,\n role: () => props.role ?? 'region',\n ariaLabel: () => props.ariaLabel,\n ariaDescribedby: () => props.ariaDescribedby,\n ariaLabelledby: () => props.ariaLabelledby ?? triggerId.value,\n },\n (nextOpen) => {\n setOpen(nextOpen);\n },\n );\n\n const rootClass = computed(() =>\n bem('rp-accordion-item', {\n open: isOpen.value,\n closed: !isOpen.value,\n disabled: isDisabled.value,\n [`${group.orientation}`]: true,\n }),\n );\n\n const rootProps = computed<AccordionItemRootProps>(() => ({\n id: id.value,\n class: rootClass.value,\n 'data-state': state.value,\n 'data-disabled': isDisabled.value || undefined,\n }));\n\n const triggerProps = computed<AccordionTriggerProps>(() => ({\n ...collapse.triggerProps.value,\n id: triggerId.value,\n class: 'rp-accordion-item__trigger',\n 'aria-controls': contentId.value,\n 'aria-expanded': isOpen.value,\n 'aria-disabled': triggerAriaDisabled.value || undefined,\n disabled: isDisabled.value || undefined,\n onClick: onTriggerClick,\n }));\n\n const contentProps = computed<AccordionContentProps>(() => ({\n ...collapse.contentProps.value,\n class: 'rp-accordion-item__content',\n id: contentId.value,\n 'aria-labelledby': props.ariaLabelledby ?? triggerId.value,\n }));\n\n const contentSlotProps = computed<AccordionItemSlotProps>(() => ({\n value: props.value,\n isOpen: isOpen.value,\n disabled: isDisabled.value,\n open,\n close,\n toggle,\n }));\n\n const triggerSlotProps = computed<AccordionItemTriggerSlotProps>(() => ({\n triggerProps: triggerProps.value,\n ...contentSlotProps.value,\n }));\n\n function open() {\n setOpen(true);\n }\n\n function close() {\n setOpen(false);\n }\n\n function toggle() {\n setOpen(!isOpen.value);\n }\n\n function setOpen(nextOpen: boolean) {\n if (isDisabled.value) return;\n group.setItemOpen(props.value, nextOpen);\n }\n\n function onTriggerClick() {\n toggle();\n }\n\n return {\n group,\n id,\n triggerId,\n contentId,\n state,\n isOpen,\n isDisabled,\n shouldRenderContent: collapse.shouldRenderContent,\n rootClass,\n rootProps,\n triggerProps,\n contentProps,\n triggerSlotProps,\n contentSlotProps,\n open,\n close,\n toggle,\n };\n}\n","<template>\n <div v-bind=\"rootProps\">\n <slot />\n </div>\n</template>\n\n<script lang=\"ts\" setup vapor>\nimport { useAccordion } from './useAccordion';\nimport type { AccordionModelValue, AccordionProps } from './types';\n\ndefineOptions({ name: 'RpAccordion' });\n\nconst props = withDefaults(defineProps<AccordionProps>(), {\n modelValue: undefined,\n defaultValue: undefined,\n multiple: false,\n collapsible: true,\n disabled: false,\n unmountOnExit: false,\n orientation: 'vertical',\n});\n\nconst emit = defineEmits<{\n 'update:modelValue': [value: AccordionModelValue];\n}>();\n\nconst { rootProps } = useAccordion(props, (value) => {\n emit('update:modelValue', value);\n});\n</script>\n\n<style src=\"./accordion.scss\" lang=\"scss\" scoped></style>\n","<template>\n <div v-bind=\"rootProps\">\n <slot />\n </div>\n</template>\n\n<script lang=\"ts\" setup vapor>\nimport { useAccordion } from './useAccordion';\nimport type { AccordionModelValue, AccordionProps } from './types';\n\ndefineOptions({ name: 'RpAccordion' });\n\nconst props = withDefaults(defineProps<AccordionProps>(), {\n modelValue: undefined,\n defaultValue: undefined,\n multiple: false,\n collapsible: true,\n disabled: false,\n unmountOnExit: false,\n orientation: 'vertical',\n});\n\nconst emit = defineEmits<{\n 'update:modelValue': [value: AccordionModelValue];\n}>();\n\nconst { rootProps } = useAccordion(props, (value) => {\n emit('update:modelValue', value);\n});\n</script>\n\n<style src=\"./accordion.scss\" lang=\"scss\" scoped></style>\n","<template>\n <div v-bind=\"rootProps\">\n <h3 class=\"rp-accordion-item__heading\">\n <slot name=\"trigger\" v-bind=\"triggerSlotProps\">\n <button v-bind=\"triggerProps\">\n <span class=\"rp-accordion-item__title\">\n <slot name=\"title\">{{ title }}</slot>\n </span>\n <span class=\"rp-accordion-item__icon\" aria-hidden=\"true\">\n <IconChevronDown />\n </span>\n </button>\n </slot>\n </h3>\n\n <Transition name=\"rp-accordion-content\">\n <section v-if=\"shouldRenderContent\" v-show=\"isOpen\" v-bind=\"contentProps\">\n <div class=\"rp-accordion-item__inner\">\n <slot v-bind=\"contentSlotProps\" />\n </div>\n </section>\n </Transition>\n </div>\n</template>\n\n<script lang=\"ts\" setup vapor>\nimport IconChevronDown from '~icons/lucide/chevron-down';\nimport { useAccordionItem } from './useAccordion';\nimport type { AccordionItemProps } from './types';\n\ndefineOptions({ name: 'RpAccordionItem' });\n\nconst props = withDefaults(defineProps<AccordionItemProps>(), {\n title: '',\n disabled: false,\n unmountOnExit: undefined,\n role: 'region',\n});\n\nconst {\n rootProps,\n triggerProps,\n contentProps,\n triggerSlotProps,\n contentSlotProps,\n isOpen,\n shouldRenderContent,\n} = useAccordionItem(props);\n</script>\n\n<style src=\"./accordion-item.scss\" lang=\"scss\" scoped></style>\n","<template>\n <div v-bind=\"rootProps\">\n <h3 class=\"rp-accordion-item__heading\">\n <slot name=\"trigger\" v-bind=\"triggerSlotProps\">\n <button v-bind=\"triggerProps\">\n <span class=\"rp-accordion-item__title\">\n <slot name=\"title\">{{ title }}</slot>\n </span>\n <span class=\"rp-accordion-item__icon\" aria-hidden=\"true\">\n <IconChevronDown />\n </span>\n </button>\n </slot>\n </h3>\n\n <Transition name=\"rp-accordion-content\">\n <section v-if=\"shouldRenderContent\" v-show=\"isOpen\" v-bind=\"contentProps\">\n <div class=\"rp-accordion-item__inner\">\n <slot v-bind=\"contentSlotProps\" />\n </div>\n </section>\n </Transition>\n </div>\n</template>\n\n<script lang=\"ts\" setup vapor>\nimport IconChevronDown from '~icons/lucide/chevron-down';\nimport { useAccordionItem } from './useAccordion';\nimport type { AccordionItemProps } from './types';\n\ndefineOptions({ name: 'RpAccordionItem' });\n\nconst props = withDefaults(defineProps<AccordionItemProps>(), {\n title: '',\n disabled: false,\n unmountOnExit: undefined,\n role: 'region',\n});\n\nconst {\n rootProps,\n triggerProps,\n contentProps,\n triggerSlotProps,\n contentSlotProps,\n isOpen,\n shouldRenderContent,\n} = useAccordionItem(props);\n</script>\n\n<style src=\"./accordion-item.scss\" lang=\"scss\" scoped></style>\n"],"mappings":"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"}
|