Tracking de l'application VApp (IHM du jeu)
This commit is contained in:
550
VApp/node_modules/vuetify/lib/components/VField/VField.css
generated
vendored
Normal file
550
VApp/node_modules/vuetify/lib/components/VField/VField.css
generated
vendored
Normal file
@ -0,0 +1,550 @@
|
||||
/* region INPUT */
|
||||
.v-field {
|
||||
display: grid;
|
||||
grid-template-areas: "prepend-inner field clear append-inner";
|
||||
grid-template-columns: min-content minmax(0, 1fr) min-content min-content;
|
||||
font-size: 16px;
|
||||
letter-spacing: 0.009375em;
|
||||
max-width: 100%;
|
||||
border-radius: 4px;
|
||||
contain: layout;
|
||||
flex: 1 0;
|
||||
grid-area: control;
|
||||
position: relative;
|
||||
--v-field-padding-start: 16px;
|
||||
--v-field-padding-end: 16px;
|
||||
--v-field-padding-top: 8px;
|
||||
--v-field-padding-bottom: 4px;
|
||||
--v-field-input-padding-top: calc(var(--v-field-padding-top, 8px) + var(--v-input-padding-top, 0));
|
||||
--v-field-input-padding-bottom: var(--v-field-padding-bottom, 4px);
|
||||
}
|
||||
.v-field--disabled {
|
||||
opacity: var(--v-disabled-opacity);
|
||||
pointer-events: none;
|
||||
}
|
||||
.v-field .v-chip {
|
||||
--v-chip-height: 24px;
|
||||
}
|
||||
|
||||
/* endregion */
|
||||
/* region MODIFIERS */
|
||||
.v-field--prepended {
|
||||
padding-inline-start: 12px;
|
||||
}
|
||||
.v-field--appended {
|
||||
padding-inline-end: 12px;
|
||||
}
|
||||
.v-field--variant-solo, .v-field--variant-solo-filled {
|
||||
background: rgb(var(--v-theme-surface));
|
||||
border-color: transparent;
|
||||
color: rgba(var(--v-theme-on-surface), var(--v-high-emphasis-opacity));
|
||||
box-shadow: 0px 3px 1px -2px var(--v-shadow-key-umbra-opacity, rgba(0, 0, 0, 0.2)), 0px 2px 2px 0px var(--v-shadow-key-penumbra-opacity, rgba(0, 0, 0, 0.14)), 0px 1px 5px 0px var(--v-shadow-key-ambient-opacity, rgba(0, 0, 0, 0.12));
|
||||
}
|
||||
.v-field--variant-solo-inverted {
|
||||
background: rgb(var(--v-theme-surface));
|
||||
border-color: transparent;
|
||||
color: rgba(var(--v-theme-on-surface), var(--v-high-emphasis-opacity));
|
||||
box-shadow: 0px 3px 1px -2px var(--v-shadow-key-umbra-opacity, rgba(0, 0, 0, 0.2)), 0px 2px 2px 0px var(--v-shadow-key-penumbra-opacity, rgba(0, 0, 0, 0.14)), 0px 1px 5px 0px var(--v-shadow-key-ambient-opacity, rgba(0, 0, 0, 0.12));
|
||||
}
|
||||
.v-field--variant-solo-inverted.v-field--focused {
|
||||
color: rgb(var(--v-theme-on-surface-variant));
|
||||
}
|
||||
.v-field--variant-filled {
|
||||
border-bottom-left-radius: 0;
|
||||
border-bottom-right-radius: 0;
|
||||
}
|
||||
.v-input--density-default .v-field--variant-solo, .v-input--density-default .v-field--variant-solo-inverted, .v-input--density-default .v-field--variant-solo-filled, .v-input--density-default .v-field--variant-filled {
|
||||
--v-input-control-height: 56px;
|
||||
--v-field-padding-bottom: 4px;
|
||||
}
|
||||
|
||||
.v-input--density-comfortable .v-field--variant-solo, .v-input--density-comfortable .v-field--variant-solo-inverted, .v-input--density-comfortable .v-field--variant-solo-filled, .v-input--density-comfortable .v-field--variant-filled {
|
||||
--v-input-control-height: 48px;
|
||||
--v-field-padding-bottom: 0px;
|
||||
}
|
||||
|
||||
.v-input--density-compact .v-field--variant-solo, .v-input--density-compact .v-field--variant-solo-inverted, .v-input--density-compact .v-field--variant-solo-filled, .v-input--density-compact .v-field--variant-filled {
|
||||
--v-input-control-height: 40px;
|
||||
--v-field-padding-bottom: 0px;
|
||||
}
|
||||
|
||||
.v-field--variant-outlined, .v-field--single-line, .v-field--no-label {
|
||||
--v-field-padding-top: 0px;
|
||||
}
|
||||
.v-input--density-default .v-field--variant-outlined, .v-input--density-default .v-field--single-line, .v-input--density-default .v-field--no-label {
|
||||
--v-field-padding-bottom: 16px;
|
||||
}
|
||||
|
||||
.v-input--density-comfortable .v-field--variant-outlined, .v-input--density-comfortable .v-field--single-line, .v-input--density-comfortable .v-field--no-label {
|
||||
--v-field-padding-bottom: 12px;
|
||||
}
|
||||
|
||||
.v-input--density-compact .v-field--variant-outlined, .v-input--density-compact .v-field--single-line, .v-input--density-compact .v-field--no-label {
|
||||
--v-field-padding-bottom: 8px;
|
||||
}
|
||||
|
||||
.v-field--variant-plain, .v-field--variant-underlined {
|
||||
border-radius: 0;
|
||||
padding: 0;
|
||||
}
|
||||
.v-field--variant-plain.v-field, .v-field--variant-underlined.v-field {
|
||||
--v-field-padding-start: 0px;
|
||||
--v-field-padding-end: 0px;
|
||||
}
|
||||
.v-input--density-default .v-field--variant-plain, .v-input--density-default .v-field--variant-underlined {
|
||||
--v-input-control-height: 48px;
|
||||
--v-field-padding-top: 4px;
|
||||
--v-field-padding-bottom: 4px;
|
||||
}
|
||||
|
||||
.v-input--density-comfortable .v-field--variant-plain, .v-input--density-comfortable .v-field--variant-underlined {
|
||||
--v-input-control-height: 40px;
|
||||
--v-field-padding-top: 2px;
|
||||
--v-field-padding-bottom: 0px;
|
||||
}
|
||||
|
||||
.v-input--density-compact .v-field--variant-plain, .v-input--density-compact .v-field--variant-underlined {
|
||||
--v-input-control-height: 32px;
|
||||
--v-field-padding-top: 0px;
|
||||
--v-field-padding-bottom: 0px;
|
||||
}
|
||||
|
||||
.v-field--flat {
|
||||
box-shadow: none;
|
||||
}
|
||||
.v-field--rounded {
|
||||
border-radius: 9999px;
|
||||
}
|
||||
.v-field.v-field--prepended {
|
||||
--v-field-padding-start: 6px;
|
||||
}
|
||||
.v-field.v-field--appended {
|
||||
--v-field-padding-end: 6px;
|
||||
}
|
||||
|
||||
/* endregion */
|
||||
/* region ELEMENTS */
|
||||
.v-field__input {
|
||||
align-items: center;
|
||||
color: inherit;
|
||||
column-gap: 2px;
|
||||
display: flex;
|
||||
flex-wrap: wrap;
|
||||
letter-spacing: 0.009375em;
|
||||
opacity: var(--v-high-emphasis-opacity);
|
||||
min-height: max(var(--v-input-control-height, 56px), 1.5rem + var(--v-field-input-padding-top) + var(--v-field-input-padding-bottom));
|
||||
min-width: 0;
|
||||
padding-inline: var(--v-field-padding-start) var(--v-field-padding-end);
|
||||
padding-top: var(--v-field-input-padding-top);
|
||||
padding-bottom: var(--v-field-input-padding-bottom);
|
||||
position: relative;
|
||||
width: 100%;
|
||||
}
|
||||
.v-input--density-default .v-field__input {
|
||||
row-gap: 8px;
|
||||
}
|
||||
|
||||
.v-input--density-comfortable .v-field__input {
|
||||
row-gap: 6px;
|
||||
}
|
||||
|
||||
.v-input--density-compact .v-field__input {
|
||||
row-gap: 4px;
|
||||
}
|
||||
|
||||
.v-field__input input {
|
||||
letter-spacing: inherit;
|
||||
}
|
||||
.v-field__input input::placeholder,
|
||||
input.v-field__input::placeholder,
|
||||
textarea.v-field__input::placeholder {
|
||||
color: currentColor;
|
||||
opacity: var(--v-disabled-opacity);
|
||||
}
|
||||
|
||||
.v-field__input:focus, .v-field__input:active {
|
||||
outline: none;
|
||||
}
|
||||
.v-field__input:invalid {
|
||||
box-shadow: none;
|
||||
}
|
||||
|
||||
.v-field__field {
|
||||
flex: 1 0;
|
||||
grid-area: field;
|
||||
position: relative;
|
||||
align-items: flex-start;
|
||||
display: flex;
|
||||
}
|
||||
|
||||
/* endregion */
|
||||
/* region AFFIXES */
|
||||
.v-field__prepend-inner {
|
||||
grid-area: prepend-inner;
|
||||
padding-inline-end: var(--v-field-padding-after);
|
||||
}
|
||||
|
||||
.v-field__clearable {
|
||||
grid-area: clear;
|
||||
}
|
||||
|
||||
.v-field__append-inner {
|
||||
grid-area: append-inner;
|
||||
padding-inline-start: var(--v-field-padding-after);
|
||||
}
|
||||
|
||||
.v-field__append-inner,
|
||||
.v-field__clearable,
|
||||
.v-field__prepend-inner {
|
||||
display: flex;
|
||||
align-items: flex-start;
|
||||
padding-top: var(--v-input-padding-top, 8px);
|
||||
}
|
||||
.v-field--center-affix .v-field__append-inner,
|
||||
.v-field--center-affix .v-field__clearable,
|
||||
.v-field--center-affix .v-field__prepend-inner {
|
||||
align-items: center;
|
||||
padding-top: 0;
|
||||
}
|
||||
|
||||
.v-field.v-field--variant-underlined .v-field__append-inner,
|
||||
.v-field.v-field--variant-underlined .v-field__clearable,
|
||||
.v-field.v-field--variant-underlined .v-field__prepend-inner,
|
||||
.v-field.v-field--variant-plain .v-field__append-inner,
|
||||
.v-field.v-field--variant-plain .v-field__clearable,
|
||||
.v-field.v-field--variant-plain .v-field__prepend-inner {
|
||||
align-items: flex-start;
|
||||
padding-top: calc(var(--v-field-padding-top, 8px) + var(--v-input-padding-top, 0));
|
||||
padding-bottom: var(--v-field-padding-bottom, 4px);
|
||||
}
|
||||
|
||||
.v-field--focused .v-field__prepend-inner,
|
||||
.v-field--focused .v-field__append-inner {
|
||||
opacity: 1;
|
||||
}
|
||||
|
||||
.v-field__prepend-inner > .v-icon,
|
||||
.v-field__append-inner > .v-icon,
|
||||
.v-field__clearable > .v-icon {
|
||||
opacity: var(--v-medium-emphasis-opacity);
|
||||
}
|
||||
.v-field--disabled .v-field__prepend-inner > .v-icon, .v-field--error .v-field__prepend-inner > .v-icon,
|
||||
.v-field--disabled .v-field__append-inner > .v-icon,
|
||||
.v-field--error .v-field__append-inner > .v-icon,
|
||||
.v-field--disabled .v-field__clearable > .v-icon,
|
||||
.v-field--error .v-field__clearable > .v-icon {
|
||||
opacity: 1;
|
||||
}
|
||||
.v-field--error:not(.v-field--disabled) .v-field__prepend-inner > .v-icon,
|
||||
.v-field--error:not(.v-field--disabled) .v-field__append-inner > .v-icon,
|
||||
.v-field--error:not(.v-field--disabled) .v-field__clearable > .v-icon {
|
||||
color: rgb(var(--v-theme-error));
|
||||
}
|
||||
|
||||
.v-field__clearable {
|
||||
cursor: pointer;
|
||||
opacity: 0;
|
||||
overflow: hidden;
|
||||
margin-inline: 4px;
|
||||
transition: 0.15s cubic-bezier(0.4, 0, 0.2, 1);
|
||||
transition-property: opacity, transform, width;
|
||||
}
|
||||
.v-field--focused .v-field__clearable, .v-field--persistent-clear .v-field__clearable {
|
||||
opacity: 1;
|
||||
}
|
||||
@media (hover: hover) {
|
||||
.v-field:hover .v-field__clearable {
|
||||
opacity: 1;
|
||||
}
|
||||
}
|
||||
@media (hover: none) {
|
||||
.v-field__clearable {
|
||||
opacity: 1;
|
||||
}
|
||||
}
|
||||
|
||||
/* endregion */
|
||||
/* region LABEL */
|
||||
.v-label.v-field-label {
|
||||
contain: layout paint;
|
||||
display: block;
|
||||
margin-inline-start: var(--v-field-padding-start);
|
||||
margin-inline-end: var(--v-field-padding-end);
|
||||
max-width: calc(100% - var(--v-field-padding-start) - var(--v-field-padding-end));
|
||||
pointer-events: none;
|
||||
position: absolute;
|
||||
top: var(--v-input-padding-top);
|
||||
transform-origin: left center;
|
||||
transition: 0.15s cubic-bezier(0.4, 0, 0.2, 1);
|
||||
transition-property: opacity, transform;
|
||||
z-index: 1;
|
||||
}
|
||||
.v-field--variant-underlined .v-label.v-field-label, .v-field--variant-plain .v-label.v-field-label {
|
||||
top: calc(var(--v-input-padding-top) + var(--v-field-padding-top));
|
||||
}
|
||||
.v-field--center-affix .v-label.v-field-label {
|
||||
top: 50%;
|
||||
transform: translateY(-50%);
|
||||
}
|
||||
.v-field--active .v-label.v-field-label {
|
||||
visibility: hidden;
|
||||
}
|
||||
.v-field--focused .v-label.v-field-label, .v-field--error .v-label.v-field-label {
|
||||
opacity: 1;
|
||||
}
|
||||
.v-field--error:not(.v-field--disabled) .v-label.v-field-label {
|
||||
color: rgb(var(--v-theme-error));
|
||||
}
|
||||
.v-label.v-field-label--floating {
|
||||
--v-field-label-scale: 0.75em;
|
||||
font-size: var(--v-field-label-scale);
|
||||
visibility: hidden;
|
||||
max-width: 100%;
|
||||
}
|
||||
.v-field--center-affix .v-label.v-field-label--floating {
|
||||
transform: none;
|
||||
}
|
||||
.v-field.v-field--active .v-label.v-field-label--floating {
|
||||
visibility: unset;
|
||||
}
|
||||
.v-input--density-default .v-field--variant-solo .v-label.v-field-label--floating, .v-input--density-default .v-field--variant-solo-inverted .v-label.v-field-label--floating, .v-input--density-default .v-field--variant-filled .v-label.v-field-label--floating, .v-input--density-default .v-field--variant-solo-filled .v-label.v-field-label--floating {
|
||||
top: 7px;
|
||||
}
|
||||
|
||||
.v-input--density-comfortable .v-field--variant-solo .v-label.v-field-label--floating, .v-input--density-comfortable .v-field--variant-solo-inverted .v-label.v-field-label--floating, .v-input--density-comfortable .v-field--variant-filled .v-label.v-field-label--floating, .v-input--density-comfortable .v-field--variant-solo-filled .v-label.v-field-label--floating {
|
||||
top: 5px;
|
||||
}
|
||||
|
||||
.v-input--density-compact .v-field--variant-solo .v-label.v-field-label--floating, .v-input--density-compact .v-field--variant-solo-inverted .v-label.v-field-label--floating, .v-input--density-compact .v-field--variant-filled .v-label.v-field-label--floating, .v-input--density-compact .v-field--variant-solo-filled .v-label.v-field-label--floating {
|
||||
top: 3px;
|
||||
}
|
||||
|
||||
.v-field--variant-plain .v-label.v-field-label--floating, .v-field--variant-underlined .v-label.v-field-label--floating {
|
||||
transform: translateY(-16px);
|
||||
margin: 0;
|
||||
top: var(--v-input-padding-top);
|
||||
}
|
||||
.v-field--variant-outlined .v-label.v-field-label--floating {
|
||||
transform: translateY(-50%);
|
||||
transform-origin: center;
|
||||
position: static;
|
||||
margin: 0 4px;
|
||||
}
|
||||
|
||||
/* endregion */
|
||||
/* region OUTLINE */
|
||||
.v-field__outline {
|
||||
--v-field-border-width: 1px;
|
||||
--v-field-border-opacity: 0.38;
|
||||
align-items: stretch;
|
||||
contain: layout;
|
||||
display: flex;
|
||||
height: 100%;
|
||||
left: 0;
|
||||
pointer-events: none;
|
||||
position: absolute;
|
||||
right: 0;
|
||||
width: 100%;
|
||||
}
|
||||
@media (hover: hover) {
|
||||
.v-field:hover .v-field__outline {
|
||||
--v-field-border-opacity: var(--v-high-emphasis-opacity);
|
||||
}
|
||||
}
|
||||
.v-field--error:not(.v-field--disabled) .v-field__outline {
|
||||
color: rgb(var(--v-theme-error));
|
||||
}
|
||||
.v-field.v-field--focused .v-field__outline, .v-input.v-input--error .v-field__outline {
|
||||
--v-field-border-opacity: 1;
|
||||
}
|
||||
.v-field--variant-outlined.v-field--focused .v-field__outline {
|
||||
--v-field-border-width: 2px;
|
||||
}
|
||||
.v-field--variant-filled .v-field__outline::before, .v-field--variant-underlined .v-field__outline::before {
|
||||
border-color: currentColor;
|
||||
border-style: solid;
|
||||
border-width: 0 0 var(--v-field-border-width);
|
||||
opacity: var(--v-field-border-opacity);
|
||||
transition: opacity 250ms cubic-bezier(0.4, 0, 0.2, 1);
|
||||
content: "";
|
||||
position: absolute;
|
||||
top: 0;
|
||||
left: 0;
|
||||
width: 100%;
|
||||
height: 100%;
|
||||
}
|
||||
.v-field--variant-filled .v-field__outline::after, .v-field--variant-underlined .v-field__outline::after {
|
||||
border-color: currentColor;
|
||||
border-style: solid;
|
||||
border-width: 0 0 2px;
|
||||
transform: scaleX(0);
|
||||
transition: transform 0.15s cubic-bezier(0.4, 0, 0.2, 1);
|
||||
content: "";
|
||||
position: absolute;
|
||||
top: 0;
|
||||
left: 0;
|
||||
width: 100%;
|
||||
height: 100%;
|
||||
}
|
||||
.v-field--focused.v-field--variant-filled .v-field__outline::after, .v-field--focused.v-field--variant-underlined .v-field__outline::after {
|
||||
transform: scaleX(1);
|
||||
}
|
||||
|
||||
.v-field--variant-outlined .v-field__outline {
|
||||
border-radius: inherit;
|
||||
}
|
||||
.v-field--variant-outlined .v-field__outline__start, .v-field--variant-outlined .v-field__outline__notch::before, .v-field--variant-outlined .v-field__outline__notch::after, .v-field--variant-outlined .v-field__outline__end {
|
||||
border: 0 solid currentColor;
|
||||
opacity: var(--v-field-border-opacity);
|
||||
transition: opacity 250ms cubic-bezier(0.4, 0, 0.2, 1);
|
||||
}
|
||||
.v-field--variant-outlined .v-field__outline__start {
|
||||
flex: 0 0 12px;
|
||||
border-top-width: var(--v-field-border-width);
|
||||
border-bottom-width: var(--v-field-border-width);
|
||||
border-inline-start-width: var(--v-field-border-width);
|
||||
border-start-start-radius: inherit;
|
||||
border-start-end-radius: 0;
|
||||
border-end-end-radius: 0;
|
||||
border-end-start-radius: inherit;
|
||||
}
|
||||
.v-field--rounded.v-field--variant-outlined .v-field__outline__start,
|
||||
[class^=rounded-].v-field--variant-outlined .v-field__outline__start,
|
||||
[class*=" rounded-"].v-field--variant-outlined .v-field__outline__start {
|
||||
flex-basis: calc(var(--v-input-control-height) / 2 + 2px);
|
||||
}
|
||||
|
||||
.v-field--variant-outlined .v-field__outline__notch {
|
||||
flex: none;
|
||||
position: relative;
|
||||
max-width: calc(100% - 12px);
|
||||
}
|
||||
.v-field--variant-outlined .v-field__outline__notch::before, .v-field--variant-outlined .v-field__outline__notch::after {
|
||||
opacity: var(--v-field-border-opacity);
|
||||
transition: opacity 250ms cubic-bezier(0.4, 0, 0.2, 1);
|
||||
content: "";
|
||||
position: absolute;
|
||||
top: 0;
|
||||
left: 0;
|
||||
width: 100%;
|
||||
height: 100%;
|
||||
}
|
||||
.v-field--variant-outlined .v-field__outline__notch::before {
|
||||
border-width: var(--v-field-border-width) 0 0;
|
||||
}
|
||||
.v-field--variant-outlined .v-field__outline__notch::after {
|
||||
bottom: 0;
|
||||
border-width: 0 0 var(--v-field-border-width);
|
||||
}
|
||||
.v-field--active.v-field--variant-outlined .v-field__outline__notch::before {
|
||||
opacity: 0;
|
||||
}
|
||||
|
||||
.v-field--variant-outlined .v-field__outline__end {
|
||||
flex: 1;
|
||||
border-top-width: var(--v-field-border-width);
|
||||
border-bottom-width: var(--v-field-border-width);
|
||||
border-inline-end-width: var(--v-field-border-width);
|
||||
border-start-start-radius: 0;
|
||||
border-start-end-radius: inherit;
|
||||
border-end-end-radius: inherit;
|
||||
border-end-start-radius: 0;
|
||||
}
|
||||
|
||||
/* endregion */
|
||||
/* region LOADER */
|
||||
.v-field__loader {
|
||||
top: calc(100% - 2px);
|
||||
left: 0;
|
||||
position: absolute;
|
||||
right: 0;
|
||||
width: 100%;
|
||||
border-top-left-radius: 0;
|
||||
border-top-right-radius: 0;
|
||||
border-bottom-left-radius: inherit;
|
||||
border-bottom-right-radius: inherit;
|
||||
overflow: hidden;
|
||||
}
|
||||
.v-field--variant-outlined .v-field__loader {
|
||||
top: calc(100% - 3px);
|
||||
}
|
||||
|
||||
/* endregion */
|
||||
/* region OVERLAY */
|
||||
.v-field__overlay {
|
||||
border-radius: inherit;
|
||||
pointer-events: none;
|
||||
position: absolute;
|
||||
top: 0;
|
||||
left: 0;
|
||||
width: 100%;
|
||||
height: 100%;
|
||||
}
|
||||
|
||||
.v-field--variant-filled .v-field__overlay {
|
||||
background-color: currentColor;
|
||||
opacity: 0.04;
|
||||
transition: opacity 250ms cubic-bezier(0.4, 0, 0.2, 1);
|
||||
}
|
||||
.v-field--variant-filled.v-field--has-background .v-field__overlay {
|
||||
opacity: 0;
|
||||
}
|
||||
@media (hover: hover) {
|
||||
.v-field--variant-filled:hover .v-field__overlay {
|
||||
opacity: calc((0.04 + var(--v-hover-opacity)) * var(--v-theme-overlay-multiplier));
|
||||
}
|
||||
}
|
||||
.v-field--variant-filled.v-field--focused .v-field__overlay {
|
||||
opacity: calc((0.04 + var(--v-focus-opacity)) * var(--v-theme-overlay-multiplier));
|
||||
}
|
||||
|
||||
.v-field--variant-solo-filled .v-field__overlay {
|
||||
background-color: currentColor;
|
||||
opacity: 0.04;
|
||||
transition: opacity 250ms cubic-bezier(0.4, 0, 0.2, 1);
|
||||
}
|
||||
@media (hover: hover) {
|
||||
.v-field--variant-solo-filled:hover .v-field__overlay {
|
||||
opacity: calc((0.04 + var(--v-hover-opacity)) * var(--v-theme-overlay-multiplier));
|
||||
}
|
||||
}
|
||||
.v-field--variant-solo-filled.v-field--focused .v-field__overlay {
|
||||
opacity: calc((0.04 + var(--v-focus-opacity)) * var(--v-theme-overlay-multiplier));
|
||||
}
|
||||
|
||||
.v-field--variant-solo-inverted .v-field__overlay {
|
||||
transition: opacity 250ms cubic-bezier(0.4, 0, 0.2, 1);
|
||||
}
|
||||
.v-field--variant-solo-inverted.v-field--has-background .v-field__overlay {
|
||||
opacity: 0;
|
||||
}
|
||||
@media (hover: hover) {
|
||||
.v-field--variant-solo-inverted:hover .v-field__overlay {
|
||||
opacity: calc((0.04 + var(--v-hover-opacity)) * var(--v-theme-overlay-multiplier));
|
||||
}
|
||||
}
|
||||
.v-field--variant-solo-inverted.v-field--focused .v-field__overlay {
|
||||
background-color: rgb(var(--v-theme-surface-variant));
|
||||
opacity: 1;
|
||||
}
|
||||
|
||||
/* endregion */
|
||||
/* region MODIFIERS */
|
||||
.v-field--reverse .v-field__field, .v-field--reverse .v-field__input {
|
||||
flex-direction: row-reverse;
|
||||
}
|
||||
.v-field--reverse .v-field__input, .v-field--reverse input {
|
||||
text-align: end;
|
||||
}
|
||||
|
||||
.v-input--disabled .v-field--variant-filled .v-field__outline::before,
|
||||
.v-input--disabled .v-field--variant-underlined .v-field__outline::before {
|
||||
border-image: repeating-linear-gradient(to right, rgba(var(--v-theme-on-surface), var(--v-disabled-opacity)) 0px, rgba(var(--v-theme-on-surface), var(--v-disabled-opacity)) 2px, transparent 2px, transparent 4px) 1 repeat;
|
||||
}
|
||||
|
||||
.v-field--loading .v-field__outline::after,
|
||||
.v-field--loading .v-field__outline::before {
|
||||
opacity: 0;
|
||||
}
|
||||
|
||||
/* endregion */
|
||||
289
VApp/node_modules/vuetify/lib/components/VField/VField.mjs
generated
vendored
Normal file
289
VApp/node_modules/vuetify/lib/components/VField/VField.mjs
generated
vendored
Normal file
@ -0,0 +1,289 @@
|
||||
import { mergeProps as _mergeProps, Fragment as _Fragment, withDirectives as _withDirectives, vShow as _vShow, resolveDirective as _resolveDirective, createVNode as _createVNode } from "vue";
|
||||
// Styles
|
||||
import "./VField.css";
|
||||
|
||||
// Components
|
||||
import { VFieldLabel } from "./VFieldLabel.mjs";
|
||||
import { VExpandXTransition } from "../transitions/index.mjs";
|
||||
import { useInputIcon } from "../VInput/InputIcon.mjs"; // Composables
|
||||
import { useBackgroundColor, useTextColor } from "../../composables/color.mjs";
|
||||
import { makeComponentProps } from "../../composables/component.mjs";
|
||||
import { makeFocusProps, useFocus } from "../../composables/focus.mjs";
|
||||
import { IconValue } from "../../composables/icons.mjs";
|
||||
import { LoaderSlot, makeLoaderProps, useLoader } from "../../composables/loader.mjs";
|
||||
import { useRtl } from "../../composables/locale.mjs";
|
||||
import { makeRoundedProps, useRounded } from "../../composables/rounded.mjs";
|
||||
import { makeThemeProps, provideTheme } from "../../composables/theme.mjs"; // Utilities
|
||||
import { computed, ref, toRef, watch } from 'vue';
|
||||
import { animate, convertToUnit, EventProp, genericComponent, getUid, isOn, nullifyTransforms, pick, propsFactory, standardEasing, useRender } from "../../util/index.mjs"; // Types
|
||||
const allowedVariants = ['underlined', 'outlined', 'filled', 'solo', 'solo-inverted', 'solo-filled', 'plain'];
|
||||
export const makeVFieldProps = propsFactory({
|
||||
appendInnerIcon: IconValue,
|
||||
bgColor: String,
|
||||
clearable: Boolean,
|
||||
clearIcon: {
|
||||
type: IconValue,
|
||||
default: '$clear'
|
||||
},
|
||||
active: Boolean,
|
||||
centerAffix: {
|
||||
type: Boolean,
|
||||
default: undefined
|
||||
},
|
||||
color: String,
|
||||
baseColor: String,
|
||||
dirty: Boolean,
|
||||
disabled: {
|
||||
type: Boolean,
|
||||
default: null
|
||||
},
|
||||
error: Boolean,
|
||||
flat: Boolean,
|
||||
label: String,
|
||||
persistentClear: Boolean,
|
||||
prependInnerIcon: IconValue,
|
||||
reverse: Boolean,
|
||||
singleLine: Boolean,
|
||||
variant: {
|
||||
type: String,
|
||||
default: 'filled',
|
||||
validator: v => allowedVariants.includes(v)
|
||||
},
|
||||
'onClick:clear': EventProp(),
|
||||
'onClick:appendInner': EventProp(),
|
||||
'onClick:prependInner': EventProp(),
|
||||
...makeComponentProps(),
|
||||
...makeLoaderProps(),
|
||||
...makeRoundedProps(),
|
||||
...makeThemeProps()
|
||||
}, 'VField');
|
||||
export const VField = genericComponent()({
|
||||
name: 'VField',
|
||||
inheritAttrs: false,
|
||||
props: {
|
||||
id: String,
|
||||
...makeFocusProps(),
|
||||
...makeVFieldProps()
|
||||
},
|
||||
emits: {
|
||||
'update:focused': focused => true,
|
||||
'update:modelValue': value => true
|
||||
},
|
||||
setup(props, _ref) {
|
||||
let {
|
||||
attrs,
|
||||
emit,
|
||||
slots
|
||||
} = _ref;
|
||||
const {
|
||||
themeClasses
|
||||
} = provideTheme(props);
|
||||
const {
|
||||
loaderClasses
|
||||
} = useLoader(props);
|
||||
const {
|
||||
focusClasses,
|
||||
isFocused,
|
||||
focus,
|
||||
blur
|
||||
} = useFocus(props);
|
||||
const {
|
||||
InputIcon
|
||||
} = useInputIcon(props);
|
||||
const {
|
||||
roundedClasses
|
||||
} = useRounded(props);
|
||||
const {
|
||||
rtlClasses
|
||||
} = useRtl();
|
||||
const isActive = computed(() => props.dirty || props.active);
|
||||
const hasLabel = computed(() => !props.singleLine && !!(props.label || slots.label));
|
||||
const uid = getUid();
|
||||
const id = computed(() => props.id || `input-${uid}`);
|
||||
const messagesId = computed(() => `${id.value}-messages`);
|
||||
const labelRef = ref();
|
||||
const floatingLabelRef = ref();
|
||||
const controlRef = ref();
|
||||
const isPlainOrUnderlined = computed(() => ['plain', 'underlined'].includes(props.variant));
|
||||
const {
|
||||
backgroundColorClasses,
|
||||
backgroundColorStyles
|
||||
} = useBackgroundColor(toRef(props, 'bgColor'));
|
||||
const {
|
||||
textColorClasses,
|
||||
textColorStyles
|
||||
} = useTextColor(computed(() => {
|
||||
return props.error || props.disabled ? undefined : isActive.value && isFocused.value ? props.color : props.baseColor;
|
||||
}));
|
||||
watch(isActive, val => {
|
||||
if (hasLabel.value) {
|
||||
const el = labelRef.value.$el;
|
||||
const targetEl = floatingLabelRef.value.$el;
|
||||
requestAnimationFrame(() => {
|
||||
const rect = nullifyTransforms(el);
|
||||
const targetRect = targetEl.getBoundingClientRect();
|
||||
const x = targetRect.x - rect.x;
|
||||
const y = targetRect.y - rect.y - (rect.height / 2 - targetRect.height / 2);
|
||||
const targetWidth = targetRect.width / 0.75;
|
||||
const width = Math.abs(targetWidth - rect.width) > 1 ? {
|
||||
maxWidth: convertToUnit(targetWidth)
|
||||
} : undefined;
|
||||
const style = getComputedStyle(el);
|
||||
const targetStyle = getComputedStyle(targetEl);
|
||||
const duration = parseFloat(style.transitionDuration) * 1000 || 150;
|
||||
const scale = parseFloat(targetStyle.getPropertyValue('--v-field-label-scale'));
|
||||
const color = targetStyle.getPropertyValue('color');
|
||||
el.style.visibility = 'visible';
|
||||
targetEl.style.visibility = 'hidden';
|
||||
animate(el, {
|
||||
transform: `translate(${x}px, ${y}px) scale(${scale})`,
|
||||
color,
|
||||
...width
|
||||
}, {
|
||||
duration,
|
||||
easing: standardEasing,
|
||||
direction: val ? 'normal' : 'reverse'
|
||||
}).finished.then(() => {
|
||||
el.style.removeProperty('visibility');
|
||||
targetEl.style.removeProperty('visibility');
|
||||
});
|
||||
});
|
||||
}
|
||||
}, {
|
||||
flush: 'post'
|
||||
});
|
||||
const slotProps = computed(() => ({
|
||||
isActive,
|
||||
isFocused,
|
||||
controlRef,
|
||||
blur,
|
||||
focus
|
||||
}));
|
||||
function onClick(e) {
|
||||
if (e.target !== document.activeElement) {
|
||||
e.preventDefault();
|
||||
}
|
||||
}
|
||||
useRender(() => {
|
||||
const isOutlined = props.variant === 'outlined';
|
||||
const hasPrepend = slots['prepend-inner'] || props.prependInnerIcon;
|
||||
const hasClear = !!(props.clearable || slots.clear);
|
||||
const hasAppend = !!(slots['append-inner'] || props.appendInnerIcon || hasClear);
|
||||
const label = () => slots.label ? slots.label({
|
||||
...slotProps.value,
|
||||
label: props.label,
|
||||
props: {
|
||||
for: id.value
|
||||
}
|
||||
}) : props.label;
|
||||
return _createVNode("div", _mergeProps({
|
||||
"class": ['v-field', {
|
||||
'v-field--active': isActive.value,
|
||||
'v-field--appended': hasAppend,
|
||||
'v-field--center-affix': props.centerAffix ?? !isPlainOrUnderlined.value,
|
||||
'v-field--disabled': props.disabled,
|
||||
'v-field--dirty': props.dirty,
|
||||
'v-field--error': props.error,
|
||||
'v-field--flat': props.flat,
|
||||
'v-field--has-background': !!props.bgColor,
|
||||
'v-field--persistent-clear': props.persistentClear,
|
||||
'v-field--prepended': hasPrepend,
|
||||
'v-field--reverse': props.reverse,
|
||||
'v-field--single-line': props.singleLine,
|
||||
'v-field--no-label': !label(),
|
||||
[`v-field--variant-${props.variant}`]: true
|
||||
}, themeClasses.value, backgroundColorClasses.value, focusClasses.value, loaderClasses.value, roundedClasses.value, rtlClasses.value, props.class],
|
||||
"style": [backgroundColorStyles.value, props.style],
|
||||
"onClick": onClick
|
||||
}, attrs), [_createVNode("div", {
|
||||
"class": "v-field__overlay"
|
||||
}, null), _createVNode(LoaderSlot, {
|
||||
"name": "v-field",
|
||||
"active": !!props.loading,
|
||||
"color": props.error ? 'error' : typeof props.loading === 'string' ? props.loading : props.color
|
||||
}, {
|
||||
default: slots.loader
|
||||
}), hasPrepend && _createVNode("div", {
|
||||
"key": "prepend",
|
||||
"class": "v-field__prepend-inner"
|
||||
}, [props.prependInnerIcon && _createVNode(InputIcon, {
|
||||
"key": "prepend-icon",
|
||||
"name": "prependInner"
|
||||
}, null), slots['prepend-inner']?.(slotProps.value)]), _createVNode("div", {
|
||||
"class": "v-field__field",
|
||||
"data-no-activator": ""
|
||||
}, [['filled', 'solo', 'solo-inverted', 'solo-filled'].includes(props.variant) && hasLabel.value && _createVNode(VFieldLabel, {
|
||||
"key": "floating-label",
|
||||
"ref": floatingLabelRef,
|
||||
"class": [textColorClasses.value],
|
||||
"floating": true,
|
||||
"for": id.value,
|
||||
"style": textColorStyles.value
|
||||
}, {
|
||||
default: () => [label()]
|
||||
}), _createVNode(VFieldLabel, {
|
||||
"ref": labelRef,
|
||||
"for": id.value
|
||||
}, {
|
||||
default: () => [label()]
|
||||
}), slots.default?.({
|
||||
...slotProps.value,
|
||||
props: {
|
||||
id: id.value,
|
||||
class: 'v-field__input',
|
||||
'aria-describedby': messagesId.value
|
||||
},
|
||||
focus,
|
||||
blur
|
||||
})]), hasClear && _createVNode(VExpandXTransition, {
|
||||
"key": "clear"
|
||||
}, {
|
||||
default: () => [_withDirectives(_createVNode("div", {
|
||||
"class": "v-field__clearable",
|
||||
"onMousedown": e => {
|
||||
e.preventDefault();
|
||||
e.stopPropagation();
|
||||
}
|
||||
}, [slots.clear ? slots.clear() : _createVNode(InputIcon, {
|
||||
"name": "clear"
|
||||
}, null)]), [[_vShow, props.dirty]])]
|
||||
}), hasAppend && _createVNode("div", {
|
||||
"key": "append",
|
||||
"class": "v-field__append-inner"
|
||||
}, [slots['append-inner']?.(slotProps.value), props.appendInnerIcon && _createVNode(InputIcon, {
|
||||
"key": "append-icon",
|
||||
"name": "appendInner"
|
||||
}, null)]), _createVNode("div", {
|
||||
"class": ['v-field__outline', textColorClasses.value],
|
||||
"style": textColorStyles.value
|
||||
}, [isOutlined && _createVNode(_Fragment, null, [_createVNode("div", {
|
||||
"class": "v-field__outline__start"
|
||||
}, null), hasLabel.value && _createVNode("div", {
|
||||
"class": "v-field__outline__notch"
|
||||
}, [_createVNode(VFieldLabel, {
|
||||
"ref": floatingLabelRef,
|
||||
"floating": true,
|
||||
"for": id.value
|
||||
}, {
|
||||
default: () => [label()]
|
||||
})]), _createVNode("div", {
|
||||
"class": "v-field__outline__end"
|
||||
}, null)]), isPlainOrUnderlined.value && hasLabel.value && _createVNode(VFieldLabel, {
|
||||
"ref": floatingLabelRef,
|
||||
"floating": true,
|
||||
"for": id.value
|
||||
}, {
|
||||
default: () => [label()]
|
||||
})])]);
|
||||
});
|
||||
return {
|
||||
controlRef
|
||||
};
|
||||
}
|
||||
});
|
||||
// TODO: this is kinda slow, might be better to implicitly inherit props instead
|
||||
export function filterFieldProps(attrs) {
|
||||
const keys = Object.keys(VField.props).filter(k => !isOn(k) && k !== 'class' && k !== 'style');
|
||||
return pick(attrs, keys);
|
||||
}
|
||||
//# sourceMappingURL=VField.mjs.map
|
||||
1
VApp/node_modules/vuetify/lib/components/VField/VField.mjs.map
generated
vendored
Normal file
1
VApp/node_modules/vuetify/lib/components/VField/VField.mjs.map
generated
vendored
Normal file
File diff suppressed because one or more lines are too long
513
VApp/node_modules/vuetify/lib/components/VField/VField.sass
generated
vendored
Normal file
513
VApp/node_modules/vuetify/lib/components/VField/VField.sass
generated
vendored
Normal file
@ -0,0 +1,513 @@
|
||||
@use 'sass:map'
|
||||
@use 'sass:math'
|
||||
@use 'sass:selector'
|
||||
@use '../../styles/settings'
|
||||
@use '../../styles/tools'
|
||||
@use './variables' as *
|
||||
|
||||
/* region INPUT */
|
||||
.v-field
|
||||
display: grid
|
||||
grid-template-areas: "prepend-inner field clear append-inner"
|
||||
grid-template-columns: min-content minmax(0, 1fr) min-content min-content
|
||||
font-size: $field-font-size
|
||||
letter-spacing: $field-letter-spacing
|
||||
max-width: $field-max-width
|
||||
border-radius: $field-border-radius
|
||||
contain: layout
|
||||
flex: 1 0
|
||||
grid-area: control
|
||||
position: relative
|
||||
|
||||
&--disabled
|
||||
opacity: var(--v-disabled-opacity)
|
||||
pointer-events: none
|
||||
|
||||
--v-field-padding-start: #{$field-control-padding-start}
|
||||
--v-field-padding-end: #{$field-control-padding-end}
|
||||
--v-field-padding-top: #{$field-control-padding-top}
|
||||
--v-field-padding-bottom: #{$field-control-padding-bottom}
|
||||
--v-field-input-padding-top: #{$field-input-padding-top}
|
||||
--v-field-input-padding-bottom: #{$field-input-padding-bottom}
|
||||
|
||||
.v-chip
|
||||
--v-chip-height: #{$field-chip-height}
|
||||
|
||||
/* endregion */
|
||||
/* region MODIFIERS */
|
||||
.v-field
|
||||
&--prepended
|
||||
padding-inline-start: $field-control-affixed-padding
|
||||
|
||||
&--appended
|
||||
padding-inline-end: $field-control-affixed-padding
|
||||
|
||||
&--variant-solo,
|
||||
&--variant-solo-filled
|
||||
background: $field-control-solo-background
|
||||
border-color: transparent
|
||||
color: $field-control-solo-color
|
||||
|
||||
@include tools.elevation($field-control-solo-elevation)
|
||||
|
||||
&--variant-solo-inverted
|
||||
background: $field-control-solo-background
|
||||
border-color: transparent
|
||||
color: $field-control-solo-inverted-color
|
||||
|
||||
@include tools.elevation($field-control-solo-elevation)
|
||||
|
||||
&.v-field--focused
|
||||
color: $field-control-solo-inverted-focused-color
|
||||
|
||||
&--variant-filled
|
||||
border-bottom-left-radius: 0
|
||||
border-bottom-right-radius: 0
|
||||
|
||||
&--variant-solo,
|
||||
&--variant-solo-inverted,
|
||||
&--variant-solo-filled,
|
||||
&--variant-filled
|
||||
$root: &
|
||||
|
||||
@at-root
|
||||
@include tools.density('v-input', $input-density) using ($modifier)
|
||||
@at-root #{selector.nest(&, $root)}
|
||||
--v-input-control-height: #{$field-control-height + $modifier}
|
||||
--v-field-padding-bottom: #{math.max(0px, $field-control-padding-bottom + $modifier * .5)}
|
||||
|
||||
&--variant-outlined,
|
||||
&--single-line,
|
||||
&--no-label
|
||||
--v-field-padding-top: 0px
|
||||
$root: &
|
||||
|
||||
@at-root
|
||||
@include tools.density('v-input', $input-density) using ($modifier)
|
||||
@at-root #{selector.nest(&, $root)}
|
||||
--v-field-padding-bottom: #{16px + $modifier * .5}
|
||||
|
||||
&--variant-plain,
|
||||
&--variant-underlined
|
||||
$root: &
|
||||
border-radius: 0
|
||||
padding: 0
|
||||
|
||||
&.v-field
|
||||
--v-field-padding-start: 0px
|
||||
--v-field-padding-end: 0px
|
||||
|
||||
@at-root
|
||||
@include tools.density('v-input', $input-density) using ($modifier)
|
||||
@at-root #{selector.nest(&, $root)}
|
||||
--v-input-control-height: #{$field-control-underlined-height + $modifier}
|
||||
--v-field-padding-top: #{math.max(0px, 4px + $modifier * .25)}
|
||||
--v-field-padding-bottom: #{math.max(0px, $field-control-padding-bottom + $modifier * .5)}
|
||||
|
||||
&--flat
|
||||
box-shadow: none
|
||||
|
||||
&--rounded
|
||||
@include tools.rounded($field-rounded-border-radius)
|
||||
|
||||
// These are separate so they can override the default variant styles
|
||||
&.v-field
|
||||
&--prepended
|
||||
--v-field-padding-start: #{$field-control-affixed-inner-padding}
|
||||
|
||||
&--appended
|
||||
--v-field-padding-end: #{$field-control-affixed-inner-padding}
|
||||
|
||||
/* endregion */
|
||||
/* region ELEMENTS */
|
||||
.v-field__input
|
||||
align-items: center
|
||||
color: inherit
|
||||
column-gap: $field-input-column-gap
|
||||
display: flex
|
||||
flex-wrap: wrap
|
||||
letter-spacing: $field-letter-spacing
|
||||
opacity: $field-input-opacity
|
||||
min-height: $field-input-min-height
|
||||
min-width: 0
|
||||
padding-inline: var(--v-field-padding-start) var(--v-field-padding-end)
|
||||
padding-top: var(--v-field-input-padding-top)
|
||||
padding-bottom: var(--v-field-input-padding-bottom)
|
||||
position: relative
|
||||
width: 100%
|
||||
|
||||
$root: &
|
||||
|
||||
@at-root
|
||||
@include tools.density('v-input', $input-density) using ($modifier)
|
||||
@at-root #{selector.nest(&, $root)}
|
||||
row-gap: #{$field-input-row-gap + $modifier * .25}
|
||||
|
||||
input
|
||||
letter-spacing: inherit
|
||||
|
||||
@at-root
|
||||
& input::placeholder,
|
||||
input#{&}::placeholder,
|
||||
textarea#{&}::placeholder
|
||||
color: currentColor
|
||||
opacity: var(--v-disabled-opacity)
|
||||
|
||||
&:focus,
|
||||
&:active
|
||||
outline: none
|
||||
|
||||
// Remove Firefox red outline
|
||||
&:invalid
|
||||
box-shadow: none
|
||||
|
||||
.v-field__field
|
||||
flex: 1 0
|
||||
grid-area: field
|
||||
position: relative
|
||||
align-items: flex-start
|
||||
display: flex
|
||||
|
||||
/* endregion */
|
||||
/* region AFFIXES */
|
||||
.v-field__prepend-inner
|
||||
grid-area: prepend-inner
|
||||
padding-inline-end: var(--v-field-padding-after)
|
||||
|
||||
.v-field__clearable
|
||||
grid-area: clear
|
||||
|
||||
.v-field__append-inner
|
||||
grid-area: append-inner
|
||||
padding-inline-start: var(--v-field-padding-after)
|
||||
|
||||
.v-field__append-inner,
|
||||
.v-field__clearable,
|
||||
.v-field__prepend-inner
|
||||
display: flex
|
||||
align-items: flex-start
|
||||
padding-top: var(--v-input-padding-top, $field-control-padding-top)
|
||||
|
||||
.v-field--center-affix &
|
||||
align-items: center
|
||||
padding-top: 0
|
||||
|
||||
.v-field.v-field--variant-underlined,
|
||||
.v-field.v-field--variant-plain
|
||||
.v-field__append-inner,
|
||||
.v-field__clearable,
|
||||
.v-field__prepend-inner
|
||||
align-items: flex-start
|
||||
padding-top: $field-input-padding-top
|
||||
padding-bottom: $field-input-padding-bottom
|
||||
|
||||
.v-field__prepend-inner,
|
||||
.v-field__append-inner
|
||||
.v-field--focused &
|
||||
opacity: 1
|
||||
|
||||
.v-field__prepend-inner,
|
||||
.v-field__append-inner,
|
||||
.v-field__clearable
|
||||
> .v-icon
|
||||
opacity: var(--v-medium-emphasis-opacity)
|
||||
|
||||
.v-field--disabled &,
|
||||
.v-field--error &
|
||||
> .v-icon
|
||||
opacity: 1
|
||||
|
||||
.v-field--error:not(.v-field--disabled) &
|
||||
> .v-icon
|
||||
color: rgb(var(--v-theme-error))
|
||||
|
||||
.v-field__clearable
|
||||
cursor: pointer
|
||||
opacity: 0
|
||||
overflow: hidden
|
||||
margin-inline: $field-clearable-margin
|
||||
transition: $field-transition-timing
|
||||
transition-property: opacity, transform, width
|
||||
|
||||
.v-field--focused &,
|
||||
.v-field--persistent-clear &
|
||||
opacity: 1
|
||||
|
||||
@media (hover: hover)
|
||||
.v-field:hover &
|
||||
opacity: 1
|
||||
|
||||
@media (hover: none)
|
||||
opacity: 1
|
||||
|
||||
/* endregion */
|
||||
/* region LABEL */
|
||||
.v-label.v-field-label
|
||||
contain: layout paint
|
||||
display: block
|
||||
margin-inline-start: var(--v-field-padding-start)
|
||||
margin-inline-end: var(--v-field-padding-end)
|
||||
max-width: calc(100% - var(--v-field-padding-start) - var(--v-field-padding-end))
|
||||
pointer-events: none
|
||||
position: absolute
|
||||
top: var(--v-input-padding-top)
|
||||
transform-origin: left center
|
||||
transition: $field-transition-timing
|
||||
transition-property: opacity, transform
|
||||
z-index: 1
|
||||
|
||||
.v-field--variant-underlined &,
|
||||
.v-field--variant-plain &
|
||||
top: calc(var(--v-input-padding-top) + var(--v-field-padding-top))
|
||||
|
||||
.v-field--center-affix &
|
||||
top: 50%
|
||||
transform: translateY(-50%)
|
||||
|
||||
.v-field--active &
|
||||
visibility: hidden
|
||||
|
||||
.v-field--focused &,
|
||||
.v-field--error &
|
||||
opacity: 1
|
||||
|
||||
.v-field--error:not(.v-field--disabled) &
|
||||
color: rgb(var(--v-theme-error))
|
||||
|
||||
&--floating
|
||||
--v-field-label-scale: #{$field-label-floating-scale}em
|
||||
font-size: var(--v-field-label-scale)
|
||||
visibility: hidden
|
||||
max-width: 100%
|
||||
|
||||
.v-field--center-affix &
|
||||
transform: none
|
||||
|
||||
.v-field.v-field--active &
|
||||
visibility: unset
|
||||
|
||||
.v-field--variant-solo &,
|
||||
.v-field--variant-solo-inverted &,
|
||||
.v-field--variant-filled &,
|
||||
.v-field--variant-solo-filled &
|
||||
$root: &
|
||||
|
||||
@at-root
|
||||
@include tools.density('v-input', $input-density) using ($modifier)
|
||||
@at-root #{selector.nest(&, $root)}
|
||||
top: 7px + $modifier * .25
|
||||
|
||||
.v-field--variant-plain &,
|
||||
.v-field--variant-underlined &
|
||||
transform: translateY(-16px)
|
||||
margin: 0
|
||||
top: var(--v-input-padding-top)
|
||||
|
||||
.v-field--variant-outlined &
|
||||
transform: translateY(-50%)
|
||||
transform-origin: center
|
||||
position: static
|
||||
margin: 0 4px
|
||||
|
||||
/* endregion */
|
||||
/* region OUTLINE */
|
||||
.v-field__outline
|
||||
--v-field-border-width: #{$field-border-width}
|
||||
--v-field-border-opacity: #{$field-outline-opacity}
|
||||
align-items: stretch
|
||||
contain: layout
|
||||
display: flex
|
||||
height: 100%
|
||||
left: 0
|
||||
pointer-events: none
|
||||
position: absolute
|
||||
right: 0
|
||||
width: 100%
|
||||
|
||||
@media (hover: hover)
|
||||
.v-field:hover &
|
||||
--v-field-border-opacity: var(--v-high-emphasis-opacity)
|
||||
|
||||
.v-field--error:not(.v-field--disabled) &
|
||||
color: rgb(var(--v-theme-error))
|
||||
|
||||
.v-field.v-field--focused &,
|
||||
.v-input.v-input--error &
|
||||
--v-field-border-opacity: 1
|
||||
|
||||
.v-field--variant-outlined.v-field--focused &
|
||||
--v-field-border-width: #{$field-focused-border-width}
|
||||
|
||||
.v-field--variant-filled &,
|
||||
.v-field--variant-underlined &
|
||||
&::before
|
||||
border-color: currentColor
|
||||
border-style: solid
|
||||
border-width: 0 0 var(--v-field-border-width)
|
||||
opacity: var(--v-field-border-opacity)
|
||||
transition: opacity $field-subtle-transition-timing
|
||||
@include tools.absolute(true)
|
||||
|
||||
.v-field--variant-filled &,
|
||||
.v-field--variant-underlined &
|
||||
&::after
|
||||
border-color: currentColor
|
||||
border-style: solid
|
||||
border-width: 0 0 $field-focused-border-width
|
||||
transform: scaleX(0)
|
||||
transition: transform $field-transition-timing
|
||||
@include tools.absolute(true)
|
||||
|
||||
@at-root #{selector.append('.v-field--focused', &)}
|
||||
transform: scaleX(1)
|
||||
|
||||
.v-field--variant-outlined &
|
||||
border-radius: inherit
|
||||
|
||||
&__start,
|
||||
&__notch::before,
|
||||
&__notch::after,
|
||||
&__end
|
||||
border: 0 solid currentColor
|
||||
opacity: var(--v-field-border-opacity)
|
||||
transition: opacity $field-subtle-transition-timing
|
||||
|
||||
&__start
|
||||
flex: 0 0 $field-control-affixed-padding
|
||||
border-top-width: var(--v-field-border-width)
|
||||
border-bottom-width: var(--v-field-border-width)
|
||||
border-inline-start-width: var(--v-field-border-width)
|
||||
border-start-start-radius: inherit
|
||||
border-start-end-radius: 0
|
||||
border-end-end-radius: 0
|
||||
border-end-start-radius: inherit
|
||||
|
||||
@at-root
|
||||
#{selector.append('.v-field--rounded', &)},
|
||||
#{selector.append('[class^="rounded-"]', &)},
|
||||
#{selector.append('[class*=" rounded-"]', &)}
|
||||
flex-basis: calc(var(--v-input-control-height) / 2 + 2px)
|
||||
|
||||
&__notch
|
||||
flex: none
|
||||
position: relative
|
||||
max-width: calc(100% - $field-control-affixed-padding)
|
||||
|
||||
&::before,
|
||||
&::after
|
||||
opacity: var(--v-field-border-opacity)
|
||||
transition: opacity $field-subtle-transition-timing
|
||||
|
||||
@include tools.absolute(true)
|
||||
|
||||
&::before
|
||||
border-width: var(--v-field-border-width) 0 0
|
||||
|
||||
&::after
|
||||
bottom: 0
|
||||
border-width: 0 0 var(--v-field-border-width)
|
||||
|
||||
@at-root #{selector.append('.v-field--active', &)}
|
||||
&::before
|
||||
opacity: 0
|
||||
|
||||
&__end
|
||||
flex: 1
|
||||
border-top-width: var(--v-field-border-width)
|
||||
border-bottom-width: var(--v-field-border-width)
|
||||
border-inline-end-width: var(--v-field-border-width)
|
||||
border-start-start-radius: 0
|
||||
border-start-end-radius: inherit
|
||||
border-end-end-radius: inherit
|
||||
border-end-start-radius: 0
|
||||
|
||||
/* endregion */
|
||||
/* region LOADER */
|
||||
.v-field__loader
|
||||
top: calc(100% - 2px)
|
||||
left: 0
|
||||
position: absolute
|
||||
right: 0
|
||||
width: 100%
|
||||
border-top-left-radius: 0
|
||||
border-top-right-radius: 0
|
||||
border-bottom-left-radius: inherit
|
||||
border-bottom-right-radius: inherit
|
||||
overflow: hidden
|
||||
|
||||
.v-field--variant-outlined &
|
||||
top: calc(100% - 3px)
|
||||
|
||||
/* endregion */
|
||||
/* region OVERLAY */
|
||||
.v-field__overlay
|
||||
border-radius: inherit
|
||||
pointer-events: none
|
||||
|
||||
@include tools.absolute()
|
||||
|
||||
.v-field--variant-filled
|
||||
.v-field__overlay
|
||||
background-color: currentColor
|
||||
opacity: $field-overlay-filled-opacity
|
||||
transition: opacity $field-subtle-transition-timing
|
||||
|
||||
&.v-field--has-background .v-field__overlay
|
||||
opacity: 0
|
||||
|
||||
@media (hover: hover)
|
||||
&:hover .v-field__overlay
|
||||
opacity: calc((#{$field-overlay-filled-opacity} + #{map.get(settings.$states, 'hover')}) * var(--v-theme-overlay-multiplier))
|
||||
|
||||
&.v-field--focused .v-field__overlay
|
||||
opacity: calc((#{$field-overlay-filled-opacity} + #{map.get(settings.$states, 'focus')}) * var(--v-theme-overlay-multiplier))
|
||||
|
||||
.v-field--variant-solo-filled
|
||||
.v-field__overlay
|
||||
background-color: currentColor
|
||||
opacity: $field-overlay-filled-opacity
|
||||
transition: opacity $field-subtle-transition-timing
|
||||
|
||||
@media (hover: hover)
|
||||
&:hover .v-field__overlay
|
||||
opacity: calc((#{$field-overlay-filled-opacity} + #{map.get(settings.$states, 'hover')}) * var(--v-theme-overlay-multiplier))
|
||||
|
||||
&.v-field--focused .v-field__overlay
|
||||
opacity: calc((#{$field-overlay-filled-opacity} + #{map.get(settings.$states, 'focus')}) * var(--v-theme-overlay-multiplier))
|
||||
|
||||
.v-field--variant-solo-inverted
|
||||
.v-field__overlay
|
||||
transition: opacity $field-subtle-transition-timing
|
||||
|
||||
&.v-field--has-background .v-field__overlay
|
||||
opacity: 0
|
||||
|
||||
@media (hover: hover)
|
||||
&:hover .v-field__overlay
|
||||
opacity: calc((#{.04} + #{map.get(settings.$states, 'hover')}) * var(--v-theme-overlay-multiplier))
|
||||
|
||||
&.v-field--focused .v-field__overlay
|
||||
background-color: $field-overlay-focused-background-color
|
||||
opacity: 1
|
||||
|
||||
/* endregion */
|
||||
/* region MODIFIERS */
|
||||
.v-field--reverse
|
||||
.v-field__field, .v-field__input
|
||||
flex-direction: row-reverse
|
||||
|
||||
.v-field__input, input
|
||||
text-align: end
|
||||
|
||||
.v-field--variant-filled,
|
||||
.v-field--variant-underlined
|
||||
.v-input--disabled &
|
||||
.v-field__outline::before
|
||||
border-image: repeating-linear-gradient(to right, $field-disabled-color 0px, $field-disabled-color 2px, transparent 2px, transparent 4px) 1 repeat
|
||||
|
||||
.v-field--loading
|
||||
.v-field__outline::after,
|
||||
.v-field__outline::before
|
||||
opacity: 0
|
||||
|
||||
/* endregion */
|
||||
27
VApp/node_modules/vuetify/lib/components/VField/VFieldLabel.mjs
generated
vendored
Normal file
27
VApp/node_modules/vuetify/lib/components/VField/VFieldLabel.mjs
generated
vendored
Normal file
@ -0,0 +1,27 @@
|
||||
import { createVNode as _createVNode, resolveDirective as _resolveDirective } from "vue";
|
||||
// Components
|
||||
import { VLabel } from "../VLabel/index.mjs"; // Composables
|
||||
import { makeComponentProps } from "../../composables/component.mjs"; // Utilities
|
||||
import { genericComponent, propsFactory, useRender } from "../../util/index.mjs";
|
||||
export const makeVFieldLabelProps = propsFactory({
|
||||
floating: Boolean,
|
||||
...makeComponentProps()
|
||||
}, 'VFieldLabel');
|
||||
export const VFieldLabel = genericComponent()({
|
||||
name: 'VFieldLabel',
|
||||
props: makeVFieldLabelProps(),
|
||||
setup(props, _ref) {
|
||||
let {
|
||||
slots
|
||||
} = _ref;
|
||||
useRender(() => _createVNode(VLabel, {
|
||||
"class": ['v-field-label', {
|
||||
'v-field-label--floating': props.floating
|
||||
}, props.class],
|
||||
"style": props.style,
|
||||
"aria-hidden": props.floating || undefined
|
||||
}, slots));
|
||||
return {};
|
||||
}
|
||||
});
|
||||
//# sourceMappingURL=VFieldLabel.mjs.map
|
||||
1
VApp/node_modules/vuetify/lib/components/VField/VFieldLabel.mjs.map
generated
vendored
Normal file
1
VApp/node_modules/vuetify/lib/components/VField/VFieldLabel.mjs.map
generated
vendored
Normal file
@ -0,0 +1 @@
|
||||
{"version":3,"file":"VFieldLabel.mjs","names":["VLabel","makeComponentProps","genericComponent","propsFactory","useRender","makeVFieldLabelProps","floating","Boolean","VFieldLabel","name","props","setup","_ref","slots","_createVNode","class","style","undefined"],"sources":["../../../src/components/VField/VFieldLabel.tsx"],"sourcesContent":["// Components\nimport { VLabel } from '@/components/VLabel'\n\n// Composables\nimport { makeComponentProps } from '@/composables/component'\n\n// Utilities\nimport { genericComponent, propsFactory, useRender } from '@/util'\n\nexport const makeVFieldLabelProps = propsFactory({\n floating: Boolean,\n\n ...makeComponentProps(),\n}, 'VFieldLabel')\n\nexport const VFieldLabel = genericComponent()({\n name: 'VFieldLabel',\n\n props: makeVFieldLabelProps(),\n\n setup (props, { slots }) {\n useRender(() => (\n <VLabel\n class={[\n 'v-field-label',\n { 'v-field-label--floating': props.floating },\n props.class,\n ]}\n style={ props.style }\n aria-hidden={ props.floating || undefined }\n v-slots={ slots }\n />\n ))\n\n return {}\n },\n})\n\nexport type VFieldLabel = InstanceType<typeof VFieldLabel>\n"],"mappings":";AAAA;AAAA,SACSA,MAAM,+BAEf;AAAA,SACSC,kBAAkB,2CAE3B;AAAA,SACSC,gBAAgB,EAAEC,YAAY,EAAEC,SAAS;AAElD,OAAO,MAAMC,oBAAoB,GAAGF,YAAY,CAAC;EAC/CG,QAAQ,EAAEC,OAAO;EAEjB,GAAGN,kBAAkB,CAAC;AACxB,CAAC,EAAE,aAAa,CAAC;AAEjB,OAAO,MAAMO,WAAW,GAAGN,gBAAgB,CAAC,CAAC,CAAC;EAC5CO,IAAI,EAAE,aAAa;EAEnBC,KAAK,EAAEL,oBAAoB,CAAC,CAAC;EAE7BM,KAAKA,CAAED,KAAK,EAAAE,IAAA,EAAa;IAAA,IAAX;MAAEC;IAAM,CAAC,GAAAD,IAAA;IACrBR,SAAS,CAAC,MAAAU,YAAA,CAAAd,MAAA;MAAA,SAEC,CACL,eAAe,EACf;QAAE,yBAAyB,EAAEU,KAAK,CAACJ;MAAS,CAAC,EAC7CI,KAAK,CAACK,KAAK,CACZ;MAAA,SACOL,KAAK,CAACM,KAAK;MAAA,eACLN,KAAK,CAACJ,QAAQ,IAAIW;IAAS,GAC/BJ,KAAK,CAElB,CAAC;IAEF,OAAO,CAAC,CAAC;EACX;AACF,CAAC,CAAC"}
|
||||
59
VApp/node_modules/vuetify/lib/components/VField/_variables.scss
generated
vendored
Normal file
59
VApp/node_modules/vuetify/lib/components/VField/_variables.scss
generated
vendored
Normal file
@ -0,0 +1,59 @@
|
||||
@forward '../VInput/variables';
|
||||
@use '../../styles/settings';
|
||||
@use '../VInput/variables' as *;
|
||||
|
||||
// INPUT
|
||||
$field-border-radius: settings.$border-radius-root !default;
|
||||
$field-rounded-border-radius: map-get(settings.$rounded, 'pill') !default;
|
||||
$field-color: rgba(var(--v-theme-on-surface), var(--v-medium-emphasis-opacity)) !default;
|
||||
$field-disabled-color: rgba(var(--v-theme-on-surface), var(--v-disabled-opacity)) !default;
|
||||
$field-error-color: rgb(var(--v-theme-error)) !default;
|
||||
$field-font-size: 16px !default;
|
||||
$field-letter-spacing: .009375em !default;
|
||||
$field-max-width: 100% !default;
|
||||
$field-transition-timing: .15s settings.$standard-easing !default;
|
||||
$field-subtle-transition-timing: 250ms settings.$standard-easing !default;
|
||||
$field-underlined-margin-bottom: 4px !default;
|
||||
$field-clearable-margin: 4px !default;
|
||||
$field-clearable-transition: .15s opacity, .15s width settings.$standard-easing !default;
|
||||
$field-chip-height: 24px !default;
|
||||
|
||||
// CONTROL
|
||||
$field-control-solo-background: rgb(var(--v-theme-surface)) !default;
|
||||
$field-control-solo-color: rgba(var(--v-theme-on-surface), var(--v-high-emphasis-opacity)) !default;
|
||||
$field-control-solo-elevation: 2 !default;
|
||||
$field-control-solo-inverted-color: rgba(var(--v-theme-on-surface), var(--v-high-emphasis-opacity)) !default;
|
||||
$field-control-solo-inverted-focused-color: rgb(var(--v-theme-on-surface-variant)) !default;
|
||||
$field-control-filled-background: rgba(var(--v-theme-on-surface), var(--v-idle-opacity)) !default;
|
||||
$field-control-padding-start: 16px !default;
|
||||
$field-control-padding-end: 16px !default;
|
||||
$field-control-padding-top: 8px !default;
|
||||
$field-control-padding-bottom: 4px !default;
|
||||
$field-control-affixed-padding: 12px !default;
|
||||
$field-control-affixed-inner-padding: 6px !default;
|
||||
$field-control-underlined-height: 48px !default;
|
||||
$field-control-underlined-padding-bottom: 2px !default;
|
||||
$field-control-height: 56px !default;
|
||||
|
||||
// INPUT
|
||||
$field-input-opacity: var(--v-high-emphasis-opacity) !default;
|
||||
$field-input-min-height: #{max(
|
||||
var(--v-input-control-height, $input-control-height),
|
||||
calc($input-font-size * $input-line-height + var(--v-field-input-padding-top) + var(--v-field-input-padding-bottom))
|
||||
)} !default;
|
||||
$field-input-padding-top: calc(var(--v-field-padding-top, $field-control-padding-top) + var(--v-input-padding-top, 0)) !default;
|
||||
$field-input-padding-bottom: var(--v-field-padding-bottom, $field-control-padding-bottom) !default;
|
||||
$field-input-column-gap: 2px !default;
|
||||
$field-input-row-gap: 8px !default;
|
||||
|
||||
// LABEL
|
||||
$field-label-floating-scale: .75 !default;
|
||||
|
||||
// OUTLINE
|
||||
$field-outline-opacity: .38 !default;
|
||||
$field-border-width: 1px !default;
|
||||
$field-focused-border-width: 2px !default;
|
||||
|
||||
// OVERLAY
|
||||
$field-overlay-filled-opacity: 0.04 !default;
|
||||
$field-overlay-focused-background-color: rgb(var(--v-theme-surface-variant)) !default;
|
||||
519
VApp/node_modules/vuetify/lib/components/VField/index.d.mts
generated
vendored
Normal file
519
VApp/node_modules/vuetify/lib/components/VField/index.d.mts
generated
vendored
Normal file
@ -0,0 +1,519 @@
|
||||
import * as vue from 'vue';
|
||||
import { ComponentPropsOptions, ExtractPropTypes, VNodeChild, VNode, JSXComponent, PropType, Ref } from 'vue';
|
||||
|
||||
type SlotsToProps<U extends RawSlots, T = MakeInternalSlots<U>> = {
|
||||
$children?: (VNodeChild | (T extends {
|
||||
default: infer V;
|
||||
} ? V : {}) | {
|
||||
[K in keyof T]?: T[K];
|
||||
});
|
||||
'v-slots'?: {
|
||||
[K in keyof T]?: T[K] | false;
|
||||
};
|
||||
} & {
|
||||
[K in keyof T as `v-slot:${K & string}`]?: T[K] | false;
|
||||
};
|
||||
type RawSlots = Record<string, unknown>;
|
||||
type Slot<T> = [T] extends [never] ? () => VNodeChild : (arg: T) => VNodeChild;
|
||||
type VueSlot<T> = [T] extends [never] ? () => VNode[] : (arg: T) => VNode[];
|
||||
type MakeInternalSlots<T extends RawSlots> = {
|
||||
[K in keyof T]: Slot<T[K]>;
|
||||
};
|
||||
type MakeSlots<T extends RawSlots> = {
|
||||
[K in keyof T]: VueSlot<T[K]>;
|
||||
};
|
||||
type GenericProps<Props, Slots extends Record<string, unknown>> = {
|
||||
$props: Props & SlotsToProps<Slots>;
|
||||
$slots: MakeSlots<Slots>;
|
||||
};
|
||||
interface FilterPropsOptions<PropsOptions extends Readonly<ComponentPropsOptions>, Props = ExtractPropTypes<PropsOptions>> {
|
||||
filterProps<T extends Partial<Props>, U extends Exclude<keyof Props, Exclude<keyof Props, keyof T>>>(props: T): Partial<Pick<T, U>>;
|
||||
}
|
||||
|
||||
type IconValue = string | (string | [path: string, opacity: number])[] | JSXComponent;
|
||||
declare const IconValue: PropType<IconValue>;
|
||||
|
||||
interface LoaderSlotProps {
|
||||
color: string | undefined;
|
||||
isActive: boolean;
|
||||
}
|
||||
|
||||
interface DefaultInputSlot {
|
||||
isActive: Ref<boolean>;
|
||||
isFocused: Ref<boolean>;
|
||||
controlRef: Ref<HTMLElement | undefined>;
|
||||
focus: () => void;
|
||||
blur: () => void;
|
||||
}
|
||||
interface VFieldSlot extends DefaultInputSlot {
|
||||
props: Record<string, unknown>;
|
||||
}
|
||||
type VFieldSlots = {
|
||||
clear: never;
|
||||
'prepend-inner': DefaultInputSlot;
|
||||
'append-inner': DefaultInputSlot;
|
||||
label: DefaultInputSlot & {
|
||||
label: string | undefined;
|
||||
props: Record<string, any>;
|
||||
};
|
||||
loader: LoaderSlotProps;
|
||||
default: VFieldSlot;
|
||||
};
|
||||
declare const VField: {
|
||||
new (...args: any[]): vue.CreateComponentPublicInstance<{
|
||||
flat: boolean;
|
||||
reverse: boolean;
|
||||
variant: "filled" | "outlined" | "plain" | "underlined" | "solo" | "solo-inverted" | "solo-filled";
|
||||
error: boolean;
|
||||
active: boolean;
|
||||
style: vue.StyleValue;
|
||||
disabled: boolean;
|
||||
clearIcon: IconValue;
|
||||
focused: boolean;
|
||||
clearable: boolean;
|
||||
dirty: boolean;
|
||||
persistentClear: boolean;
|
||||
singleLine: boolean;
|
||||
} & {
|
||||
id?: string | undefined;
|
||||
color?: string | undefined;
|
||||
loading?: string | boolean | undefined;
|
||||
label?: string | undefined;
|
||||
class?: any;
|
||||
theme?: string | undefined;
|
||||
rounded?: string | number | boolean | undefined;
|
||||
bgColor?: string | undefined;
|
||||
baseColor?: string | undefined;
|
||||
appendInnerIcon?: IconValue | undefined;
|
||||
prependInnerIcon?: IconValue | undefined;
|
||||
'onClick:clear'?: ((args_0: MouseEvent) => void) | undefined;
|
||||
'onClick:appendInner'?: ((args_0: MouseEvent) => void) | undefined;
|
||||
'onClick:prependInner'?: ((args_0: MouseEvent) => void) | undefined;
|
||||
'onUpdate:focused'?: ((args_0: boolean) => void) | undefined;
|
||||
centerAffix?: boolean | undefined;
|
||||
} & {
|
||||
"onUpdate:focused"?: ((focused: boolean) => any) | undefined;
|
||||
}, {
|
||||
controlRef: Ref<HTMLElement | undefined>;
|
||||
}, unknown, {}, {}, vue.ComponentOptionsMixin, vue.ComponentOptionsMixin, Omit<{
|
||||
'update:focused': (focused: boolean) => true;
|
||||
'update:modelValue': (value: any) => true;
|
||||
}, "$children" | "v-slot:default" | "v-slots" | "modelValue" | "update:modelValue" | "v-slot:loader" | "v-slot:label" | "v-slot:clear" | "v-slot:prepend-inner" | "v-slot:append-inner">, vue.VNodeProps & vue.AllowedComponentProps & vue.ComponentCustomProps & {
|
||||
flat: boolean;
|
||||
reverse: boolean;
|
||||
variant: "filled" | "outlined" | "plain" | "underlined" | "solo" | "solo-inverted" | "solo-filled";
|
||||
error: boolean;
|
||||
active: boolean;
|
||||
style: vue.StyleValue;
|
||||
disabled: boolean;
|
||||
clearIcon: IconValue;
|
||||
focused: boolean;
|
||||
clearable: boolean;
|
||||
dirty: boolean;
|
||||
persistentClear: boolean;
|
||||
singleLine: boolean;
|
||||
} & {
|
||||
id?: string | undefined;
|
||||
color?: string | undefined;
|
||||
loading?: string | boolean | undefined;
|
||||
label?: string | undefined;
|
||||
class?: any;
|
||||
theme?: string | undefined;
|
||||
rounded?: string | number | boolean | undefined;
|
||||
bgColor?: string | undefined;
|
||||
baseColor?: string | undefined;
|
||||
appendInnerIcon?: IconValue | undefined;
|
||||
prependInnerIcon?: IconValue | undefined;
|
||||
'onClick:clear'?: ((args_0: MouseEvent) => void) | undefined;
|
||||
'onClick:appendInner'?: ((args_0: MouseEvent) => void) | undefined;
|
||||
'onClick:prependInner'?: ((args_0: MouseEvent) => void) | undefined;
|
||||
'onUpdate:focused'?: ((args_0: boolean) => void) | undefined;
|
||||
centerAffix?: boolean | undefined;
|
||||
} & {
|
||||
"onUpdate:focused"?: ((focused: boolean) => any) | undefined;
|
||||
}, {
|
||||
flat: boolean;
|
||||
reverse: boolean;
|
||||
variant: "filled" | "outlined" | "plain" | "underlined" | "solo" | "solo-inverted" | "solo-filled";
|
||||
error: boolean;
|
||||
active: boolean;
|
||||
style: vue.StyleValue;
|
||||
disabled: boolean;
|
||||
rounded: string | number | boolean;
|
||||
clearIcon: IconValue;
|
||||
focused: boolean;
|
||||
centerAffix: boolean;
|
||||
clearable: boolean;
|
||||
dirty: boolean;
|
||||
persistentClear: boolean;
|
||||
singleLine: boolean;
|
||||
}, true, {}, vue.SlotsType<Partial<{
|
||||
clear: () => vue.VNode<vue.RendererNode, vue.RendererElement, {
|
||||
[key: string]: any;
|
||||
}>[];
|
||||
'prepend-inner': (arg: DefaultInputSlot) => vue.VNode<vue.RendererNode, vue.RendererElement, {
|
||||
[key: string]: any;
|
||||
}>[];
|
||||
'append-inner': (arg: DefaultInputSlot) => vue.VNode<vue.RendererNode, vue.RendererElement, {
|
||||
[key: string]: any;
|
||||
}>[];
|
||||
label: (arg: DefaultInputSlot & {
|
||||
label: string | undefined;
|
||||
props: Record<string, any>;
|
||||
}) => vue.VNode<vue.RendererNode, vue.RendererElement, {
|
||||
[key: string]: any;
|
||||
}>[];
|
||||
loader: (arg: LoaderSlotProps) => vue.VNode<vue.RendererNode, vue.RendererElement, {
|
||||
[key: string]: any;
|
||||
}>[];
|
||||
default: (arg: VFieldSlot) => vue.VNode<vue.RendererNode, vue.RendererElement, {
|
||||
[key: string]: any;
|
||||
}>[];
|
||||
}>>, {
|
||||
P: {};
|
||||
B: {};
|
||||
D: {};
|
||||
C: {};
|
||||
M: {};
|
||||
Defaults: {};
|
||||
}, {
|
||||
flat: boolean;
|
||||
reverse: boolean;
|
||||
variant: "filled" | "outlined" | "plain" | "underlined" | "solo" | "solo-inverted" | "solo-filled";
|
||||
error: boolean;
|
||||
active: boolean;
|
||||
style: vue.StyleValue;
|
||||
disabled: boolean;
|
||||
clearIcon: IconValue;
|
||||
focused: boolean;
|
||||
clearable: boolean;
|
||||
dirty: boolean;
|
||||
persistentClear: boolean;
|
||||
singleLine: boolean;
|
||||
} & {
|
||||
id?: string | undefined;
|
||||
color?: string | undefined;
|
||||
loading?: string | boolean | undefined;
|
||||
label?: string | undefined;
|
||||
class?: any;
|
||||
theme?: string | undefined;
|
||||
rounded?: string | number | boolean | undefined;
|
||||
bgColor?: string | undefined;
|
||||
baseColor?: string | undefined;
|
||||
appendInnerIcon?: IconValue | undefined;
|
||||
prependInnerIcon?: IconValue | undefined;
|
||||
'onClick:clear'?: ((args_0: MouseEvent) => void) | undefined;
|
||||
'onClick:appendInner'?: ((args_0: MouseEvent) => void) | undefined;
|
||||
'onClick:prependInner'?: ((args_0: MouseEvent) => void) | undefined;
|
||||
'onUpdate:focused'?: ((args_0: boolean) => void) | undefined;
|
||||
centerAffix?: boolean | undefined;
|
||||
} & {
|
||||
"onUpdate:focused"?: ((focused: boolean) => any) | undefined;
|
||||
}, {
|
||||
controlRef: Ref<HTMLElement | undefined>;
|
||||
}, {}, {}, {}, {
|
||||
flat: boolean;
|
||||
reverse: boolean;
|
||||
variant: "filled" | "outlined" | "plain" | "underlined" | "solo" | "solo-inverted" | "solo-filled";
|
||||
error: boolean;
|
||||
active: boolean;
|
||||
style: vue.StyleValue;
|
||||
disabled: boolean;
|
||||
rounded: string | number | boolean;
|
||||
clearIcon: IconValue;
|
||||
focused: boolean;
|
||||
centerAffix: boolean;
|
||||
clearable: boolean;
|
||||
dirty: boolean;
|
||||
persistentClear: boolean;
|
||||
singleLine: boolean;
|
||||
}>;
|
||||
__isFragment?: undefined;
|
||||
__isTeleport?: undefined;
|
||||
__isSuspense?: undefined;
|
||||
} & vue.ComponentOptionsBase<{
|
||||
flat: boolean;
|
||||
reverse: boolean;
|
||||
variant: "filled" | "outlined" | "plain" | "underlined" | "solo" | "solo-inverted" | "solo-filled";
|
||||
error: boolean;
|
||||
active: boolean;
|
||||
style: vue.StyleValue;
|
||||
disabled: boolean;
|
||||
clearIcon: IconValue;
|
||||
focused: boolean;
|
||||
clearable: boolean;
|
||||
dirty: boolean;
|
||||
persistentClear: boolean;
|
||||
singleLine: boolean;
|
||||
} & {
|
||||
id?: string | undefined;
|
||||
color?: string | undefined;
|
||||
loading?: string | boolean | undefined;
|
||||
label?: string | undefined;
|
||||
class?: any;
|
||||
theme?: string | undefined;
|
||||
rounded?: string | number | boolean | undefined;
|
||||
bgColor?: string | undefined;
|
||||
baseColor?: string | undefined;
|
||||
appendInnerIcon?: IconValue | undefined;
|
||||
prependInnerIcon?: IconValue | undefined;
|
||||
'onClick:clear'?: ((args_0: MouseEvent) => void) | undefined;
|
||||
'onClick:appendInner'?: ((args_0: MouseEvent) => void) | undefined;
|
||||
'onClick:prependInner'?: ((args_0: MouseEvent) => void) | undefined;
|
||||
'onUpdate:focused'?: ((args_0: boolean) => void) | undefined;
|
||||
centerAffix?: boolean | undefined;
|
||||
} & {
|
||||
"onUpdate:focused"?: ((focused: boolean) => any) | undefined;
|
||||
}, {
|
||||
controlRef: Ref<HTMLElement | undefined>;
|
||||
}, unknown, {}, {}, vue.ComponentOptionsMixin, vue.ComponentOptionsMixin, Omit<{
|
||||
'update:focused': (focused: boolean) => true;
|
||||
'update:modelValue': (value: any) => true;
|
||||
}, "$children" | "v-slot:default" | "v-slots" | "modelValue" | "update:modelValue" | "v-slot:loader" | "v-slot:label" | "v-slot:clear" | "v-slot:prepend-inner" | "v-slot:append-inner">, string, {
|
||||
flat: boolean;
|
||||
reverse: boolean;
|
||||
variant: "filled" | "outlined" | "plain" | "underlined" | "solo" | "solo-inverted" | "solo-filled";
|
||||
error: boolean;
|
||||
active: boolean;
|
||||
style: vue.StyleValue;
|
||||
disabled: boolean;
|
||||
rounded: string | number | boolean;
|
||||
clearIcon: IconValue;
|
||||
focused: boolean;
|
||||
centerAffix: boolean;
|
||||
clearable: boolean;
|
||||
dirty: boolean;
|
||||
persistentClear: boolean;
|
||||
singleLine: boolean;
|
||||
}, {}, string, vue.SlotsType<Partial<{
|
||||
clear: () => vue.VNode<vue.RendererNode, vue.RendererElement, {
|
||||
[key: string]: any;
|
||||
}>[];
|
||||
'prepend-inner': (arg: DefaultInputSlot) => vue.VNode<vue.RendererNode, vue.RendererElement, {
|
||||
[key: string]: any;
|
||||
}>[];
|
||||
'append-inner': (arg: DefaultInputSlot) => vue.VNode<vue.RendererNode, vue.RendererElement, {
|
||||
[key: string]: any;
|
||||
}>[];
|
||||
label: (arg: DefaultInputSlot & {
|
||||
label: string | undefined;
|
||||
props: Record<string, any>;
|
||||
}) => vue.VNode<vue.RendererNode, vue.RendererElement, {
|
||||
[key: string]: any;
|
||||
}>[];
|
||||
loader: (arg: LoaderSlotProps) => vue.VNode<vue.RendererNode, vue.RendererElement, {
|
||||
[key: string]: any;
|
||||
}>[];
|
||||
default: (arg: VFieldSlot) => vue.VNode<vue.RendererNode, vue.RendererElement, {
|
||||
[key: string]: any;
|
||||
}>[];
|
||||
}>>> & vue.VNodeProps & vue.AllowedComponentProps & vue.ComponentCustomProps & (new <T>(props: {
|
||||
modelValue?: T | undefined;
|
||||
'onUpdate:modelValue'?: ((value: T) => void) | undefined;
|
||||
}, slots: VFieldSlots) => GenericProps<{
|
||||
modelValue?: T | undefined;
|
||||
'onUpdate:modelValue'?: ((value: T) => void) | undefined;
|
||||
}, VFieldSlots>) & FilterPropsOptions<{
|
||||
theme: StringConstructor;
|
||||
rounded: {
|
||||
type: (StringConstructor | BooleanConstructor | NumberConstructor)[];
|
||||
default: undefined;
|
||||
};
|
||||
loading: (StringConstructor | BooleanConstructor)[];
|
||||
class: PropType<any>;
|
||||
style: {
|
||||
type: PropType<vue.StyleValue>;
|
||||
default: null;
|
||||
};
|
||||
appendInnerIcon: PropType<IconValue>;
|
||||
bgColor: StringConstructor;
|
||||
clearable: BooleanConstructor;
|
||||
clearIcon: {
|
||||
type: PropType<IconValue>;
|
||||
default: string;
|
||||
};
|
||||
active: BooleanConstructor;
|
||||
centerAffix: {
|
||||
type: BooleanConstructor;
|
||||
default: undefined;
|
||||
};
|
||||
color: StringConstructor;
|
||||
baseColor: StringConstructor;
|
||||
dirty: BooleanConstructor;
|
||||
disabled: {
|
||||
type: BooleanConstructor;
|
||||
default: null;
|
||||
};
|
||||
error: BooleanConstructor;
|
||||
flat: BooleanConstructor;
|
||||
label: StringConstructor;
|
||||
persistentClear: BooleanConstructor;
|
||||
prependInnerIcon: PropType<IconValue>;
|
||||
reverse: BooleanConstructor;
|
||||
singleLine: BooleanConstructor;
|
||||
variant: {
|
||||
type: PropType<"filled" | "outlined" | "plain" | "underlined" | "solo" | "solo-inverted" | "solo-filled">;
|
||||
default: string;
|
||||
validator: (v: any) => boolean;
|
||||
};
|
||||
'onClick:clear': PropType<(args_0: MouseEvent) => void>;
|
||||
'onClick:appendInner': PropType<(args_0: MouseEvent) => void>;
|
||||
'onClick:prependInner': PropType<(args_0: MouseEvent) => void>;
|
||||
focused: BooleanConstructor;
|
||||
'onUpdate:focused': PropType<(args_0: boolean) => void>;
|
||||
id: StringConstructor;
|
||||
}, vue.ExtractPropTypes<{
|
||||
theme: StringConstructor;
|
||||
rounded: {
|
||||
type: (StringConstructor | BooleanConstructor | NumberConstructor)[];
|
||||
default: undefined;
|
||||
};
|
||||
loading: (StringConstructor | BooleanConstructor)[];
|
||||
class: PropType<any>;
|
||||
style: {
|
||||
type: PropType<vue.StyleValue>;
|
||||
default: null;
|
||||
};
|
||||
appendInnerIcon: PropType<IconValue>;
|
||||
bgColor: StringConstructor;
|
||||
clearable: BooleanConstructor;
|
||||
clearIcon: {
|
||||
type: PropType<IconValue>;
|
||||
default: string;
|
||||
};
|
||||
active: BooleanConstructor;
|
||||
centerAffix: {
|
||||
type: BooleanConstructor;
|
||||
default: undefined;
|
||||
};
|
||||
color: StringConstructor;
|
||||
baseColor: StringConstructor;
|
||||
dirty: BooleanConstructor;
|
||||
disabled: {
|
||||
type: BooleanConstructor;
|
||||
default: null;
|
||||
};
|
||||
error: BooleanConstructor;
|
||||
flat: BooleanConstructor;
|
||||
label: StringConstructor;
|
||||
persistentClear: BooleanConstructor;
|
||||
prependInnerIcon: PropType<IconValue>;
|
||||
reverse: BooleanConstructor;
|
||||
singleLine: BooleanConstructor;
|
||||
variant: {
|
||||
type: PropType<"filled" | "outlined" | "plain" | "underlined" | "solo" | "solo-inverted" | "solo-filled">;
|
||||
default: string;
|
||||
validator: (v: any) => boolean;
|
||||
};
|
||||
'onClick:clear': PropType<(args_0: MouseEvent) => void>;
|
||||
'onClick:appendInner': PropType<(args_0: MouseEvent) => void>;
|
||||
'onClick:prependInner': PropType<(args_0: MouseEvent) => void>;
|
||||
focused: BooleanConstructor;
|
||||
'onUpdate:focused': PropType<(args_0: boolean) => void>;
|
||||
id: StringConstructor;
|
||||
}>>;
|
||||
type VField = InstanceType<typeof VField>;
|
||||
|
||||
declare const VFieldLabel: {
|
||||
new (...args: any[]): vue.CreateComponentPublicInstance<{
|
||||
style: vue.StyleValue;
|
||||
floating: boolean;
|
||||
} & {
|
||||
class?: any;
|
||||
} & {
|
||||
$children?: vue.VNodeChild | (() => vue.VNodeChild) | {
|
||||
default?: (() => vue.VNodeChild) | undefined;
|
||||
};
|
||||
'v-slots'?: {
|
||||
default?: false | (() => vue.VNodeChild) | undefined;
|
||||
} | undefined;
|
||||
} & {
|
||||
"v-slot:default"?: false | (() => vue.VNodeChild) | undefined;
|
||||
}, {}, unknown, {}, {}, vue.ComponentOptionsMixin, vue.ComponentOptionsMixin, Record<string, any>, vue.VNodeProps & vue.AllowedComponentProps & vue.ComponentCustomProps & {
|
||||
style: vue.StyleValue;
|
||||
floating: boolean;
|
||||
} & {
|
||||
class?: any;
|
||||
} & {
|
||||
$children?: vue.VNodeChild | (() => vue.VNodeChild) | {
|
||||
default?: (() => vue.VNodeChild) | undefined;
|
||||
};
|
||||
'v-slots'?: {
|
||||
default?: false | (() => vue.VNodeChild) | undefined;
|
||||
} | undefined;
|
||||
} & {
|
||||
"v-slot:default"?: false | (() => vue.VNodeChild) | undefined;
|
||||
}, {
|
||||
style: vue.StyleValue;
|
||||
floating: boolean;
|
||||
}, true, {}, vue.SlotsType<Partial<{
|
||||
default: () => vue.VNode<vue.RendererNode, vue.RendererElement, {
|
||||
[key: string]: any;
|
||||
}>[];
|
||||
}>>, {
|
||||
P: {};
|
||||
B: {};
|
||||
D: {};
|
||||
C: {};
|
||||
M: {};
|
||||
Defaults: {};
|
||||
}, {
|
||||
style: vue.StyleValue;
|
||||
floating: boolean;
|
||||
} & {
|
||||
class?: any;
|
||||
} & {
|
||||
$children?: vue.VNodeChild | (() => vue.VNodeChild) | {
|
||||
default?: (() => vue.VNodeChild) | undefined;
|
||||
};
|
||||
'v-slots'?: {
|
||||
default?: false | (() => vue.VNodeChild) | undefined;
|
||||
} | undefined;
|
||||
} & {
|
||||
"v-slot:default"?: false | (() => vue.VNodeChild) | undefined;
|
||||
}, {}, {}, {}, {}, {
|
||||
style: vue.StyleValue;
|
||||
floating: boolean;
|
||||
}>;
|
||||
__isFragment?: undefined;
|
||||
__isTeleport?: undefined;
|
||||
__isSuspense?: undefined;
|
||||
} & vue.ComponentOptionsBase<{
|
||||
style: vue.StyleValue;
|
||||
floating: boolean;
|
||||
} & {
|
||||
class?: any;
|
||||
} & {
|
||||
$children?: vue.VNodeChild | (() => vue.VNodeChild) | {
|
||||
default?: (() => vue.VNodeChild) | undefined;
|
||||
};
|
||||
'v-slots'?: {
|
||||
default?: false | (() => vue.VNodeChild) | undefined;
|
||||
} | undefined;
|
||||
} & {
|
||||
"v-slot:default"?: false | (() => vue.VNodeChild) | undefined;
|
||||
}, {}, unknown, {}, {}, vue.ComponentOptionsMixin, vue.ComponentOptionsMixin, Record<string, any>, string, {
|
||||
style: vue.StyleValue;
|
||||
floating: boolean;
|
||||
}, {}, string, vue.SlotsType<Partial<{
|
||||
default: () => vue.VNode<vue.RendererNode, vue.RendererElement, {
|
||||
[key: string]: any;
|
||||
}>[];
|
||||
}>>> & vue.VNodeProps & vue.AllowedComponentProps & vue.ComponentCustomProps & FilterPropsOptions<{
|
||||
class: vue.PropType<any>;
|
||||
style: {
|
||||
type: vue.PropType<vue.StyleValue>;
|
||||
default: null;
|
||||
};
|
||||
floating: BooleanConstructor;
|
||||
}, vue.ExtractPropTypes<{
|
||||
class: vue.PropType<any>;
|
||||
style: {
|
||||
type: vue.PropType<vue.StyleValue>;
|
||||
default: null;
|
||||
};
|
||||
floating: BooleanConstructor;
|
||||
}>>;
|
||||
type VFieldLabel = InstanceType<typeof VFieldLabel>;
|
||||
|
||||
export { VField, VFieldLabel };
|
||||
3
VApp/node_modules/vuetify/lib/components/VField/index.mjs
generated
vendored
Normal file
3
VApp/node_modules/vuetify/lib/components/VField/index.mjs
generated
vendored
Normal file
@ -0,0 +1,3 @@
|
||||
export { VField } from "./VField.mjs";
|
||||
export { VFieldLabel } from "./VFieldLabel.mjs";
|
||||
//# sourceMappingURL=index.mjs.map
|
||||
1
VApp/node_modules/vuetify/lib/components/VField/index.mjs.map
generated
vendored
Normal file
1
VApp/node_modules/vuetify/lib/components/VField/index.mjs.map
generated
vendored
Normal file
@ -0,0 +1 @@
|
||||
{"version":3,"file":"index.mjs","names":["VField","VFieldLabel"],"sources":["../../../src/components/VField/index.ts"],"sourcesContent":["export { VField } from './VField'\nexport { VFieldLabel } from './VFieldLabel'\n"],"mappings":"SAASA,MAAM;AAAA,SACNC,WAAW"}
|
||||
Reference in New Issue
Block a user