@varlet/ui 3.20.8 → 3.20.9
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/es/auto-complete/AutoComplete.mjs +2 -1
- package/es/auto-complete/props.mjs +4 -0
- package/es/index.bundle.mjs +1 -1
- package/es/index.mjs +1 -1
- package/es/menu/Menu.mjs +1 -0
- package/es/menu/menu.css +1 -1
- package/es/menu/props.mjs +4 -0
- package/es/menu-select/MenuChildren.mjs +10 -9
- package/es/menu-select/MenuSelect.mjs +13 -3
- package/es/menu-select/menuSelect.css +1 -1
- package/es/menu-select/props.mjs +1 -0
- package/es/select/Select.mjs +8 -2
- package/es/select/props.mjs +4 -0
- package/es/select/select.css +1 -1
- package/es/snackbar/style/index.mjs +1 -1
- package/es/themes/dark/menu.mjs +2 -1
- package/es/themes/dark/menuSelect.mjs +2 -1
- package/es/themes/dark/select.mjs +1 -0
- package/es/themes/md3-dark/menu.mjs +2 -1
- package/es/themes/md3-dark/menuSelect.mjs +1 -0
- package/es/themes/md3-dark/select.mjs +1 -0
- package/es/themes/md3-light/menu.mjs +2 -1
- package/es/themes/md3-light/menuSelect.mjs +1 -0
- package/es/themes/md3-light/select.mjs +1 -0
- package/es/varlet.css +1 -1
- package/es/varlet.esm.js +2128 -2093
- package/highlight/web-types.en-US.json +37 -1
- package/highlight/web-types.zh-CN.json +37 -1
- package/lib/varlet.cjs.js +58 -24
- package/lib/varlet.css +1 -1
- package/package.json +7 -7
- package/types/autoComplete.d.ts +3 -0
- package/types/menu.d.ts +3 -0
- package/types/menuSelect.d.ts +3 -0
- package/types/select.d.ts +3 -0
- package/types/styleVars.d.ts +3 -0
- package/umd/varlet.js +7 -7
|
@@ -51,6 +51,7 @@ function __render__(_ctx, _cache) {
|
|
|
51
51
|
scrollable: "",
|
|
52
52
|
trigger: "manual",
|
|
53
53
|
placement: "bottom",
|
|
54
|
+
radius: _ctx.menuRadius,
|
|
54
55
|
disabled: _ctx.disabled || _ctx.formDisabled || _ctx.readonly || _ctx.formReadonly,
|
|
55
56
|
class: _normalizeClass(_ctx.n("menu-select")),
|
|
56
57
|
"popover-class": _ctx.variant === "standard" ? _ctx.n("--standard-menu-margin") : _ctx.variant === "filled" ? _ctx.n("--filled-menu-margin") : "",
|
|
@@ -147,7 +148,7 @@ function __render__(_ctx, _cache) {
|
|
|
147
148
|
]),
|
|
148
149
|
_: 3
|
|
149
150
|
/* FORWARDED */
|
|
150
|
-
}, 8, ["show", "disabled", "class", "popover-class", "onUpdate:modelValue", "onKeyEscape"]),
|
|
151
|
+
}, 8, ["show", "radius", "disabled", "class", "popover-class", "onUpdate:modelValue", "onKeyEscape"]),
|
|
151
152
|
_createVNode(_component_var_form_details, {
|
|
152
153
|
"error-message": _ctx.errorMessage,
|
|
153
154
|
"extra-message": _ctx.maxlengthText
|
package/es/index.bundle.mjs
CHANGED
|
@@ -310,7 +310,7 @@ import './tree-menu/style/index.mjs'
|
|
|
310
310
|
import './uploader/style/index.mjs'
|
|
311
311
|
import './watermark/style/index.mjs'
|
|
312
312
|
|
|
313
|
-
const version = '3.20.
|
|
313
|
+
const version = '3.20.9'
|
|
314
314
|
|
|
315
315
|
function install(app) {
|
|
316
316
|
ActionSheet.install && app.use(ActionSheet)
|
package/es/index.mjs
CHANGED
|
@@ -206,7 +206,7 @@ export * from './tree-menu/index.mjs'
|
|
|
206
206
|
export * from './uploader/index.mjs'
|
|
207
207
|
export * from './watermark/index.mjs'
|
|
208
208
|
|
|
209
|
-
const version = '3.20.
|
|
209
|
+
const version = '3.20.9'
|
|
210
210
|
|
|
211
211
|
function install(app) {
|
|
212
212
|
ActionSheet.install && app.use(ActionSheet)
|
package/es/menu/Menu.mjs
CHANGED
|
@@ -38,6 +38,7 @@ function __render__(_ctx, _cache) {
|
|
|
38
38
|
_ctx.n("menu"),
|
|
39
39
|
_ctx.n("$--box"),
|
|
40
40
|
_ctx.n("$--scrollbar"),
|
|
41
|
+
[_ctx.radius !== "normal", _ctx.n(`--radius-${_ctx.radius}`)],
|
|
41
42
|
_ctx.popoverClass,
|
|
42
43
|
[_ctx.defaultStyle, _ctx.n("--menu-background-color")],
|
|
43
44
|
[_ctx.defaultStyle, _ctx.formatElevation(_ctx.elevation, 3)]
|
package/es/menu/menu.css
CHANGED
|
@@ -1 +1 @@
|
|
|
1
|
-
:root { --menu-background-color: var(--color-surface-container-high); --menu-border-radius: 2px;}.var-menu { display: inline-flex; outline: none;}.var-menu__menu { --scrollbar-track-background: var(--menu-background-color); border-radius: var(--menu-border-radius);}.var-menu-enter-from,.var-menu-leave-to { opacity: 0; transform: scale(0.8);}.var-menu-enter-active,.var-menu-leave-active { transition-property: opacity, transform; transition-duration: 0.2s;}.var-menu--menu-background-color { background: var(--menu-background-color);}
|
|
1
|
+
:root { --menu-background-color: var(--color-surface-container-high); --menu-border-radius: 2px; --menu-large-border-radius: 8px;}.var-menu { display: inline-flex; outline: none;}.var-menu__menu { --scrollbar-track-background: var(--menu-background-color); border-radius: var(--menu-border-radius);}.var-menu--radius-large { border-radius: var(--menu-large-border-radius);}.var-menu-enter-from,.var-menu-leave-to { opacity: 0; transform: scale(0.8);}.var-menu-enter-active,.var-menu-leave-active { transition-property: opacity, transform; transition-duration: 0.2s;}.var-menu--menu-background-color { background: var(--menu-background-color);}
|
package/es/menu/props.mjs
CHANGED
|
@@ -42,8 +42,7 @@ import { createNamespace, defineListenerProp, pickProps } from "../utils/compone
|
|
|
42
42
|
import { focusChildElementByKey } from "../utils/elements.mjs";
|
|
43
43
|
import { props as menuSelectProps } from "./props.mjs";
|
|
44
44
|
const { name, n } = createNamespace("menu-children");
|
|
45
|
-
import { resolveComponent as _resolveComponent, createVNode as _createVNode, renderList as _renderList, Fragment as _Fragment, openBlock as _openBlock, createElementBlock as _createElementBlock, createBlock as _createBlock, createElementVNode as _createElementVNode, normalizeClass as _normalizeClass, withCtx as _withCtx, createSlots as _createSlots } from "vue";
|
|
46
|
-
const _hoisted_1 = { ref: "menuOptions" };
|
|
45
|
+
import { resolveComponent as _resolveComponent, createVNode as _createVNode, renderList as _renderList, Fragment as _Fragment, openBlock as _openBlock, createElementBlock as _createElementBlock, createBlock as _createBlock, mergeProps as _mergeProps, createElementVNode as _createElementVNode, normalizeClass as _normalizeClass, withCtx as _withCtx, createSlots as _createSlots } from "vue";
|
|
47
46
|
function __render__(_ctx, _cache) {
|
|
48
47
|
const _component_var_menu_option = _resolveComponent("var-menu-option");
|
|
49
48
|
const _component_var_menu_children = _resolveComponent("var-menu-children");
|
|
@@ -56,8 +55,9 @@ function __render__(_ctx, _cache) {
|
|
|
56
55
|
placement: "right-start",
|
|
57
56
|
"cascade-optimization": "",
|
|
58
57
|
"var-menu-children-cover": "",
|
|
59
|
-
class: _normalizeClass(_ctx.n()),
|
|
58
|
+
class: _normalizeClass([_ctx.n(), _ctx.radius !== "normal" ? _ctx.n(`--menu-radius-${_ctx.radius}`) : void 0]),
|
|
60
59
|
disabled: _ctx.disabled,
|
|
60
|
+
radius: _ctx.radius,
|
|
61
61
|
teleport: false,
|
|
62
62
|
"close-on-click-reference": false
|
|
63
63
|
}, _createSlots({
|
|
@@ -83,7 +83,7 @@ function __render__(_ctx, _cache) {
|
|
|
83
83
|
fn: _withCtx(() => [
|
|
84
84
|
_createElementVNode(
|
|
85
85
|
"div",
|
|
86
|
-
|
|
86
|
+
_mergeProps({ ref: "menuOptions" }, _ctx.radius !== "normal" ? { class: _ctx.n(`--radius-${_ctx.radius}`) } : {}),
|
|
87
87
|
[
|
|
88
88
|
(_openBlock(true), _createElementBlock(
|
|
89
89
|
_Fragment,
|
|
@@ -104,10 +104,11 @@ function __render__(_ctx, _cache) {
|
|
|
104
104
|
options: menuOption[_ctx.childrenKey],
|
|
105
105
|
"highlight-options": _ctx.highlightOptions,
|
|
106
106
|
disabled: menuOption.disabled,
|
|
107
|
+
radius: _ctx.radius,
|
|
107
108
|
onKeyArrowX: _ctx.handleArrowLeft,
|
|
108
109
|
onKeyArrowRightOpen: ($event) => _ctx.allowChildrenClose(menuOption),
|
|
109
110
|
onMouseenter: ($event) => _ctx.allowChildrenClose(menuOption)
|
|
110
|
-
}, null, 8, ["parent-show", "option", "options", "highlight-options", "disabled", "onKeyArrowX", "onKeyArrowRightOpen", "onMouseenter"])) : (_openBlock(), _createBlock(_component_var_menu_option, {
|
|
111
|
+
}, null, 8, ["parent-show", "option", "options", "highlight-options", "disabled", "radius", "onKeyArrowX", "onKeyArrowRightOpen", "onMouseenter"])) : (_openBlock(), _createBlock(_component_var_menu_option, {
|
|
111
112
|
key: 1,
|
|
112
113
|
label: menuOption[_ctx.labelKey],
|
|
113
114
|
value: menuOption[_ctx.valueKey],
|
|
@@ -126,13 +127,13 @@ function __render__(_ctx, _cache) {
|
|
|
126
127
|
/* KEYED_FRAGMENT */
|
|
127
128
|
))
|
|
128
129
|
],
|
|
129
|
-
|
|
130
|
-
/*
|
|
130
|
+
16
|
|
131
|
+
/* FULL_PROPS */
|
|
131
132
|
)
|
|
132
133
|
]),
|
|
133
134
|
key: "0"
|
|
134
135
|
} : void 0
|
|
135
|
-
]), 1032, ["show", "class", "disabled"]);
|
|
136
|
+
]), 1032, ["show", "class", "disabled", "radius"]);
|
|
136
137
|
}
|
|
137
138
|
const __sfc__ = defineComponent({
|
|
138
139
|
name,
|
|
@@ -151,7 +152,7 @@ const __sfc__ = defineComponent({
|
|
|
151
152
|
onKeyArrowX: defineListenerProp(),
|
|
152
153
|
onKeyArrowRightOpen: defineListenerProp(),
|
|
153
154
|
onMouseenter: defineListenerProp()
|
|
154
|
-
}, pickProps(menuSelectProps, ["options", "valueKey", "labelKey", "childrenKey"])),
|
|
155
|
+
}, pickProps(menuSelectProps, ["options", "valueKey", "labelKey", "childrenKey", "radius"])),
|
|
155
156
|
setup(props) {
|
|
156
157
|
const show = ref(false);
|
|
157
158
|
const menu = ref();
|
|
@@ -49,6 +49,7 @@ function __render__(_ctx, _cache) {
|
|
|
49
49
|
"offset-y": _ctx.offsetY,
|
|
50
50
|
teleport: _ctx.teleport,
|
|
51
51
|
"same-width": _ctx.sameWidth,
|
|
52
|
+
radius: _ctx.radius,
|
|
52
53
|
elevation: _ctx.elevation,
|
|
53
54
|
"default-style": false,
|
|
54
55
|
"popover-class": _ctx.popoverClass,
|
|
@@ -65,7 +66,15 @@ function __render__(_ctx, _cache) {
|
|
|
65
66
|
"div",
|
|
66
67
|
{
|
|
67
68
|
ref: "menuOptionsRef",
|
|
68
|
-
class: _normalizeClass(
|
|
69
|
+
class: _normalizeClass(
|
|
70
|
+
_ctx.classes(
|
|
71
|
+
_ctx.n("menu"),
|
|
72
|
+
_ctx.n("$--scrollbar"),
|
|
73
|
+
_ctx.formatElevation(_ctx.elevation, 3),
|
|
74
|
+
[_ctx.scrollable, _ctx.n("--scrollable")],
|
|
75
|
+
[_ctx.radius !== "normal", _ctx.n(`--radius-${_ctx.radius}`)]
|
|
76
|
+
)
|
|
77
|
+
)
|
|
69
78
|
},
|
|
70
79
|
[
|
|
71
80
|
(_openBlock(true), _createElementBlock(
|
|
@@ -87,9 +96,10 @@ function __render__(_ctx, _cache) {
|
|
|
87
96
|
options: option[_ctx.childrenKey],
|
|
88
97
|
"highlight-options": _ctx.highlightOptions,
|
|
89
98
|
disabled: option.disabled,
|
|
99
|
+
radius: _ctx.radius,
|
|
90
100
|
onKeyArrowRightOpen: ($event) => _ctx.allowChildrenClose(option),
|
|
91
101
|
onMouseenter: ($event) => _ctx.allowChildrenClose(option)
|
|
92
|
-
}, null, 8, ["parent-show", "option", "options", "highlight-options", "disabled", "onKeyArrowRightOpen", "onMouseenter"])) : (_openBlock(), _createBlock(_component_var_menu_option, {
|
|
102
|
+
}, null, 8, ["parent-show", "option", "options", "highlight-options", "disabled", "radius", "onKeyArrowRightOpen", "onMouseenter"])) : (_openBlock(), _createBlock(_component_var_menu_option, {
|
|
93
103
|
key: 1,
|
|
94
104
|
label: option[_ctx.labelKey],
|
|
95
105
|
value: option[_ctx.valueKey],
|
|
@@ -117,7 +127,7 @@ function __render__(_ctx, _cache) {
|
|
|
117
127
|
]),
|
|
118
128
|
_: 3
|
|
119
129
|
/* FORWARDED */
|
|
120
|
-
}, 8, ["show", "class", "disabled", "trigger", "reference", "placement", "strategy", "offset-x", "offset-y", "teleport", "same-width", "elevation", "popover-class", "close-on-click-reference", "onOpen", "onOpened", "onClose", "onClosed", "onClickOutside"]);
|
|
130
|
+
}, 8, ["show", "class", "disabled", "trigger", "reference", "placement", "strategy", "offset-x", "offset-y", "teleport", "same-width", "radius", "elevation", "popover-class", "close-on-click-reference", "onOpen", "onOpened", "onClose", "onClosed", "onClickOutside"]);
|
|
121
131
|
}
|
|
122
132
|
const __sfc__ = defineComponent({
|
|
123
133
|
name,
|
|
@@ -1 +1 @@
|
|
|
1
|
-
:root { --menu-select-menu-max-height: 278px; --menu-select-menu-padding: 0; --menu-select-menu-border-radius: 2px; --menu-select-menu-background-color: var(--color-surface-container-high);}.var-menu-select__menu { --scrollbar-track-background: var(--menu-select-menu-background-color); position: relative; padding: var(--menu-select-menu-padding); border-radius: var(--menu-select-menu-border-radius); background-color: var(--menu-select-menu-background-color);}.var-menu-select--scrollable { overflow-y: auto; max-height: var(--menu-select-menu-max-height);}.var-menu-children[var-menu-children-cover] { width: 100%; display: block;}
|
|
1
|
+
:root { --menu-select-menu-max-height: 278px; --menu-select-menu-padding: 0; --menu-select-menu-border-radius: 2px; --menu-select-menu-large-border-radius: 8px; --menu-select-menu-background-color: var(--color-surface-container-high);}.var-menu-select__menu { --scrollbar-track-background: var(--menu-select-menu-background-color); position: relative; padding: var(--menu-select-menu-padding); border-radius: var(--menu-select-menu-border-radius); background-color: var(--menu-select-menu-background-color);}.var-menu-select--radius-large { border-radius: var(--menu-select-menu-large-border-radius); --menu-select-option-border-radius: var(--menu-select-menu-large-border-radius);}.var-menu-select--scrollable { overflow-y: auto; max-height: var(--menu-select-menu-max-height);}.var-menu-children[var-menu-children-cover] { width: 100%; display: block;}.var-menu-children--menu-radius-large { --menu-large-border-radius: var(--menu-select-menu-large-border-radius);}.var-menu-children--radius-large { border-radius: inherit; --menu-select-option-border-radius: var(--menu-large-border-radius);}.var-menu-select--radius-large > .var-menu-option:first-child,.var-menu-children--radius-large > .var-menu-option:first-child,.var-menu-select--radius-large > .var-menu-children:first-child > .var-menu-option,.var-menu-children--radius-large > .var-menu-children:first-child > .var-menu-option,.var-menu-select--radius-large > :only-child:not(.var-menu-option):not(.var-menu-children) > .var-menu-option:first-child,.var-menu-children--radius-large > :only-child:not(.var-menu-option):not(.var-menu-children) > .var-menu-option:first-child,.var-menu-select--radius-large > :only-child:not(.var-menu-option):not(.var-menu-children) > .var-menu-children:first-child > .var-menu-option,.var-menu-children--radius-large > :only-child:not(.var-menu-option):not(.var-menu-children) > .var-menu-children:first-child > .var-menu-option { border-top-left-radius: var(--menu-select-option-border-radius); border-top-right-radius: var(--menu-select-option-border-radius);}.var-menu-select--radius-large > .var-menu-option:last-child,.var-menu-children--radius-large > .var-menu-option:last-child,.var-menu-select--radius-large > .var-menu-children:last-child > .var-menu-option,.var-menu-children--radius-large > .var-menu-children:last-child > .var-menu-option,.var-menu-select--radius-large > :only-child:not(.var-menu-option):not(.var-menu-children) > .var-menu-option:last-child,.var-menu-children--radius-large > :only-child:not(.var-menu-option):not(.var-menu-children) > .var-menu-option:last-child,.var-menu-select--radius-large > :only-child:not(.var-menu-option):not(.var-menu-children) > .var-menu-children:last-child > .var-menu-option,.var-menu-children--radius-large > :only-child:not(.var-menu-option):not(.var-menu-children) > .var-menu-children:last-child > .var-menu-option { border-bottom-left-radius: var(--menu-select-option-border-radius); border-bottom-right-radius: var(--menu-select-option-border-radius);}.var-menu-select--radius-large > .var-menu-option > .var-menu-option__cover,.var-menu-children--radius-large > .var-menu-option > .var-menu-option__cover,.var-menu-select--radius-large > .var-menu-children > .var-menu-option > .var-menu-option__cover,.var-menu-children--radius-large > .var-menu-children > .var-menu-option > .var-menu-option__cover,.var-menu-select--radius-large > :only-child:not(.var-menu-option):not(.var-menu-children) > .var-menu-option > .var-menu-option__cover,.var-menu-children--radius-large > :only-child:not(.var-menu-option):not(.var-menu-children) > .var-menu-option > .var-menu-option__cover,.var-menu-select--radius-large > :only-child:not(.var-menu-option):not(.var-menu-children) > .var-menu-children > .var-menu-option > .var-menu-option__cover,.var-menu-children--radius-large > :only-child:not(.var-menu-option):not(.var-menu-children) > .var-menu-children > .var-menu-option > .var-menu-option__cover,.var-menu-select--radius-large > :only-child:not(.var-menu-option):not(.var-menu-children),.var-menu-children--radius-large > :only-child:not(.var-menu-option):not(.var-menu-children) { border-radius: inherit;}
|
package/es/menu-select/props.mjs
CHANGED
package/es/select/Select.mjs
CHANGED
|
@@ -87,6 +87,7 @@ function __render__(_ctx, _cache) {
|
|
|
87
87
|
class: _normalizeClass(_ctx.n("menu")),
|
|
88
88
|
"popover-class": _ctx.variant === "standard" && _ctx.hint && !_ctx.filterable ? _ctx.n("--standard-menu-margin") : void 0,
|
|
89
89
|
"offset-y": _ctx.offsetY,
|
|
90
|
+
radius: _ctx.menuRadius,
|
|
90
91
|
disabled: _ctx.formReadonly || _ctx.readonly || _ctx.formDisabled || _ctx.disabled,
|
|
91
92
|
placement: _ctx.placement,
|
|
92
93
|
"default-style": false,
|
|
@@ -97,7 +98,12 @@ function __render__(_ctx, _cache) {
|
|
|
97
98
|
"div",
|
|
98
99
|
{
|
|
99
100
|
ref: "menuEl",
|
|
100
|
-
class: _normalizeClass(
|
|
101
|
+
class: _normalizeClass(
|
|
102
|
+
_ctx.classes(_ctx.n("scroller"), _ctx.n("$--scrollbar"), _ctx.n("$-elevation--3"), [
|
|
103
|
+
_ctx.menuRadius !== "normal",
|
|
104
|
+
_ctx.n(`--menu-radius-${_ctx.menuRadius}`)
|
|
105
|
+
])
|
|
106
|
+
)
|
|
101
107
|
},
|
|
102
108
|
[
|
|
103
109
|
_ctx.showEmpty ? _renderSlot(_ctx.$slots, "empty", { key: 0 }, () => [
|
|
@@ -364,7 +370,7 @@ function __render__(_ctx, _cache) {
|
|
|
364
370
|
]),
|
|
365
371
|
_: 3
|
|
366
372
|
/* FORWARDED */
|
|
367
|
-
}, 8, ["show", "class", "popover-class", "offset-y", "disabled", "placement", "onClickOutside"]),
|
|
373
|
+
}, 8, ["show", "class", "popover-class", "offset-y", "radius", "disabled", "placement", "onClickOutside"]),
|
|
368
374
|
_createVNode(_component_var_form_details, {
|
|
369
375
|
"error-message": _ctx.errorMessage,
|
|
370
376
|
onClick: _cache[5] || (_cache[5] = _withModifiers(() => {
|
package/es/select/props.mjs
CHANGED
package/es/select/select.css
CHANGED
|
@@ -1 +1 @@
|
|
|
1
|
-
:root { --select-scroller-background: var(--color-surface-container-high); --select-scroller-padding: 6px 0; --select-scroller-max-height: 278px; --select-scroller-border-radius: 2px; --select-chips-margin: -5px 0 0 0; --select-chips-padding: 2px 0; --select-chip-margin: 5px 5px 0 0; --select-chip-background-color: #e0e0e0; --select-arrow-size: 20px; --select-standard-menu-margin: calc(var(--field-decorator-placeholder-size) * 0.75 + 12px) 0 0 0; --select-label-font-size: 16px; --select-empty-text-color: rgba(0, 0, 0, 0.6); --select-empty-height: 38px; --select-empty-font-size: 14px;}.var-select { text-align: left; outline: none;}.var-select__menu[var-select-cover] { width: 100%; background: transparent; display: block;}.var-select__chip[var-select-cover] { margin: var(--select-chip-margin); background-color: var(--select-chip-background-color);}.var-select__chips { padding: var(--select-chips-padding); margin: var(--select-chips-margin);}.var-select__scroller { --scrollbar-track-background: var(--select-scroller-background); position: relative; max-height: var(--select-scroller-max-height); background: var(--select-scroller-background); padding: var(--select-scroller-padding); overflow-y: auto; transition: background-color 0.25s; border-radius: var(--select-scroller-border-radius);}.var-select__select { display: flex; justify-content: space-between; align-items: center; width: 100%; min-height: 24px; outline: none; border: none; font-size: inherit; color: var(--field-decorator-text-color); word-break: break-all; overflow: hidden; transition: color 0.25s;}.var-select__values { display: flex; flex-wrap: wrap; align-items: center;}.var-select__chips { display: flex; flex-wrap: wrap; align-items: center;}.var-select__filter { flex: 1; position: absolute; left: 0; top: 0; height: 100%; border: none; outline: none; padding: 0; background-color: transparent; font-size: var(--field-decorator-placeholder-size); line-height: inherit; color: var(--field-decorator-text-color);}.var-select__filter--multiple { position: unset;}.var-select__chips .var-select__filter { padding-left: 0; margin-top: 4px;}.var-select__filter-calculator { position: absolute; left: 0; top: 0; max-width: 100%; visibility: hidden; white-space: pre; overflow: hidden; pointer-events: none;}.var-select__label { display: flex; align-items: center; font-size: var(--select-label-font-size);}.var-select__placeholder { max-width: 100%; position: absolute; top: 50%; left: 0; transform: translateY(-50%); font-size: var(--field-decorator-placeholder-size); line-height: 1.5em; color: var(--field-decorator-blur-color); pointer-events: none; cursor: inherit;}.var-select__empty { color: var(--select-empty-text-color); text-align: center; height: var(--select-empty-height); font-size: var(--select-empty-font-size); display: flex; align-items: center; justify-content: center;}.var-select__arrow[var-select-cover] { flex-shrink: 0; font-size: var(--select-arrow-size); margin-left: 6px;}.var-select--standard-menu-margin { margin: var(--select-standard-menu-margin) !important;}.var-select--disabled { color: var(--field-decorator-disabled-color); cursor: not-allowed;}.var-select--error { color: var(--field-decorator-error-color);}.var-select--arrow-rotate { transform: rotate(180deg);}.var-select--label-focusing { color: var(--field-decorator-blur-color);}
|
|
1
|
+
:root { --select-scroller-background: var(--color-surface-container-high); --select-scroller-padding: 6px 0; --select-scroller-max-height: 278px; --select-scroller-border-radius: 2px; --select-scroller-large-border-radius: 8px; --select-chips-margin: -5px 0 0 0; --select-chips-padding: 2px 0; --select-chip-margin: 5px 5px 0 0; --select-chip-background-color: #e0e0e0; --select-arrow-size: 20px; --select-standard-menu-margin: calc(var(--field-decorator-placeholder-size) * 0.75 + 12px) 0 0 0; --select-label-font-size: 16px; --select-empty-text-color: rgba(0, 0, 0, 0.6); --select-empty-height: 38px; --select-empty-font-size: 14px;}.var-select { text-align: left; outline: none;}.var-select__menu[var-select-cover] { width: 100%; background: transparent; display: block;}.var-select__chip[var-select-cover] { margin: var(--select-chip-margin); background-color: var(--select-chip-background-color);}.var-select__chips { padding: var(--select-chips-padding); margin: var(--select-chips-margin);}.var-select__scroller { --scrollbar-track-background: var(--select-scroller-background); position: relative; max-height: var(--select-scroller-max-height); background: var(--select-scroller-background); padding: var(--select-scroller-padding); overflow-y: auto; transition: background-color 0.25s; border-radius: var(--select-scroller-border-radius);}.var-select__select { display: flex; justify-content: space-between; align-items: center; width: 100%; min-height: 24px; outline: none; border: none; font-size: inherit; color: var(--field-decorator-text-color); word-break: break-all; overflow: hidden; transition: color 0.25s;}.var-select__values { display: flex; flex-wrap: wrap; align-items: center;}.var-select__chips { display: flex; flex-wrap: wrap; align-items: center;}.var-select__filter { flex: 1; position: absolute; left: 0; top: 0; height: 100%; border: none; outline: none; padding: 0; background-color: transparent; font-size: var(--field-decorator-placeholder-size); line-height: inherit; color: var(--field-decorator-text-color);}.var-select__filter--multiple { position: unset;}.var-select__chips .var-select__filter { padding-left: 0; margin-top: 4px;}.var-select__filter-calculator { position: absolute; left: 0; top: 0; max-width: 100%; visibility: hidden; white-space: pre; overflow: hidden; pointer-events: none;}.var-select__label { display: flex; align-items: center; font-size: var(--select-label-font-size);}.var-select__placeholder { max-width: 100%; position: absolute; top: 50%; left: 0; transform: translateY(-50%); font-size: var(--field-decorator-placeholder-size); line-height: 1.5em; color: var(--field-decorator-blur-color); pointer-events: none; cursor: inherit;}.var-select__empty { color: var(--select-empty-text-color); text-align: center; height: var(--select-empty-height); font-size: var(--select-empty-font-size); display: flex; align-items: center; justify-content: center;}.var-select__arrow[var-select-cover] { flex-shrink: 0; font-size: var(--select-arrow-size); margin-left: 6px;}.var-select--menu-radius-large { border-radius: var(--select-scroller-large-border-radius);}.var-select--standard-menu-margin { margin: var(--select-standard-menu-margin) !important;}.var-select--disabled { color: var(--field-decorator-disabled-color); cursor: not-allowed;}.var-select--error { color: var(--field-decorator-error-color);}.var-select--arrow-rotate { transform: rotate(180deg);}.var-select--label-focusing { color: var(--field-decorator-blur-color);}
|
package/es/themes/dark/menu.mjs
CHANGED
|
@@ -2,7 +2,8 @@ var stdin_default = {
|
|
|
2
2
|
"--menu-select-menu-background-color": "#272727",
|
|
3
3
|
"--menu-select-menu-max-height": "278px",
|
|
4
4
|
"--menu-select-menu-padding": "0",
|
|
5
|
-
"--menu-select-menu-border-radius": "2px"
|
|
5
|
+
"--menu-select-menu-border-radius": "2px",
|
|
6
|
+
"--menu-select-menu-large-border-radius": "8px"
|
|
6
7
|
};
|
|
7
8
|
export {
|
|
8
9
|
stdin_default as default
|
|
@@ -3,6 +3,7 @@ var stdin_default = {
|
|
|
3
3
|
"--select-scroller-padding": "6px 0",
|
|
4
4
|
"--select-scroller-max-height": "278px",
|
|
5
5
|
"--select-scroller-border-radius": "2px",
|
|
6
|
+
"--select-scroller-large-border-radius": "8px",
|
|
6
7
|
"--select-chips-margin": "-5px 0 0 0",
|
|
7
8
|
"--select-chips-padding": "2px 0",
|
|
8
9
|
"--select-chip-margin": "5px 5px 0 0",
|
|
@@ -1,6 +1,7 @@
|
|
|
1
1
|
var stdin_default = {
|
|
2
2
|
"--menu-select-menu-background-color": "var(--color-surface-container)",
|
|
3
3
|
"--menu-select-menu-border-radius": "4px",
|
|
4
|
+
"--menu-select-menu-large-border-radius": "16px",
|
|
4
5
|
"--menu-select-menu-max-height": "278px",
|
|
5
6
|
"--menu-select-menu-padding": "0"
|
|
6
7
|
};
|
|
@@ -1,6 +1,7 @@
|
|
|
1
1
|
var stdin_default = {
|
|
2
2
|
"--select-scroller-background": "var(--color-surface-container)",
|
|
3
3
|
"--select-scroller-border-radius": "4px",
|
|
4
|
+
"--select-scroller-large-border-radius": "16px",
|
|
4
5
|
"--select-scroller-padding": "6px 0",
|
|
5
6
|
"--select-scroller-max-height": "278px",
|
|
6
7
|
"--select-chips-margin": "-5px 0 0 0",
|
|
@@ -1,6 +1,7 @@
|
|
|
1
1
|
var stdin_default = {
|
|
2
2
|
"--menu-select-menu-background-color": "var(--color-surface-container)",
|
|
3
3
|
"--menu-select-menu-border-radius": "4px",
|
|
4
|
+
"--menu-select-menu-large-border-radius": "16px",
|
|
4
5
|
"--menu-select-menu-max-height": "278px",
|
|
5
6
|
"--menu-select-menu-padding": "0"
|
|
6
7
|
};
|
|
@@ -1,6 +1,7 @@
|
|
|
1
1
|
var stdin_default = {
|
|
2
2
|
"--select-scroller-background": "var(--color-surface-container)",
|
|
3
3
|
"--select-scroller-border-radius": "4px",
|
|
4
|
+
"--select-scroller-large-border-radius": "16px",
|
|
4
5
|
"--select-scroller-padding": "6px 0",
|
|
5
6
|
"--select-scroller-max-height": "278px",
|
|
6
7
|
"--select-chips-margin": "-5px 0 0 0",
|