ropav 0.1.6 → 0.1.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/README.md +6 -0
- package/dist/accordion.css +17 -17
- package/dist/accordion.js +123 -155
- package/dist/alert.css +18 -18
- package/dist/alert.js +10 -11
- package/dist/aria.js +14 -0
- package/dist/aspect-ratio.js +1 -1
- package/dist/attributes.js +9 -0
- package/dist/attributes2.js +29 -0
- package/dist/avatar.css +19 -19
- package/dist/avatar.js +9 -17
- package/dist/badge.css +16 -16
- package/dist/badge.js +5 -5
- package/dist/button-group.js +1 -1
- package/dist/button-link.js +4 -3
- package/dist/button.js +4 -3
- package/dist/button.scss_vue_type_style_index_0_src_true_lang.js +1 -1
- package/dist/card.js +1 -1
- package/dist/checkbox.css +32 -32
- package/dist/checkbox.js +22 -28
- package/dist/collapse.css +6 -6
- package/dist/collapse.js +7 -6
- package/dist/collectionNavigation.js +2 -99
- package/dist/color-input.css +19 -19
- package/dist/color-input.js +14 -13
- package/dist/color-picker.css +40 -40
- package/dist/color-picker.js +221 -200
- package/dist/color-picker2.js +1 -9
- package/dist/color-swatch.css +4 -4
- package/dist/color-swatch.js +6 -8
- package/dist/color.js +5 -10
- package/dist/componentColors.js +125 -84
- package/dist/componentRef.js +26 -0
- package/dist/components/accordion/accordionContext.d.ts +3 -0
- package/dist/components/accordion/accordionModel.d.ts +14 -0
- package/dist/components/accordion/index.d.ts +2 -1
- package/dist/components/accordion/index.js +1 -1
- package/dist/components/accordion/types.d.ts +1 -2
- package/dist/components/accordion/useAccordion.d.ts +2 -2
- package/dist/components/accordion/useAccordionItem.d.ts +2 -0
- package/dist/components/checkbox/useCheckbox.d.ts +1 -2
- package/dist/components/color-picker/index.js +2 -2
- package/dist/components/color-picker/types.d.ts +2 -2
- package/dist/components/color-picker/useColorPickerSaturation.d.ts +22 -0
- package/dist/components/color-picker/useColorPickerSlider.d.ts +20 -0
- package/dist/components/color-picker/useColorPickerValue.d.ts +1 -1
- package/dist/components/dialog/{dialog-core.d.ts → dialogContext.d.ts} +1 -5
- package/dist/components/dialog/useDialogContentInteractions.d.ts +18 -0
- package/dist/components/dialog/useDialogRootState.d.ts +19 -0
- package/dist/components/dropdown-menu/dropdown-menu-item-row.d.ts +1 -1
- package/dist/components/dropdown-menu/dropdown-menu-items.d.ts +1 -1
- package/dist/components/dropdown-menu/dropdown-menu-model.d.ts +8 -0
- package/dist/components/dropdown-menu/dropdown-menu-root.d.ts +2 -2
- package/dist/components/dropdown-menu/dropdown-menu-sub-trigger.d.ts +1 -1
- package/dist/components/dropdown-menu/dropdown-menu-sub.d.ts +1 -1
- package/dist/components/dropdown-menu/{dropdown-menu-primitive-core.d.ts → dropdownMenuContext.d.ts} +16 -18
- package/dist/components/dropdown-menu/dropdownMenuDataModel.d.ts +20 -0
- package/dist/components/dropdown-menu/dropdownMenuInteraction.d.ts +3 -0
- package/dist/components/dropdown-menu/dropdownMenuInteractionNavigation.d.ts +24 -0
- package/dist/components/dropdown-menu/dropdownMenuInteractionRegistry.d.ts +42 -0
- package/dist/components/dropdown-menu/dropdownMenuInteractionTypes.d.ts +85 -0
- package/dist/components/dropdown-menu/useDropdownMenu.d.ts +11 -11
- package/dist/components/dropdown-menu/useDropdownMenuContextTrigger.d.ts +9 -0
- package/dist/components/dropdown-menu/useDropdownMenuDataController.d.ts +34 -0
- package/dist/components/dropdown-menu/useDropdownMenuDataRegistration.d.ts +22 -0
- package/dist/components/dropdown-menu/useDropdownMenuHoverIntent.d.ts +6 -5
- package/dist/components/dropdown-menu/useDropdownMenuInteractionDismissal.d.ts +17 -0
- package/dist/components/dropdown-menu/useDropdownMenuInteractionKeyboard.d.ts +19 -0
- package/dist/components/dropdown-menu/useDropdownMenuPortalPosition.d.ts +0 -1
- package/dist/components/dropdown-menu/useDropdownMenuPresentation.d.ts +29 -0
- package/dist/components/dropdown-menu/useDropdownMenuPrimitiveContent.d.ts +2 -2
- package/dist/components/dropdown-menu/useDropdownMenuRenderItems.d.ts +1 -1
- package/dist/components/dropdown-menu/useDropdownMenuTargetBindings.d.ts +19 -0
- package/dist/components/floating/hoverDisclosureInteractionModel.d.ts +42 -0
- package/dist/components/floating/index.js +1 -1
- package/dist/components/floating/useFloatingPosition.d.ts +0 -1
- package/dist/components/floating/useHoverDisclosureInteractions.d.ts +32 -0
- package/dist/components/floating/useHoverDisclosureOpenState.d.ts +25 -0
- package/dist/components/floating/useHoverDisclosureTargetBinding.d.ts +27 -0
- package/dist/components/number-input/numberInputModel.d.ts +15 -0
- package/dist/components/number-input/useNumberInput.d.ts +3 -17
- package/dist/components/pagination/index.d.ts +1 -1
- package/dist/components/pagination/index.js +1 -1
- package/dist/components/pagination/paginationModel.d.ts +4 -0
- package/dist/components/pagination/types.d.ts +15 -0
- package/dist/components/pagination/usePagination.d.ts +3 -19
- package/dist/components/popover/usePopoverBindings.d.ts +16 -0
- package/dist/components/progress/progressModel.d.ts +8 -0
- package/dist/components/progress/useProgress.d.ts +0 -6
- package/dist/components/radio/useRadio.d.ts +1 -2
- package/dist/components/scroll-area/scroll-area.d.ts +1 -1
- package/dist/components/scroll-area/scrollAreaModel.d.ts +64 -0
- package/dist/components/scroll-area/useScrollArea.d.ts +70 -53
- package/dist/components/scroll-area/{useScrollAreaPresentation.d.ts → useScrollAreaAttributes.d.ts} +37 -17
- package/dist/components/scroll-area/useScrollAreaDerivedState.d.ts +8 -0
- package/dist/components/scroll-area/useScrollAreaMeasurement.d.ts +35 -0
- package/dist/components/scroll-area/useScrollAreaPointer.d.ts +10 -8
- package/dist/components/scroll-area/useScrollAreaVisibility.d.ts +15 -20
- package/dist/components/slider/rangeSliderModel.d.ts +41 -0
- package/dist/components/slider/{sliderCore.d.ts → sliderModel.d.ts} +0 -1
- package/dist/components/slider/useRangeSlider.d.ts +8 -16
- package/dist/components/slider/useRangeSliderValueState.d.ts +40 -0
- package/dist/components/slider/useSlider.d.ts +7 -13
- package/dist/components/slider/useSliderPointerPreview.d.ts +22 -0
- package/dist/components/slider/useSliderTooltipState.d.ts +40 -0
- package/dist/components/slider/useSliderValueState.d.ts +33 -0
- package/dist/components/teleport-provider/index.js +1 -1
- package/dist/components/teleport-provider/useTeleportTarget.d.ts +1 -2
- package/dist/components/toast/useToastLifecycle.d.ts +19 -0
- package/dist/components/tooltip/useTooltip.d.ts +1 -2
- package/dist/css.js +12 -0
- package/dist/dialog.js +226 -218
- package/dist/dropdown-menu.js +1458 -1097
- package/dist/events.js +59 -0
- package/dist/field.css +8 -8
- package/dist/field.js +13 -25
- package/dist/floating.js +548 -319
- package/dist/floatingOffset.js +11 -0
- package/dist/focus-trap.js +7 -5
- package/dist/focusNavigation.js +37 -0
- package/dist/icon-button.css +8 -8
- package/dist/icon-button.js +7 -6
- package/dist/index.js +6 -6
- package/dist/input.css +24 -24
- package/dist/input.js +19 -31
- package/dist/interactive.js +18 -0
- package/dist/modal.js +1 -1
- package/dist/number-input.css +18 -18
- package/dist/number-input.js +14 -12
- package/dist/number.js +22 -0
- package/dist/overlay.js +3 -2
- package/dist/pagination.css +28 -28
- package/dist/pagination.js +65 -63
- package/dist/pointer.js +9 -0
- package/dist/popover.css +34 -34
- package/dist/popover.js +85 -86
- package/dist/progress.js +10 -13
- package/dist/query.js +40 -0
- package/dist/radio.css +18 -18
- package/dist/radio.js +30 -36
- package/dist/rafScheduler.js +34 -0
- package/dist/scroll-area.css +28 -28
- package/dist/scroll-area.js +512 -516
- package/dist/select.css +45 -45
- package/dist/select.js +36 -44
- package/dist/slider.css +191 -191
- package/dist/slider.js +691 -618
- package/dist/styles-api.d.ts +0 -1
- package/dist/styles-api.js +1 -4
- package/dist/switch.css +17 -17
- package/dist/switch.js +14 -15
- package/dist/tabs.css +43 -43
- package/dist/tabs.js +29 -56
- package/dist/text.js +17 -0
- package/dist/textarea.css +26 -26
- package/dist/textarea.js +21 -32
- package/dist/toast.css +26 -26
- package/dist/toast.js +141 -118
- package/dist/tooltip.css +12 -12
- package/dist/tooltip.js +36 -40
- package/dist/useCollapse.js +8 -11
- package/dist/useControlState.js +3 -6
- package/dist/useFloatingPosition.js +140 -10
- package/dist/useOverlayZIndex.js +1 -5
- package/dist/useTeleportTarget.js +3 -14
- package/dist/useTypeahead.js +94 -0
- package/dist/utils/aria.d.ts +3 -0
- package/dist/utils/attributes.d.ts +2 -0
- package/dist/utils/bem.d.ts +3 -0
- package/dist/utils/collectionNavigation.d.ts +2 -0
- package/dist/utils/color.d.ts +7 -0
- package/dist/{components/color-picker/color-picker-utils.d.ts → utils/colorPicker.d.ts} +5 -4
- package/dist/utils/componentColors.d.ts +7 -0
- package/dist/utils/css.d.ts +3 -0
- package/dist/utils/dom/ancestry.d.ts +7 -0
- package/dist/utils/dom/attributes.d.ts +16 -0
- package/dist/utils/dom/componentRef.d.ts +4 -0
- package/dist/utils/dom/events.d.ts +5 -0
- package/dist/utils/dom/focusNavigation.d.ts +7 -0
- package/dist/utils/dom/interactive.d.ts +2 -0
- package/dist/utils/dom/pointer.d.ts +2 -0
- package/dist/utils/dom/query.d.ts +4 -0
- package/dist/utils/dom/scroll.d.ts +23 -0
- package/dist/utils/floatingOffset.d.ts +10 -0
- package/dist/utils/geometry.d.ts +14 -0
- package/dist/utils/indexPath.d.ts +6 -0
- package/dist/utils/number.d.ts +4 -0
- package/dist/utils/rafScheduler.d.ts +4 -0
- package/dist/utils/text.d.ts +2 -0
- package/docs/code-architecture.md +118 -0
- package/docs/public-floating-api.md +6 -5
- package/package.json +13 -12
- package/dist/components/dropdown-menu/dropdown-menu-outside.d.ts +0 -3
- package/dist/components/dropdown-menu/dropdown-menu-utils.d.ts +0 -21
- package/dist/components/dropdown-menu/useDropdownMenuDisclosure.d.ts +0 -36
- package/dist/components/dropdown-menu/useDropdownMenuDom.d.ts +0 -29
- package/dist/components/dropdown-menu/useDropdownMenuInteractions.d.ts +0 -52
- package/dist/components/dropdown-menu/useDropdownMenuNavigation.d.ts +0 -17
- package/dist/components/dropdown-menu/useDropdownSubmenus.d.ts +0 -18
- package/dist/components/scroll-area/scrollAreaCore.d.ts +0 -30
- package/dist/components/scroll-area/useScrollAreaControls.d.ts +0 -25
- package/dist/components/scroll-area/useScrollAreaMetrics.d.ts +0 -38
- /package/dist/components/alert/{useAlertColor.d.ts → alertColor.d.ts} +0 -0
- /package/dist/components/avatar/{useAvatarColor.d.ts → avatarColor.d.ts} +0 -0
- /package/dist/components/badge/{useBadgeColor.d.ts → badgeColor.d.ts} +0 -0
- /package/dist/components/button/{useButtonColor.d.ts → buttonColor.d.ts} +0 -0
- /package/dist/components/color-swatch/{useColorSwatchColor.d.ts → colorSwatchColor.d.ts} +0 -0
- /package/dist/components/toast/{useToastColor.d.ts → toastColor.d.ts} +0 -0
package/dist/color-swatch.js
CHANGED
|
@@ -1,9 +1,10 @@
|
|
|
1
1
|
import './color-swatch.css';
|
|
2
|
-
import {
|
|
2
|
+
import { t as useStylesApi } from "./styles-api.js";
|
|
3
3
|
import { t as _plugin_vue_export_helper_default } from "./_plugin-vue_export-helper.js";
|
|
4
4
|
import { t as parseCssColor } from "./color.js";
|
|
5
|
+
import { t as toCssLength } from "./css.js";
|
|
5
6
|
import { child, computed, createSlot, defineVaporComponent, renderEffect, setDynamicProps, setInsertionState, template } from "vue";
|
|
6
|
-
//#region src/components/color-swatch/
|
|
7
|
+
//#region src/components/color-swatch/colorSwatchColor.ts
|
|
7
8
|
function getColorSwatchForeground(color) {
|
|
8
9
|
const background = parseCssColor(color);
|
|
9
10
|
if (!background) return "var(--rp-color-white)";
|
|
@@ -25,7 +26,7 @@ function getPerceivedBrightness({ red, green, blue }) {
|
|
|
25
26
|
}
|
|
26
27
|
//#endregion
|
|
27
28
|
//#region src/components/color-swatch/color-swatch.vue?vue&type=script&setup=true&vapor=true&lang.ts
|
|
28
|
-
var t0 = template("<span data-v-
|
|
29
|
+
var t0 = template("<span data-v-63bed4a0><span data-v-63bed4a0 class=rp-color-swatch__icon aria-hidden=true>", 1);
|
|
29
30
|
//#endregion
|
|
30
31
|
//#region src/components/color-swatch/color-swatch.vue
|
|
31
32
|
var color_swatch_default = /*#__PURE__*/ _plugin_vue_export_helper_default(/* @__PURE__ */ defineVaporComponent({
|
|
@@ -53,7 +54,7 @@ var color_swatch_default = /*#__PURE__*/ _plugin_vue_export_helper_default(/* @_
|
|
|
53
54
|
"--_rp-color-swatch-overlay-stroke": overlay.stroke,
|
|
54
55
|
"--_rp-color-swatch-overlay-shadow": overlay.shadow
|
|
55
56
|
};
|
|
56
|
-
if (props.size !== void 0) style["--_rp-color-swatch-size"] =
|
|
57
|
+
if (props.size !== void 0) style["--_rp-color-swatch-size"] = toCssLength(props.size);
|
|
57
58
|
return style;
|
|
58
59
|
});
|
|
59
60
|
const rootAttrs = computed(() => getRootAttrs({
|
|
@@ -62,9 +63,6 @@ var color_swatch_default = /*#__PURE__*/ _plugin_vue_export_helper_default(/* @_
|
|
|
62
63
|
role: rootRole.value,
|
|
63
64
|
"aria-label": rootAriaLabel.value
|
|
64
65
|
}));
|
|
65
|
-
function normalizeSize(size) {
|
|
66
|
-
return typeof size === "number" ? `${size}px` : size;
|
|
67
|
-
}
|
|
68
66
|
const n2 = t0();
|
|
69
67
|
const n1 = child(n2);
|
|
70
68
|
renderEffect(() => setDynamicProps(n2, [rootAttrs.value]));
|
|
@@ -72,6 +70,6 @@ var color_swatch_default = /*#__PURE__*/ _plugin_vue_export_helper_default(/* @_
|
|
|
72
70
|
createSlot("default", null, null, 1);
|
|
73
71
|
return n2;
|
|
74
72
|
}
|
|
75
|
-
}), [["__scopeId", "data-v-
|
|
73
|
+
}), [["__scopeId", "data-v-63bed4a0"]]);
|
|
76
74
|
//#endregion
|
|
77
75
|
export { color_swatch_default as t };
|
package/dist/color.js
CHANGED
|
@@ -1,3 +1,4 @@
|
|
|
1
|
+
import { i as roundTo, t as clamp } from "./number.js";
|
|
1
2
|
//#region src/utils/color.ts
|
|
2
3
|
var DEFAULT_OPACITY = 100;
|
|
3
4
|
var NUMBER_SOURCE = String.raw`[+-]?(?:\d+(?:\.\d*)?|\.\d+)(?:e[+-]?\d+)?`;
|
|
@@ -32,13 +33,13 @@ function parseHexColor(color) {
|
|
|
32
33
|
red: Number.parseInt(hex[0] + hex[0], 16),
|
|
33
34
|
green: Number.parseInt(hex[1] + hex[1], 16),
|
|
34
35
|
blue: Number.parseInt(hex[2] + hex[2], 16),
|
|
35
|
-
opacity: hex.length === 4 ?
|
|
36
|
+
opacity: hex.length === 4 ? roundTo(Number.parseInt(hex[3] + hex[3], 16) / 255 * 100) : DEFAULT_OPACITY
|
|
36
37
|
};
|
|
37
38
|
return {
|
|
38
39
|
red: Number.parseInt(hex.slice(0, 2), 16),
|
|
39
40
|
green: Number.parseInt(hex.slice(2, 4), 16),
|
|
40
41
|
blue: Number.parseInt(hex.slice(4, 6), 16),
|
|
41
|
-
opacity: hex.length === 8 ?
|
|
42
|
+
opacity: hex.length === 8 ? roundTo(Number.parseInt(hex.slice(6, 8), 16) / 255 * 100) : DEFAULT_OPACITY
|
|
42
43
|
};
|
|
43
44
|
}
|
|
44
45
|
function parseRgbColor(color) {
|
|
@@ -131,9 +132,9 @@ function parsePercentage(channel) {
|
|
|
131
132
|
function parseAlpha(alpha) {
|
|
132
133
|
if (alpha === void 0) return DEFAULT_OPACITY;
|
|
133
134
|
const percentage = parsePercentage(alpha);
|
|
134
|
-
if (percentage != null) return
|
|
135
|
+
if (percentage != null) return roundTo(percentage);
|
|
135
136
|
const number = parseNumber(alpha);
|
|
136
|
-
return number == null ? void 0 :
|
|
137
|
+
return number == null ? void 0 : roundTo(clamp(number, 0, 1) * 100);
|
|
137
138
|
}
|
|
138
139
|
function parseNumber(value) {
|
|
139
140
|
const token = value.trim();
|
|
@@ -180,11 +181,5 @@ function hslToRgb(hue, saturation, lightness, opacity) {
|
|
|
180
181
|
function normalizeHue(value) {
|
|
181
182
|
return (value % 360 + 360) % 360;
|
|
182
183
|
}
|
|
183
|
-
function roundPercent(value) {
|
|
184
|
-
return Math.round(value * 100) / 100;
|
|
185
|
-
}
|
|
186
|
-
function clamp(value, min, max) {
|
|
187
|
-
return Math.min(max, Math.max(min, value));
|
|
188
|
-
}
|
|
189
184
|
//#endregion
|
|
190
185
|
export { parseCssColor as t };
|
package/dist/componentColors.js
CHANGED
|
@@ -61,6 +61,18 @@ function getComponentColorValue(color) {
|
|
|
61
61
|
function getComponentContrastColor(color, options = {}) {
|
|
62
62
|
return getComponentContrastColorRoles(color, options).color;
|
|
63
63
|
}
|
|
64
|
+
function getComponentCheckedColorStyle({ color, colorProperty, checkedColorProperty, defaultColor = "primary", autoContrast, contrastColor }) {
|
|
65
|
+
const colorValue = getComponentColorValue(color);
|
|
66
|
+
if (color && !colorValue) return void 0;
|
|
67
|
+
if (!colorValue && autoContrast === false && contrastColor === void 0) return void 0;
|
|
68
|
+
const style = {};
|
|
69
|
+
if (colorValue) style[colorProperty] = colorValue;
|
|
70
|
+
if (autoContrast !== false || contrastColor !== void 0) style[checkedColorProperty] = getComponentContrastColor(color ?? defaultColor, {
|
|
71
|
+
autoContrast,
|
|
72
|
+
contrastColor
|
|
73
|
+
});
|
|
74
|
+
return style;
|
|
75
|
+
}
|
|
64
76
|
function getComponentContrastColorRoles(color, options = {}) {
|
|
65
77
|
if (options.contrastColor !== void 0) return createContrastColorRoles(options.contrastColor);
|
|
66
78
|
if (options.autoContrast === false) return createContrastColorRoles("var(--rp-color-white)");
|
|
@@ -76,8 +88,17 @@ function getComponentContrastColorRoles(color, options = {}) {
|
|
|
76
88
|
}
|
|
77
89
|
function getComponentColorRoles(color) {
|
|
78
90
|
const parsed = parseComponentColor(color);
|
|
79
|
-
|
|
80
|
-
|
|
91
|
+
switch (parsed.kind) {
|
|
92
|
+
case "empty":
|
|
93
|
+
case "invalid": return;
|
|
94
|
+
case "primary": return createPrimaryColorRoles();
|
|
95
|
+
case "preset": return createPresetColorRoles(parsed.color);
|
|
96
|
+
case "shade": return createShadeColorRoles(parsed.color, parsed.shade);
|
|
97
|
+
case "custom": return createCustomColorRoles(parsed.value);
|
|
98
|
+
}
|
|
99
|
+
}
|
|
100
|
+
function createPrimaryColorRoles() {
|
|
101
|
+
return createComponentColorRoles("var(--rp-primary-color-filled)", {
|
|
81
102
|
hover: "var(--rp-primary-color-filled-hover)",
|
|
82
103
|
contrast: "var(--rp-primary-color-contrast)",
|
|
83
104
|
light: "var(--rp-primary-color-light)",
|
|
@@ -86,119 +107,139 @@ function getComponentColorRoles(color) {
|
|
|
86
107
|
outlineHover: "color-mix(in srgb, var(--rp-primary-color-outline) 62%, transparent)",
|
|
87
108
|
foreground: "var(--rp-primary-color-light-color)"
|
|
88
109
|
});
|
|
89
|
-
|
|
90
|
-
|
|
91
|
-
|
|
92
|
-
|
|
93
|
-
|
|
94
|
-
|
|
95
|
-
|
|
96
|
-
|
|
110
|
+
}
|
|
111
|
+
function createPresetColorRoles(color) {
|
|
112
|
+
return createComponentColorRoles(`var(--rp-color-${color}-filled)`, {
|
|
113
|
+
hover: `var(--rp-color-${color}-filled-hover)`,
|
|
114
|
+
contrast: `var(--rp-color-${color}-contrast)`,
|
|
115
|
+
light: `var(--rp-color-${color}-light)`,
|
|
116
|
+
lightHover: `var(--rp-color-${color}-light-hover)`,
|
|
117
|
+
outline: `var(--rp-color-${color}-outline)`,
|
|
118
|
+
outlineHover: `color-mix(in srgb, var(--rp-color-${color}-outline) 62%, transparent)`,
|
|
119
|
+
foreground: `var(--rp-color-${color}-light-color)`
|
|
97
120
|
});
|
|
98
|
-
|
|
99
|
-
|
|
100
|
-
|
|
101
|
-
|
|
102
|
-
|
|
103
|
-
|
|
104
|
-
|
|
105
|
-
|
|
106
|
-
|
|
107
|
-
|
|
108
|
-
}
|
|
109
|
-
|
|
110
|
-
|
|
121
|
+
}
|
|
122
|
+
function createShadeColorRoles(color, shade) {
|
|
123
|
+
const base = `var(--rp-color-${color}-${shade})`;
|
|
124
|
+
const hoverShade = Math.min(Number(shade) + 1, 9);
|
|
125
|
+
return createComponentColorRoles(base, {
|
|
126
|
+
hover: `var(--rp-color-${color}-${hoverShade})`,
|
|
127
|
+
contrast: `var(--rp-color-${color}-${shade}-contrast)`,
|
|
128
|
+
contrastHover: `var(--rp-color-${color}-${hoverShade}-contrast)`,
|
|
129
|
+
contrastActive: `var(--rp-color-${color}-${shade}-active-contrast)`,
|
|
130
|
+
foreground: base
|
|
131
|
+
});
|
|
132
|
+
}
|
|
133
|
+
function createCustomColorRoles(color) {
|
|
134
|
+
const contrast = getCustomContrastColorRoles(color);
|
|
135
|
+
return createComponentColorRoles(color, {
|
|
111
136
|
contrast: contrast.color,
|
|
112
137
|
contrastHover: contrast.hover,
|
|
113
138
|
contrastActive: contrast.active,
|
|
114
|
-
foreground: getCustomForegroundColor(
|
|
139
|
+
foreground: getCustomForegroundColor(color)
|
|
115
140
|
});
|
|
116
141
|
}
|
|
117
142
|
function getComponentVariantColorRoles({ color, variant, defaultColor = "primary", autoContrast, contrastColor }) {
|
|
118
|
-
const
|
|
143
|
+
const resolvedColor = color ?? defaultColor;
|
|
144
|
+
const roles = getComponentColorRoles(resolvedColor);
|
|
119
145
|
if (!roles) return void 0;
|
|
120
|
-
if (variant === "solid") {
|
|
121
|
-
|
|
122
|
-
|
|
123
|
-
|
|
124
|
-
|
|
125
|
-
|
|
126
|
-
|
|
127
|
-
|
|
128
|
-
|
|
129
|
-
|
|
130
|
-
|
|
131
|
-
|
|
132
|
-
|
|
133
|
-
|
|
134
|
-
|
|
135
|
-
|
|
146
|
+
if (variant === "solid") return createSolidVariantColorRoles(roles, getComponentContrastColorRoles(resolvedColor, {
|
|
147
|
+
autoContrast,
|
|
148
|
+
contrastColor
|
|
149
|
+
}));
|
|
150
|
+
return createForegroundVariantColorRoles(roles, variant);
|
|
151
|
+
}
|
|
152
|
+
function createSolidVariantColorRoles(roles, contrast) {
|
|
153
|
+
return {
|
|
154
|
+
background: roles.filled,
|
|
155
|
+
hover: roles.hover,
|
|
156
|
+
active: roles.active,
|
|
157
|
+
color: contrast.color,
|
|
158
|
+
colorHover: contrast.hover,
|
|
159
|
+
colorActive: contrast.active,
|
|
160
|
+
border: roles.filled,
|
|
161
|
+
borderHover: roles.hover,
|
|
162
|
+
borderActive: roles.active
|
|
163
|
+
};
|
|
164
|
+
}
|
|
165
|
+
function createForegroundVariantColorRoles(roles, variant) {
|
|
166
|
+
return {
|
|
167
|
+
...getForegroundVariantSurfaces(roles, variant),
|
|
168
|
+
color: roles.foreground,
|
|
169
|
+
colorHover: roles.foreground,
|
|
170
|
+
colorActive: roles.foreground
|
|
171
|
+
};
|
|
172
|
+
}
|
|
173
|
+
function getForegroundVariantSurfaces(roles, variant) {
|
|
174
|
+
switch (variant) {
|
|
175
|
+
case "subtle": return createSubtleVariantSurfaces(roles);
|
|
176
|
+
case "surface": return createSurfaceVariantSurfaces(roles);
|
|
177
|
+
case "outline": return createOutlineVariantSurfaces(roles);
|
|
178
|
+
case "ghost": return createGhostVariantSurfaces(roles);
|
|
179
|
+
case "plain": return createPlainVariantSurfaces();
|
|
180
|
+
default: return createDefaultVariantSurfaces(roles);
|
|
136
181
|
}
|
|
137
|
-
|
|
182
|
+
}
|
|
183
|
+
function createSubtleVariantSurfaces(roles) {
|
|
184
|
+
return createVariantSurfaces({
|
|
138
185
|
background: roles.light,
|
|
139
186
|
hover: roles.lightHover,
|
|
140
187
|
active: roles.lightActive,
|
|
141
|
-
|
|
142
|
-
|
|
143
|
-
|
|
144
|
-
|
|
145
|
-
|
|
146
|
-
borderActive: "transparent"
|
|
147
|
-
};
|
|
148
|
-
if (variant === "surface") return {
|
|
188
|
+
border: "transparent"
|
|
189
|
+
});
|
|
190
|
+
}
|
|
191
|
+
function createSurfaceVariantSurfaces(roles) {
|
|
192
|
+
return createVariantSurfaces({
|
|
149
193
|
background: roles.light,
|
|
150
194
|
hover: roles.lightHover,
|
|
151
195
|
active: roles.lightActive,
|
|
152
|
-
color: roles.foreground,
|
|
153
|
-
colorHover: roles.foreground,
|
|
154
|
-
colorActive: roles.foreground,
|
|
155
196
|
border: roles.outline,
|
|
156
197
|
borderHover: roles.lightHover,
|
|
157
198
|
borderActive: roles.outlineHover
|
|
158
|
-
};
|
|
159
|
-
|
|
199
|
+
});
|
|
200
|
+
}
|
|
201
|
+
function createOutlineVariantSurfaces(roles) {
|
|
202
|
+
return createVariantSurfaces({
|
|
160
203
|
background: "transparent",
|
|
161
204
|
hover: roles.lightHover,
|
|
162
205
|
active: roles.lightActive,
|
|
163
|
-
color: roles.foreground,
|
|
164
|
-
colorHover: roles.foreground,
|
|
165
|
-
colorActive: roles.foreground,
|
|
166
206
|
border: roles.outline,
|
|
167
|
-
borderHover: roles.outlineHover
|
|
168
|
-
|
|
169
|
-
|
|
170
|
-
|
|
207
|
+
borderHover: roles.outlineHover
|
|
208
|
+
});
|
|
209
|
+
}
|
|
210
|
+
function createGhostVariantSurfaces(roles) {
|
|
211
|
+
return createVariantSurfaces({
|
|
171
212
|
background: "transparent",
|
|
172
213
|
hover: roles.lightHover,
|
|
173
214
|
active: roles.lightActive,
|
|
174
|
-
|
|
175
|
-
|
|
176
|
-
|
|
177
|
-
|
|
178
|
-
|
|
179
|
-
borderActive: "transparent"
|
|
180
|
-
};
|
|
181
|
-
if (variant === "plain") return {
|
|
215
|
+
border: "transparent"
|
|
216
|
+
});
|
|
217
|
+
}
|
|
218
|
+
function createPlainVariantSurfaces() {
|
|
219
|
+
return createVariantSurfaces({
|
|
182
220
|
background: "transparent",
|
|
183
221
|
hover: "transparent",
|
|
184
222
|
active: "transparent",
|
|
185
|
-
|
|
186
|
-
|
|
187
|
-
|
|
188
|
-
|
|
189
|
-
|
|
190
|
-
borderActive: "transparent"
|
|
191
|
-
};
|
|
192
|
-
return {
|
|
223
|
+
border: "transparent"
|
|
224
|
+
});
|
|
225
|
+
}
|
|
226
|
+
function createDefaultVariantSurfaces(roles) {
|
|
227
|
+
return createVariantSurfaces({
|
|
193
228
|
background: "var(--rp-color-default)",
|
|
194
229
|
hover: roles.lightHover,
|
|
195
230
|
active: roles.lightActive,
|
|
196
|
-
color: roles.foreground,
|
|
197
|
-
colorHover: roles.foreground,
|
|
198
|
-
colorActive: roles.foreground,
|
|
199
231
|
border: roles.outline,
|
|
200
|
-
borderHover: roles.outlineHover
|
|
201
|
-
|
|
232
|
+
borderHover: roles.outlineHover
|
|
233
|
+
});
|
|
234
|
+
}
|
|
235
|
+
function createVariantSurfaces({ background, hover, active, border, borderHover = border, borderActive = borderHover }) {
|
|
236
|
+
return {
|
|
237
|
+
background,
|
|
238
|
+
hover,
|
|
239
|
+
active,
|
|
240
|
+
border,
|
|
241
|
+
borderHover,
|
|
242
|
+
borderActive
|
|
202
243
|
};
|
|
203
244
|
}
|
|
204
245
|
function createComponentColorRoles(color, overrides = {}) {
|
|
@@ -322,4 +363,4 @@ function relativeLuminance(color) {
|
|
|
322
363
|
return .2126 * red + .7152 * green + .0722 * blue;
|
|
323
364
|
}
|
|
324
365
|
//#endregion
|
|
325
|
-
export { getComponentVariantColorRoles as a,
|
|
366
|
+
export { getComponentVariantColorRoles as a, getComponentColorValue as i, getComponentCheckedColorStyle as n, getComponentColorRoles as r, componentColors as t };
|
|
@@ -0,0 +1,26 @@
|
|
|
1
|
+
import { nextTick } from "vue";
|
|
2
|
+
//#region src/utils/dom/componentRef.ts
|
|
3
|
+
function asHTMLElement(value) {
|
|
4
|
+
if (value == null || typeof value !== "object") return null;
|
|
5
|
+
const ElementConstructor = ("ownerDocument" in value ? value.ownerDocument : null)?.defaultView?.HTMLElement;
|
|
6
|
+
if (ElementConstructor && value instanceof ElementConstructor) return value;
|
|
7
|
+
if (typeof HTMLElement !== "undefined" && value instanceof HTMLElement) return value;
|
|
8
|
+
return null;
|
|
9
|
+
}
|
|
10
|
+
function toHTMLElement(value, fallbackId) {
|
|
11
|
+
const directElement = asHTMLElement(value);
|
|
12
|
+
if (directElement) return directElement;
|
|
13
|
+
const vdomElement = asHTMLElement(value?.$el);
|
|
14
|
+
if (vdomElement) return vdomElement;
|
|
15
|
+
const vaporBlock = asHTMLElement(value?.block);
|
|
16
|
+
if (vaporBlock) return vaporBlock;
|
|
17
|
+
return fallbackId && typeof document !== "undefined" ? document.getElementById(fallbackId) : null;
|
|
18
|
+
}
|
|
19
|
+
function resolveHTMLElementRef(value, fallbackId, resolve) {
|
|
20
|
+
const element = toHTMLElement(value, fallbackId);
|
|
21
|
+
resolve(element);
|
|
22
|
+
if (element || !value) return;
|
|
23
|
+
nextTick(() => resolve(toHTMLElement(value, fallbackId)));
|
|
24
|
+
}
|
|
25
|
+
//#endregion
|
|
26
|
+
export { toHTMLElement as n, resolveHTMLElementRef as t };
|
|
@@ -0,0 +1,14 @@
|
|
|
1
|
+
import { AccordionItemValue, AccordionModelValue } from './types.js';
|
|
2
|
+
type AccordionValueTransition = {
|
|
3
|
+
changed: false;
|
|
4
|
+
} | {
|
|
5
|
+
changed: true;
|
|
6
|
+
modelValue: AccordionModelValue;
|
|
7
|
+
};
|
|
8
|
+
interface AccordionValueTransitionOptions {
|
|
9
|
+
multiple: boolean;
|
|
10
|
+
collapsible: boolean;
|
|
11
|
+
}
|
|
12
|
+
export declare function readAccordionOpenValues(value: AccordionModelValue | undefined, multiple: boolean): AccordionItemValue[];
|
|
13
|
+
export declare function transitionAccordionValue(currentValue: AccordionModelValue | undefined, itemValue: AccordionItemValue, open: boolean, options: AccordionValueTransitionOptions): AccordionValueTransition;
|
|
14
|
+
export {};
|
|
@@ -1,5 +1,6 @@
|
|
|
1
1
|
export { default as Accordion } from './accordion.js';
|
|
2
2
|
export { default as AccordionItem } from './accordion-item.js';
|
|
3
|
-
export { useAccordion
|
|
3
|
+
export { useAccordion } from './useAccordion.js';
|
|
4
|
+
export { useAccordionItem } from './useAccordionItem.js';
|
|
4
5
|
export { accordionItemParts, accordionParts } from './types.js';
|
|
5
6
|
export type { AccordionItemPart, AccordionContentProps, AccordionContext, AccordionItemProps, AccordionItemRootProps, AccordionItemSlotProps, AccordionItemTriggerSlotProps, AccordionItemValue, AccordionModelValue, AccordionPart, AccordionProps, AccordionRootProps, AccordionState, AccordionTriggerProps, UseAccordionItemReturn, UseAccordionReturn, } from './types.js';
|
|
@@ -1,2 +1,2 @@
|
|
|
1
|
-
import { a as
|
|
1
|
+
import { a as useAccordion, i as accordion_default, n as accordionParts, o as useAccordionItem, r as accordion_item_default, t as accordionItemParts } from "../../accordion.js";
|
|
2
2
|
export { accordion_default as Accordion, accordion_item_default as AccordionItem, accordionItemParts, accordionParts, useAccordion, useAccordionItem };
|
|
@@ -1,4 +1,4 @@
|
|
|
1
|
-
import { ComputedRef, HTMLAttributes
|
|
1
|
+
import { ComputedRef, HTMLAttributes } from 'vue';
|
|
2
2
|
import { StylesApiProps } from '../../styles-api.js';
|
|
3
3
|
import { CollapseContentProps, CollapseContentRole, CollapseTriggerProps } from '../collapse/types.js';
|
|
4
4
|
export type AccordionItemValue = string | number;
|
|
@@ -98,4 +98,3 @@ export interface UseAccordionItemReturn {
|
|
|
98
98
|
close: () => void;
|
|
99
99
|
toggle: () => void;
|
|
100
100
|
}
|
|
101
|
-
export declare const accordionKey: InjectionKey<AccordionContext>;
|
|
@@ -1,3 +1,3 @@
|
|
|
1
|
-
import {
|
|
1
|
+
import { AccordionModelValue, AccordionProps, UseAccordionReturn } from './types.js';
|
|
2
2
|
export declare function useAccordion(props: Readonly<AccordionProps>, emitUpdate: (value: AccordionModelValue) => void): UseAccordionReturn;
|
|
3
|
-
export
|
|
3
|
+
export { useAccordionItem } from './useAccordionItem.js';
|
|
@@ -1,10 +1,9 @@
|
|
|
1
|
-
import { CSSProperties } from 'vue';
|
|
2
1
|
import { CheckboxProps } from './types.js';
|
|
3
2
|
export declare function useCheckbox(props: Readonly<CheckboxProps>, emitUpdate: (value: boolean) => void, getValue?: () => boolean): {
|
|
4
3
|
inputRef: import('vue').Ref<HTMLInputElement | null, HTMLInputElement | null>;
|
|
5
4
|
control: import('../../internal/composables/useControlState.js').ControlState;
|
|
6
5
|
rootClass: import('vue').ComputedRef<string[]>;
|
|
7
|
-
rootStyle: import('vue').ComputedRef<
|
|
6
|
+
rootStyle: import('vue').ComputedRef<Record<string, string> | undefined>;
|
|
8
7
|
onChange: (e: Event) => void;
|
|
9
8
|
focus: (options?: FocusOptions) => void;
|
|
10
9
|
};
|
|
@@ -1,3 +1,3 @@
|
|
|
1
|
-
import { t as color_picker_default } from "../../color-picker.js";
|
|
2
|
-
import { n as
|
|
1
|
+
import { n as colorPickerFormats, t as color_picker_default } from "../../color-picker.js";
|
|
2
|
+
import { n as colorPickerSizes, t as colorPickerParts } from "../../color-picker2.js";
|
|
3
3
|
export { color_picker_default as ColorPicker, colorPickerFormats, colorPickerParts, colorPickerSizes };
|
|
@@ -1,10 +1,10 @@
|
|
|
1
1
|
import { HTMLAttributes } from 'vue';
|
|
2
|
+
import { colorPickerFormats, ColorPickerFormat } from '../../utils/colorPicker.js';
|
|
2
3
|
import { StylesApiProps } from '../../styles-api.js';
|
|
4
|
+
export { colorPickerFormats, type ColorPickerFormat };
|
|
3
5
|
export declare const colorPickerParts: readonly ["root", "label", "control", "handle", "swatches", "swatch"];
|
|
4
6
|
export type ColorPickerPart = (typeof colorPickerParts)[number];
|
|
5
|
-
export declare const colorPickerFormats: readonly ["hex", "hexa", "rgb", "rgba", "hsl", "hsla"];
|
|
6
7
|
export declare const colorPickerSizes: readonly ["xs", "sm", "md", "lg", "xl"];
|
|
7
|
-
export type ColorPickerFormat = (typeof colorPickerFormats)[number];
|
|
8
8
|
export type ColorPickerSize = (typeof colorPickerSizes)[number];
|
|
9
9
|
export interface ColorPickerSelection {
|
|
10
10
|
saturation: number;
|
|
@@ -0,0 +1,22 @@
|
|
|
1
|
+
import { ComponentElementRef } from '../../utils/dom/componentRef.js';
|
|
2
|
+
import { ColorPickerSelection } from './types.js';
|
|
3
|
+
type ColorPickerAxis = 'saturation' | 'value';
|
|
4
|
+
interface UseColorPickerSaturationOptions {
|
|
5
|
+
modelValue: () => Readonly<ColorPickerSelection>;
|
|
6
|
+
hue: () => number;
|
|
7
|
+
readonly: () => boolean;
|
|
8
|
+
onChange: (selection: ColorPickerSelection) => void;
|
|
9
|
+
}
|
|
10
|
+
export declare function useColorPickerSaturation({ modelValue, hue, readonly, onChange, }: UseColorPickerSaturationOptions): {
|
|
11
|
+
setSaturationElement: (value: ComponentElementRef) => void;
|
|
12
|
+
setSaturationInput: (value: ComponentElementRef) => void;
|
|
13
|
+
selection: import('vue').ComputedRef<{
|
|
14
|
+
saturation: number;
|
|
15
|
+
value: number;
|
|
16
|
+
}>;
|
|
17
|
+
normalizedHue: import('vue').ComputedRef<number>;
|
|
18
|
+
onPointerDown: (event: PointerEvent) => void;
|
|
19
|
+
onAxisKeydown: (event: KeyboardEvent, axis: ColorPickerAxis) => void;
|
|
20
|
+
onAxisInput: (event: Event, axis: ColorPickerAxis) => void;
|
|
21
|
+
};
|
|
22
|
+
export {};
|
|
@@ -0,0 +1,20 @@
|
|
|
1
|
+
import { ComponentElementRef } from '../../utils/dom/componentRef.js';
|
|
2
|
+
import { ColorPickerSliderVariant } from './types.js';
|
|
3
|
+
interface UseColorPickerSliderOptions {
|
|
4
|
+
variant: () => ColorPickerSliderVariant;
|
|
5
|
+
value: () => number;
|
|
6
|
+
readonly: () => boolean;
|
|
7
|
+
onChange: (value: number) => void;
|
|
8
|
+
}
|
|
9
|
+
export declare function useColorPickerSlider({ variant, value, readonly, onChange, }: UseColorPickerSliderOptions): {
|
|
10
|
+
setSliderElement: (element: ComponentElementRef) => void;
|
|
11
|
+
sliderState: import('vue').ComputedRef<{
|
|
12
|
+
isHue: boolean;
|
|
13
|
+
max: number;
|
|
14
|
+
value: number;
|
|
15
|
+
outputValue: number;
|
|
16
|
+
}>;
|
|
17
|
+
onPointerDown: (event: PointerEvent) => void;
|
|
18
|
+
onKeydown: (event: KeyboardEvent) => void;
|
|
19
|
+
};
|
|
20
|
+
export {};
|
|
@@ -1,4 +1,4 @@
|
|
|
1
|
-
import { ColorPickerHsvColor } from '
|
|
1
|
+
import { ColorPickerHsvColor } from '../../utils/colorPicker.js';
|
|
2
2
|
import { ColorPickerProps, ColorPickerSelection, ColorPickerValue } from './types.js';
|
|
3
3
|
type ColorPickerValueProps = Readonly<Pick<ColorPickerProps, 'modelValue' | 'format' | 'readonly'>>;
|
|
4
4
|
export declare function useColorPickerValue(props: ColorPickerValueProps, emitUpdate: (value: ColorPickerValue) => void): {
|
|
@@ -1,4 +1,4 @@
|
|
|
1
|
-
import {
|
|
1
|
+
import { ComputedRef, InjectionKey, Ref } from 'vue';
|
|
2
2
|
import { OverlayLayerContext } from '../../internal/composables/useOverlayLayer.js';
|
|
3
3
|
import { DialogCloseReason } from './types.js';
|
|
4
4
|
export interface DialogRootContext {
|
|
@@ -22,8 +22,4 @@ export interface DialogRootContext {
|
|
|
22
22
|
registerDescription: (id: string) => () => void;
|
|
23
23
|
}
|
|
24
24
|
export declare const dialogRootKey: InjectionKey<DialogRootContext>;
|
|
25
|
-
export type DialogElementRefValue = Element | ComponentPublicInstance | VaporComponentInstance | null;
|
|
26
25
|
export declare function resolveDialogCloseReason(reason: unknown): DialogCloseReason;
|
|
27
|
-
export declare function toDialogHTMLElement(value: DialogElementRefValue): HTMLElement | null;
|
|
28
|
-
export declare function resolveDialogHTMLElementRef(value: DialogElementRefValue, fallbackId: string, resolve: (element: HTMLElement | null) => void): void;
|
|
29
|
-
export declare function createDialogEvent<T>(type: string, detail: T, originalEvent: Event): CustomEvent<T>;
|
|
@@ -0,0 +1,18 @@
|
|
|
1
|
+
import { ComponentElementRef } from '../../utils/dom/componentRef.js';
|
|
2
|
+
import { DialogRootContext } from './dialogContext.js';
|
|
3
|
+
import { DialogContentProps, DialogFocusTrapOptions, DialogInteractOutsideEvent } from './types.js';
|
|
4
|
+
type DialogContentInteractionProps = Readonly<DialogContentProps & {
|
|
5
|
+
focusTrapOptions: DialogFocusTrapOptions;
|
|
6
|
+
}>;
|
|
7
|
+
interface DialogContentInteractionEvents {
|
|
8
|
+
escapeKeyDown: (event: CustomEvent<{
|
|
9
|
+
originalEvent: KeyboardEvent;
|
|
10
|
+
}>) => void;
|
|
11
|
+
pointerDownOutside: (event: DialogInteractOutsideEvent) => void;
|
|
12
|
+
interactOutside: (event: DialogInteractOutsideEvent) => void;
|
|
13
|
+
}
|
|
14
|
+
export declare function useDialogContentInteractions(root: DialogRootContext, props: DialogContentInteractionProps, events: Readonly<DialogContentInteractionEvents>): {
|
|
15
|
+
id: import('vue').ComputedRef<string>;
|
|
16
|
+
setElement: (value: ComponentElementRef) => void;
|
|
17
|
+
};
|
|
18
|
+
export {};
|
|
@@ -0,0 +1,19 @@
|
|
|
1
|
+
import { DialogRootContext } from './dialogContext.js';
|
|
2
|
+
import { DialogCloseReason, DialogRootProps, DialogRootSlotProps } from './types.js';
|
|
3
|
+
type DialogRootStateProps = Readonly<DialogRootProps & {
|
|
4
|
+
defaultOpen: boolean;
|
|
5
|
+
modal: boolean;
|
|
6
|
+
closeOnEscape: boolean;
|
|
7
|
+
closeOnOutsideClick: boolean;
|
|
8
|
+
preventScroll: boolean;
|
|
9
|
+
returnFocus: boolean;
|
|
10
|
+
}>;
|
|
11
|
+
interface DialogRootStateEvents {
|
|
12
|
+
openChange: (open: boolean) => void;
|
|
13
|
+
close: (reason: DialogCloseReason) => void;
|
|
14
|
+
}
|
|
15
|
+
export declare function useDialogRootState(props: DialogRootStateProps, events: Readonly<DialogRootStateEvents>): {
|
|
16
|
+
context: DialogRootContext;
|
|
17
|
+
slotProps: import('vue').ComputedRef<DialogRootSlotProps>;
|
|
18
|
+
};
|
|
19
|
+
export {};
|
|
@@ -1,4 +1,4 @@
|
|
|
1
|
-
import { ItemPath } from './dropdown-menu-
|
|
1
|
+
import { ItemPath } from './dropdown-menu-model.js';
|
|
2
2
|
import { DropdownMenuItem, DropdownMenuItemSlotProps } from './types.js';
|
|
3
3
|
import { DropdownMenuRenderContext } from './useDropdownMenuRenderItems.js';
|
|
4
4
|
declare const __VLS_export: (__VLS_props: NonNullable<Awaited<typeof __VLS_setup>>["props"], __VLS_ctx?: __VLS_PrettifyLocal<Pick<NonNullable<Awaited<typeof __VLS_setup>>, "attrs" | "emit" | "slots">>, __VLS_exposed?: NonNullable<Awaited<typeof __VLS_setup>>["expose"], __VLS_setup?: Promise<{
|
|
@@ -1,4 +1,4 @@
|
|
|
1
|
-
import { ItemPath } from './dropdown-menu-
|
|
1
|
+
import { ItemPath } from './dropdown-menu-model.js';
|
|
2
2
|
import { DropdownMenuItem, DropdownMenuItemSlotProps } from './types.js';
|
|
3
3
|
import { DropdownMenuRenderContext } from './useDropdownMenuRenderItems.js';
|
|
4
4
|
declare const __VLS_export: (__VLS_props: NonNullable<Awaited<typeof __VLS_setup>>["props"], __VLS_ctx?: __VLS_PrettifyLocal<Pick<NonNullable<Awaited<typeof __VLS_setup>>, "attrs" | "emit" | "slots">>, __VLS_exposed?: NonNullable<Awaited<typeof __VLS_setup>>["expose"], __VLS_setup?: Promise<{
|
|
@@ -0,0 +1,8 @@
|
|
|
1
|
+
import { DropdownMenuFocusTarget, DropdownMenuItem, DropdownMenuItemPath, DropdownMenuPlacement } from './types.js';
|
|
2
|
+
export declare const DEFAULT_PLACEMENT: DropdownMenuPlacement;
|
|
3
|
+
export declare const DEFAULT_FOCUS_TARGET: DropdownMenuFocusTarget;
|
|
4
|
+
export type ItemPath = DropdownMenuItemPath;
|
|
5
|
+
export type SubmenuFocusTarget = DropdownMenuFocusTarget | false;
|
|
6
|
+
export declare function getItemClass(item: DropdownMenuItem, focused: boolean, disabled: boolean, hasSubmenu: boolean, submenuOpen: boolean): string[];
|
|
7
|
+
export declare function hasItemSubmenu(item: DropdownMenuItem): boolean;
|
|
8
|
+
export declare function hasNestedItems(items: DropdownMenuItem[]): boolean;
|
|
@@ -1,4 +1,4 @@
|
|
|
1
|
-
import {
|
|
1
|
+
import { DropdownMenuFocusTarget, DropdownMenuOpenOptions, DropdownMenuPoint, DropdownMenuRootPrimitiveProps, DropdownMenuRootSlotProps } from './types.js';
|
|
2
2
|
declare const __VLS_export: (__VLS_props: NonNullable<Awaited<typeof __VLS_setup>>["props"], __VLS_ctx?: __VLS_PrettifyLocal<Pick<NonNullable<Awaited<typeof __VLS_setup>>, "attrs" | "emit" | "slots">>, __VLS_exposed?: NonNullable<Awaited<typeof __VLS_setup>>["expose"], __VLS_setup?: Promise<{
|
|
3
3
|
props: import('vue').PublicProps & __VLS_PrettifyLocal<DropdownMenuRootPrimitiveProps & {
|
|
4
4
|
"onUpdate:open"?: ((value: boolean) => any) | undefined;
|
|
@@ -7,7 +7,7 @@ declare const __VLS_export: (__VLS_props: NonNullable<Awaited<typeof __VLS_setup
|
|
|
7
7
|
} ? P : {});
|
|
8
8
|
expose: (exposed: import('vue').ShallowUnwrapRef<{
|
|
9
9
|
open: (options?: DropdownMenuOpenOptions | DropdownMenuFocusTarget) => void;
|
|
10
|
-
close: (options?: DropdownMenuCloseOptions & {
|
|
10
|
+
close: (options?: import('./types.js').DropdownMenuCloseOptions & {
|
|
11
11
|
returnFocus?: boolean;
|
|
12
12
|
}) => void;
|
|
13
13
|
toggle: () => void;
|
|
@@ -1,4 +1,4 @@
|
|
|
1
|
-
import { OpenFocusTarget } from './
|
|
1
|
+
import { OpenFocusTarget } from './dropdownMenuContext.js';
|
|
2
2
|
import { DropdownMenuSubTriggerPrimitiveProps } from './types.js';
|
|
3
3
|
declare const __VLS_export: (__VLS_props: NonNullable<Awaited<typeof __VLS_setup>>["props"], __VLS_ctx?: __VLS_PrettifyLocal<Pick<NonNullable<Awaited<typeof __VLS_setup>>, "attrs" | "emit" | "slots">>, __VLS_exposed?: NonNullable<Awaited<typeof __VLS_setup>>["expose"], __VLS_setup?: Promise<{
|
|
4
4
|
props: import('vue').PublicProps & __VLS_PrettifyLocal<DropdownMenuSubTriggerPrimitiveProps> & (typeof globalThis extends {
|