@vuetify/nightly 3.0.0-beta.6 → 3.0.0-beta.9

package/lib/components/VSelect/VSelect.mjs.map

@@ -1 +1 @@
-{"version":3,"file":"VSelect.mjs","names":["VDialogTransition","VCheckboxBtn","VChip","VDefaultsProvider","VList","VListItem","VMenu","VTextField","makeItemsProps","useItems","makeTransitionProps","useForwardRef","useLocale","useProxiedModel","IconValue","computed","mergeProps","ref","genericComponent","propsFactory","useRender","wrapInArray","makeSelectProps","chips","Boolean","closableChips","eager","hideNoData","hideSelected","menu","menuIcon","type","default","menuProps","Object","modelValue","multiple","noDataText","String","openOnClear","itemChildren","VSelect","name","props","transition","component","emits","val","setup","slots","t","vTextFieldRef","items","transformIn","transformOut","model","v","transformed","selections","value","map","find","item","selected","selection","onClear","e","onClickControl","length","onKeydown","includes","key","select","index","findIndex","splice","hasChips","chip","join","preventDefault","onClick","prepend","isSelected","undefined","onChipClose","stopPropagation","slotProps","closable","size","text","title"],"sources":["../../../src/components/VSelect/VSelect.tsx"],"sourcesContent":["// Styles\nimport './VSelect.sass'\n\n// Components\nimport { VDialogTransition } from '@/components/transitions'\nimport { VCheckboxBtn } from '@/components/VCheckbox'\nimport { VChip } from '@/components/VChip'\nimport { VDefaultsProvider } from '@/components/VDefaultsProvider'\nimport { VList, VListItem } from '@/components/VList'\nimport { VMenu } from '@/components/VMenu'\nimport { VTextField } from '@/components/VTextField'\n\n// Composables\nimport { makeItemsProps, useItems } from '@/composables/items'\nimport { makeTransitionProps } from '@/composables/transition'\nimport { useForwardRef } from '@/composables/forwardRef'\nimport { useLocale } from '@/composables/locale'\nimport { useProxiedModel } from '@/composables/proxiedModel'\nimport { IconValue } from '@/composables/icons'\n\n// Utility\nimport { computed, mergeProps, ref } from 'vue'\nimport { genericComponent, propsFactory, useRender, wrapInArray } from '@/util'\n\n// Types\nimport type { VInputSlots } from '@/components/VInput/VInput'\nimport type { VFieldSlots } from '@/components/VField/VField'\nimport type { InternalItem } from '@/composables/items'\nimport type { MakeSlots } from '@/util'\nimport type { PropType } from 'vue'\n\nexport const makeSelectProps = propsFactory({\n  chips: Boolean,\n  closableChips: Boolean,\n  eager: Boolean,\n  hideNoData: Boolean,\n  hideSelected: Boolean,\n  menu: Boolean,\n  menuIcon: {\n    type: IconValue,\n    default: '$dropdown',\n  },\n  menuProps: {\n    type: Object as PropType<VMenu['$props']>,\n  },\n  modelValue: {\n    type: null,\n    default: () => ([]),\n  },\n  multiple: Boolean,\n  noDataText: {\n    type: String,\n    default: '$vuetify.noDataText',\n  },\n  openOnClear: Boolean,\n\n  ...makeItemsProps({ itemChildren: false }),\n}, 'select')\n\ntype Primitive = string | number | boolean | symbol\n\ntype Val <T, ReturnObject extends boolean> = T extends Primitive\n  ? T\n  : (ReturnObject extends true ? T : any)\n\ntype Value <T, ReturnObject extends boolean, Multiple extends boolean> =\n  Multiple extends true\n    ? Val<T, ReturnObject>[]\n    : Val<T, ReturnObject>\n\nexport const VSelect = genericComponent<new <\n  T,\n  ReturnObject extends boolean = false,\n  Multiple extends boolean = false,\n  V extends Value<T, ReturnObject, Multiple> = Value<T, ReturnObject, Multiple>\n>() => {\n  $props: {\n    items?: readonly T[]\n    returnObject?: ReturnObject\n    multiple?: Multiple\n    modelValue?: Readonly<V>\n    'onUpdate:modelValue'?: (val: V) => void\n  }\n  $slots: VInputSlots & VFieldSlots & MakeSlots<{\n    item: [{ item: T, index: number, props: Record<string, unknown> }]\n    chip: [{ item: T, index: number, props: Record<string, unknown> }]\n    selection: [{ item: T, index: number }]\n    'no-data': []\n  }>\n}>()({\n  name: 'VSelect',\n\n  props: {\n    ...makeSelectProps(),\n    ...makeTransitionProps({ transition: { component: VDialogTransition } }),\n  },\n\n  emits: {\n    'update:modelValue': (val: any) => true,\n    'update:menu': (val: boolean) => true,\n  },\n\n  setup (props, { slots }) {\n    const { t } = useLocale()\n    const vTextFieldRef = ref()\n    const menu = useProxiedModel(props, 'menu')\n    const { items, transformIn, transformOut } = useItems(props)\n    const model = useProxiedModel(\n      props,\n      'modelValue',\n      [],\n      v => transformIn(wrapInArray(v)),\n      v => {\n        const transformed = transformOut(v)\n        return props.multiple ? transformed : (transformed[0] ?? null)\n      }\n    )\n    const selections = computed(() => {\n      return model.value.map(v => {\n        return items.value.find(item => item.value === v.value) || v\n      })\n    })\n    const selected = computed(() => selections.value.map(selection => selection.props.value))\n\n    function onClear (e: MouseEvent) {\n      model.value = []\n\n      if (props.openOnClear) {\n        menu.value = true\n      }\n    }\n    function onClickControl () {\n      if (props.hideNoData && !items.value.length) return\n\n      menu.value = true\n    }\n    function onKeydown (e: KeyboardEvent) {\n      if (['Enter', 'ArrowDown', ' '].includes(e.key)) {\n        menu.value = true\n      }\n\n      if (['Escape', 'Tab'].includes(e.key)) {\n        menu.value = false\n      }\n    }\n    function select (item: InternalItem) {\n      if (props.multiple) {\n        const index = selected.value.findIndex(selection => selection === item.value)\n\n        if (index === -1) {\n          model.value = [...model.value, item]\n        } else {\n          const value = [...model.value]\n          value.splice(index, 1)\n          model.value = value\n        }\n      } else {\n        model.value = [item]\n        menu.value = false\n      }\n    }\n\n    useRender(() => {\n      const hasChips = !!(props.chips || slots.chip)\n\n      return (\n        <VTextField\n          ref={ vTextFieldRef }\n          modelValue={ model.value.map(v => v.props.value).join(', ') }\n          onUpdate:modelValue={ v => { if (v == null) model.value = [] } }\n          validationValue={ props.modelValue }\n          class={[\n            'v-select',\n            {\n              'v-select--active-menu': menu.value,\n              'v-select--chips': !!props.chips,\n              [`v-select--${props.multiple ? 'multiple' : 'single'}`]: true,\n            },\n          ]}\n          appendInnerIcon={ props.menuIcon }\n          readonly\n          onClick:clear={ onClear }\n          onClick:input={ onClickControl }\n          onClick:control={ onClickControl }\n          onBlur={ () => menu.value = false }\n          onKeydown={ onKeydown }\n        >\n          {{\n            ...slots,\n            default: () => (\n              <>\n                <VMenu\n                  v-model={ menu.value }\n                  activator=\"parent\"\n                  contentClass=\"v-select__content\"\n                  eager={ props.eager }\n                  openOnClick={ false }\n                  closeOnContentClick={ false }\n                  transition={ props.transition }\n                  { ...props.menuProps }\n                >\n                  <VList\n                    selected={ selected.value }\n                    selectStrategy={ props.multiple ? 'independent' : 'single-independent' }\n                    onMousedown={ (e: MouseEvent) => e.preventDefault() }\n                  >\n                    { !items.value.length && !props.hideNoData && (slots['no-data']?.() ?? (\n                      <VListItem title={ t(props.noDataText) } />\n                    )) }\n\n                    { slots['prepend-item']?.() }\n\n                    { items.value.map((item, index) => slots.item?.({\n                      item,\n                      index,\n                      props: mergeProps(item.props, { onClick: () => select(item) }),\n                    }) ?? (\n                      <VListItem\n                        key={ index }\n                        { ...item.props }\n                        onClick={ () => select(item) }\n                      >\n                        {{\n                          prepend: ({ isSelected }) => props.multiple && !props.hideSelected ? (\n                            <VCheckboxBtn modelValue={ isSelected } ripple={ false } />\n                          ) : undefined,\n                        }}\n                      </VListItem>\n                    )) }\n\n                    { slots['append-item']?.() }\n                  </VList>\n                </VMenu>\n\n                { selections.value.map((item, index) => {\n                  function onChipClose (e: Event) {\n                    e.stopPropagation()\n                    e.preventDefault()\n\n                    select(item)\n                  }\n\n                  const slotProps = {\n                    'onClick:close': onChipClose,\n                    modelValue: true,\n                  }\n\n                  return (\n                    <div key={ index } class=\"v-select__selection\">\n                      { hasChips ? (\n                        <VDefaultsProvider\n                          defaults={{\n                            VChip: {\n                              closable: props.closableChips,\n                              size: 'small',\n                              text: item.title,\n                            },\n                          }}\n                        >\n                          { slots.chip\n                            ? slots.chip({ item, index, props: slotProps })\n                            : (<VChip { ...slotProps } />)\n                          }\n                        </VDefaultsProvider>\n                      ) : (\n                        slots.selection\n                          ? slots.selection({ item, index })\n                          : (\n                            <span class=\"v-select__selection-text\">\n                              { item.title }\n                              { props.multiple && (index < selections.value.length - 1) && (\n                                <span class=\"v-select__selection-comma\">,</span>\n                              ) }\n                            </span>\n                          )\n                      )}\n                    </div>\n                  )\n                }) }\n              </>\n            ),\n          }}\n        </VTextField>\n      )\n    })\n\n    return useForwardRef({\n      menu,\n      select,\n    }, vTextFieldRef)\n  },\n})\n\nexport type VSelect = InstanceType<typeof VSelect>\n"],"mappings":"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"}
+{"version":3,"file":"VSelect.mjs","names":["VDialogTransition","VCheckboxBtn","VChip","VDefaultsProvider","VList","VListItem","VMenu","VTextField","makeItemsProps","useItems","makeTransitionProps","forwardRefs","useLocale","useProxiedModel","IconValue","computed","mergeProps","ref","genericComponent","propsFactory","useRender","wrapInArray","makeSelectProps","chips","Boolean","closableChips","eager","hideNoData","hideSelected","menu","menuIcon","type","default","menuProps","Object","modelValue","multiple","noDataText","String","openOnClear","itemChildren","VSelect","name","props","transition","component","emits","val","setup","slots","t","vTextFieldRef","items","transformIn","transformOut","model","v","transformed","selections","value","map","find","item","selected","selection","onClear","e","onClickControl","length","onKeydown","includes","key","select","index","findIndex","splice","hasChips","chip","join","preventDefault","onClick","prepend","isSelected","undefined","onChipClose","stopPropagation","slotProps","closable","size","text","title"],"sources":["../../../src/components/VSelect/VSelect.tsx"],"sourcesContent":["// Styles\nimport './VSelect.sass'\n\n// Components\nimport { VDialogTransition } from '@/components/transitions'\nimport { VCheckboxBtn } from '@/components/VCheckbox'\nimport { VChip } from '@/components/VChip'\nimport { VDefaultsProvider } from '@/components/VDefaultsProvider'\nimport { VList, VListItem } from '@/components/VList'\nimport { VMenu } from '@/components/VMenu'\nimport { VTextField } from '@/components/VTextField'\n\n// Composables\nimport { makeItemsProps, useItems } from '@/composables/items'\nimport { makeTransitionProps } from '@/composables/transition'\nimport { forwardRefs } from '@/composables/forwardRefs'\nimport { useLocale } from '@/composables/locale'\nimport { useProxiedModel } from '@/composables/proxiedModel'\nimport { IconValue } from '@/composables/icons'\n\n// Utility\nimport { computed, mergeProps, ref } from 'vue'\nimport { genericComponent, propsFactory, useRender, wrapInArray } from '@/util'\n\n// Types\nimport type { VInputSlots } from '@/components/VInput/VInput'\nimport type { VFieldSlots } from '@/components/VField/VField'\nimport type { InternalItem } from '@/composables/items'\nimport type { MakeSlots } from '@/util'\nimport type { PropType } from 'vue'\n\nexport const makeSelectProps = propsFactory({\n  chips: Boolean,\n  closableChips: Boolean,\n  eager: Boolean,\n  hideNoData: Boolean,\n  hideSelected: Boolean,\n  menu: Boolean,\n  menuIcon: {\n    type: IconValue,\n    default: '$dropdown',\n  },\n  menuProps: {\n    type: Object as PropType<VMenu['$props']>,\n  },\n  modelValue: {\n    type: null,\n    default: () => ([]),\n  },\n  multiple: Boolean,\n  noDataText: {\n    type: String,\n    default: '$vuetify.noDataText',\n  },\n  openOnClear: Boolean,\n\n  ...makeItemsProps({ itemChildren: false }),\n}, 'select')\n\ntype Primitive = string | number | boolean | symbol\n\ntype Val <T, ReturnObject extends boolean> = T extends Primitive\n  ? T\n  : (ReturnObject extends true ? T : any)\n\ntype Value <T, ReturnObject extends boolean, Multiple extends boolean> =\n  Multiple extends true\n    ? Val<T, ReturnObject>[]\n    : Val<T, ReturnObject>\n\nexport const VSelect = genericComponent<new <\n  T,\n  ReturnObject extends boolean = false,\n  Multiple extends boolean = false,\n  V extends Value<T, ReturnObject, Multiple> = Value<T, ReturnObject, Multiple>\n>() => {\n  $props: {\n    items?: readonly T[]\n    returnObject?: ReturnObject\n    multiple?: Multiple\n    modelValue?: Readonly<V>\n    'onUpdate:modelValue'?: (val: V) => void\n  }\n  $slots: Omit<VInputSlots & VFieldSlots, 'default'> & MakeSlots<{\n    item: [{ item: T, index: number, props: Record<string, unknown> }]\n    chip: [{ item: T, index: number, props: Record<string, unknown> }]\n    selection: [{ item: T, index: number }]\n    'no-data': []\n  }>\n}>()({\n  name: 'VSelect',\n\n  props: {\n    ...makeSelectProps(),\n    ...makeTransitionProps({ transition: { component: VDialogTransition } }),\n  },\n\n  emits: {\n    'update:modelValue': (val: any) => true,\n    'update:menu': (val: boolean) => true,\n  },\n\n  setup (props, { slots }) {\n    const { t } = useLocale()\n    const vTextFieldRef = ref<VTextField>()\n    const menu = useProxiedModel(props, 'menu')\n    const { items, transformIn, transformOut } = useItems(props)\n    const model = useProxiedModel(\n      props,\n      'modelValue',\n      [],\n      v => transformIn(wrapInArray(v)),\n      v => {\n        const transformed = transformOut(v)\n        return props.multiple ? transformed : (transformed[0] ?? null)\n      }\n    )\n    const selections = computed(() => {\n      return model.value.map(v => {\n        return items.value.find(item => item.value === v.value) || v\n      })\n    })\n    const selected = computed(() => selections.value.map(selection => selection.props.value))\n\n    function onClear (e: MouseEvent) {\n      model.value = []\n\n      if (props.openOnClear) {\n        menu.value = true\n      }\n    }\n    function onClickControl () {\n      if (props.hideNoData && !items.value.length) return\n\n      menu.value = !menu.value\n    }\n    function onKeydown (e: KeyboardEvent) {\n      if (['Enter', 'ArrowDown', ' '].includes(e.key)) {\n        menu.value = true\n      }\n\n      if (['Escape', 'Tab'].includes(e.key)) {\n        menu.value = false\n      }\n    }\n    function select (item: InternalItem) {\n      if (props.multiple) {\n        const index = selected.value.findIndex(selection => selection === item.value)\n\n        if (index === -1) {\n          model.value = [...model.value, item]\n        } else {\n          const value = [...model.value]\n          value.splice(index, 1)\n          model.value = value\n        }\n      } else {\n        model.value = [item]\n        menu.value = false\n      }\n    }\n\n    useRender(() => {\n      const hasChips = !!(props.chips || slots.chip)\n\n      return (\n        <VTextField\n          ref={ vTextFieldRef }\n          modelValue={ model.value.map(v => v.props.value).join(', ') }\n          onUpdate:modelValue={ v => { if (v == null) model.value = [] } }\n          validationValue={ props.modelValue }\n          class={[\n            'v-select',\n            {\n              'v-select--active-menu': menu.value,\n              'v-select--chips': !!props.chips,\n              [`v-select--${props.multiple ? 'multiple' : 'single'}`]: true,\n            },\n          ]}\n          appendInnerIcon={ props.menuIcon }\n          readonly\n          onClick:clear={ onClear }\n          onClick:control={ onClickControl }\n          onBlur={ () => menu.value = false }\n          onKeydown={ onKeydown }\n        >\n          {{\n            ...slots,\n            default: () => (\n              <>\n                <VMenu\n                  v-model={ menu.value }\n                  activator=\"parent\"\n                  contentClass=\"v-select__content\"\n                  eager={ props.eager }\n                  openOnClick={ false }\n                  closeOnContentClick={ false }\n                  transition={ props.transition }\n                  { ...props.menuProps }\n                >\n                  <VList\n                    selected={ selected.value }\n                    selectStrategy={ props.multiple ? 'independent' : 'single-independent' }\n                    onMousedown={ (e: MouseEvent) => e.preventDefault() }\n                  >\n                    { !items.value.length && !props.hideNoData && (slots['no-data']?.() ?? (\n                      <VListItem title={ t(props.noDataText) } />\n                    )) }\n\n                    { slots['prepend-item']?.() }\n\n                    { items.value.map((item, index) => slots.item?.({\n                      item,\n                      index,\n                      props: mergeProps(item.props, { onClick: () => select(item) }),\n                    }) ?? (\n                      <VListItem\n                        key={ index }\n                        { ...item.props }\n                        onClick={ () => select(item) }\n                      >\n                        {{\n                          prepend: ({ isSelected }) => props.multiple && !props.hideSelected ? (\n                            <VCheckboxBtn modelValue={ isSelected } ripple={ false } />\n                          ) : undefined,\n                        }}\n                      </VListItem>\n                    )) }\n\n                    { slots['append-item']?.() }\n                  </VList>\n                </VMenu>\n\n                { selections.value.map((item, index) => {\n                  function onChipClose (e: Event) {\n                    e.stopPropagation()\n                    e.preventDefault()\n\n                    select(item)\n                  }\n\n                  const slotProps = {\n                    'onClick:close': onChipClose,\n                    modelValue: true,\n                  }\n\n                  return (\n                    <div key={ index } class=\"v-select__selection\">\n                      { hasChips ? (\n                        <VDefaultsProvider\n                          defaults={{\n                            VChip: {\n                              closable: props.closableChips,\n                              size: 'small',\n                              text: item.title,\n                            },\n                          }}\n                        >\n                          { slots.chip\n                            ? slots.chip({ item, index, props: slotProps })\n                            : (<VChip { ...slotProps } />)\n                          }\n                        </VDefaultsProvider>\n                      ) : (\n                        slots.selection\n                          ? slots.selection({ item, index })\n                          : (\n                            <span class=\"v-select__selection-text\">\n                              { item.title }\n                              { props.multiple && (index < selections.value.length - 1) && (\n                                <span class=\"v-select__selection-comma\">,</span>\n                              ) }\n                            </span>\n                          )\n                      )}\n                    </div>\n                  )\n                }) }\n              </>\n            ),\n          }}\n        </VTextField>\n      )\n    })\n\n    return forwardRefs({\n      menu,\n      select,\n    }, vTextFieldRef)\n  },\n})\n\nexport type VSelect = InstanceType<typeof VSelect>\n"],"mappings":"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"}

package/lib/components/VSelect/VSelect.sass

@@ -18,6 +18,7 @@
         align-self: flex-start
         opacity: 0
         flex: 0 0
+        position: absolute
 
     .v-field__append-inner
       > .v-icon
@@ -28,6 +29,12 @@
     .v-select__selection
       margin-inline-end: 2px
 
+  .v-field--single-line
+    .v-select__selection-text
+      overflow: hidden
+      text-overflow: ellipsis
+      white-space: nowrap
+
   &__content
     overflow: hidden
 
@@ -38,6 +45,7 @@
     display: inline-flex
     letter-spacing: inherit
     line-height: inherit
+    max-width: 100%
 
   &--active-menu
     .v-field__append-inner
@@ -47,5 +55,7 @@
 
   &--chips
     .v-select__selection
+      margin-top: $select-chips-margin-top
+
       &:first-child
         margin-inline-start: 0

package/lib/components/VSelect/_variables.scss

@@ -6,3 +6,4 @@ $select-content-elevation: 4 !default;
 $select-line-height: 1.75 !default;
 $select-transition: .2s settings.$standard-easing !default;
 $select-chips-control-min-height: 64px !default;
+$select-chips-margin-top: 2px !default;

package/lib/components/VSelectionControl/VSelectionControl.mjs

@@ -1,4 +1,4 @@
-import { resolveDirective as _resolveDirective, withDirectives as _withDirectives, mergeProps as _mergeProps, vModelDynamic as _vModelDynamic, createVNode as _createVNode } from "vue";
+import { withDirectives as _withDirectives, resolveDirective as _resolveDirective, mergeProps as _mergeProps, createVNode as _createVNode } from "vue";
 // Styles
 import "./VSelectionControl.css"; // Components
 
@@ -146,6 +146,10 @@ export const VSelectionControl = genericComponent()({
       isFocusVisible.value = false;
     }
 
+    function onInput(e) {
+      model.value = e.target.checked;
+    }
+
     useRender(() => {
       var _group$type$value, _slots$default, _group$name$value, _slots$input;
 
@@ -174,19 +178,20 @@ export const VSelectionControl = genericComponent()({
       }, [icon.value && _createVNode(VIcon, {
         "key": "icon",
         "icon": icon.value
-      }, null), _withDirectives(_createVNode("input", _mergeProps({
-        "onUpdate:modelValue": $event => model.value = $event,
+      }, null), _createVNode("input", _mergeProps({
         "ref": input,
+        "checked": model.value,
         "disabled": props.disabled,
         "id": id.value,
         "onBlur": onBlur,
         "onFocus": onFocus,
+        "onInput": onInput,
         "aria-readonly": props.readonly,
         "type": type,
         "value": trueValue.value,
         "name": (_group$name$value = group == null ? void 0 : group.name.value) != null ? _group$name$value : props.name,
         "aria-checked": type === 'checkbox' ? model.value : undefined
-      }, inputAttrs), null), [[_vModelDynamic, model.value]]), (_slots$input = slots.input) == null ? void 0 : _slots$input.call(slots, {
+      }, inputAttrs), null), (_slots$input = slots.input) == null ? void 0 : _slots$input.call(slots, {
         model,
         textColorClasses,
         props: {

package/lib/components/VSelectionControl/VSelectionControl.mjs.map

@@ -1 +1 @@
-{"version":3,"file":"VSelectionControl.mjs","names":["VIcon","VLabel","VSelectionControlGroupSymbol","Ripple","IconValue","makeDensityProps","useDensity","makeThemeProps","useProxiedModel","useTextColor","computed","inject","ref","deepEqual","filterInputAttrs","genericComponent","getUid","pick","propsFactory","SUPPORTS_FOCUS_VISIBLE","useRender","wrapInArray","makeSelectionControlProps","color","String","disabled","Boolean","error","id","inline","label","falseIcon","trueIcon","ripple","type","default","multiple","name","readonly","trueValue","falseValue","modelValue","value","valueComparator","Function","useSelectionControl","props","group","undefined","densityClasses","isMultiple","Array","isArray","model","get","val","some","v","set","currentValue","newVal","filter","item","textColorClasses","textColorStyles","icon","VSelectionControl","directives","inheritAttrs","emits","setup","attrs","slots","uid","isFocused","isFocusVisible","input","onFocus","e","target","matches","onBlur","for","rootAttrs","inputAttrs","filterControlProps","Object","keys"],"sources":["../../../src/components/VSelectionControl/VSelectionControl.tsx"],"sourcesContent":["// Styles\nimport './VSelectionControl.sass'\n\n// Components\nimport { VIcon } from '@/components/VIcon'\nimport { VLabel } from '@/components/VLabel'\nimport { VSelectionControlGroupSymbol } from '@/components/VSelectionControlGroup/VSelectionControlGroup'\n\n// Directives\nimport { Ripple } from '@/directives/ripple'\n\n// Composables\nimport { IconValue } from '@/composables/icons'\nimport { makeDensityProps, useDensity } from '@/composables/density'\nimport { makeThemeProps } from '@/composables/theme'\nimport { useProxiedModel } from '@/composables/proxiedModel'\nimport { useTextColor } from '@/composables/color'\n\n// Utilities\nimport { computed, inject, ref } from 'vue'\nimport {\n  deepEqual,\n  filterInputAttrs,\n  genericComponent,\n  getUid,\n  pick,\n  propsFactory,\n  SUPPORTS_FOCUS_VISIBLE,\n  useRender,\n  wrapInArray,\n} from '@/util'\n\n// Types\nimport type { ComputedRef, ExtractPropTypes, PropType, Ref, WritableComputedRef } from 'vue'\nimport type { MakeSlots } from '@/util'\n\nexport type SelectionControlSlot = {\n  model: WritableComputedRef<any>\n  isReadonly: ComputedRef<boolean>\n  isDisabled: ComputedRef<boolean>\n  textColorClasses: Ref<string[]>\n  props: {\n    onBlur: (e: Event) => void\n    onFocus: (e: FocusEvent) => void\n    id: string\n  }\n}\n\nexport const makeSelectionControlProps = propsFactory({\n  color: String,\n  disabled: Boolean,\n  error: Boolean,\n  id: String,\n  inline: Boolean,\n  label: String,\n  falseIcon: IconValue,\n  trueIcon: IconValue,\n  ripple: {\n    type: Boolean,\n    default: true,\n  },\n  multiple: {\n    type: Boolean as PropType<boolean | null>,\n    default: null,\n  },\n  name: String,\n  readonly: Boolean,\n  trueValue: null,\n  falseValue: null,\n  modelValue: null,\n  type: String,\n  value: null,\n  valueComparator: {\n    type: Function as PropType<typeof deepEqual>,\n    default: deepEqual,\n  },\n\n  ...makeThemeProps(),\n  ...makeDensityProps(),\n})\n\nexport function useSelectionControl (\n  props: ExtractPropTypes<ReturnType<typeof makeSelectionControlProps>> & {\n    'onUpdate:modelValue': ((val: any) => void) | undefined\n  }\n) {\n  const group = inject(VSelectionControlGroupSymbol, undefined)\n  const { densityClasses } = useDensity(props)\n  const modelValue = useProxiedModel(props, 'modelValue')\n  const trueValue = computed(() => (\n    props.trueValue !== undefined ? props.trueValue\n    : props.value !== undefined ? props.value\n    : true\n  ))\n  const falseValue = computed(() => props.falseValue !== undefined ? props.falseValue : false)\n  const isMultiple = computed(() => (\n    group?.multiple.value ||\n    !!props.multiple ||\n    (props.multiple == null && Array.isArray(modelValue.value))\n  ))\n  const model = computed({\n    get () {\n      const val = group ? group.modelValue.value : modelValue.value\n\n      return isMultiple.value\n        ? val.some((v: any) => props.valueComparator(v, trueValue.value))\n        : props.valueComparator(val, trueValue.value)\n    },\n    set (val: boolean) {\n      if (props.readonly) return\n\n      const currentValue = val ? trueValue.value : falseValue.value\n\n      let newVal = currentValue\n\n      if (isMultiple.value) {\n        newVal = val\n          ? [...wrapInArray(modelValue.value), currentValue]\n          : wrapInArray(modelValue.value).filter((item: any) => !props.valueComparator(item, trueValue.value))\n      }\n\n      if (group) {\n        group.modelValue.value = newVal\n      } else {\n        modelValue.value = newVal\n      }\n    },\n  })\n  const { textColorClasses, textColorStyles } = useTextColor(computed(() => {\n    return (\n      model.value &&\n      !props.error &&\n      !props.disabled\n    ) ? props.color : undefined\n  }))\n  const icon = computed(() => {\n    return model.value\n      ? group?.trueIcon.value ?? props.trueIcon\n      : group?.falseIcon.value ?? props.falseIcon\n  })\n\n  return {\n    group,\n    densityClasses,\n    trueValue,\n    falseValue,\n    model,\n    textColorClasses,\n    textColorStyles,\n    icon,\n  }\n}\n\nexport const VSelectionControl = genericComponent<new <T>() => {\n  $props: {\n    modelValue?: T\n    'onUpdate:modelValue'?: (val: T) => any\n  }\n  $slots: MakeSlots<{\n    default: []\n    input: [SelectionControlSlot]\n  }>\n}>()({\n  name: 'VSelectionControl',\n\n  directives: { Ripple },\n\n  inheritAttrs: false,\n\n  props: makeSelectionControlProps(),\n\n  emits: {\n    'update:modelValue': (val: any) => true,\n  },\n\n  setup (props, { attrs, slots }) {\n    const {\n      densityClasses,\n      group,\n      icon,\n      model,\n      textColorClasses,\n      textColorStyles,\n      trueValue,\n    } = useSelectionControl(props)\n    const uid = getUid()\n    const id = computed(() => props.id || `input-${uid}`)\n    const isFocused = ref(false)\n    const isFocusVisible = ref(false)\n    const input = ref<HTMLInputElement>()\n\n    function onFocus (e: FocusEvent) {\n      isFocused.value = true\n      if (\n        !SUPPORTS_FOCUS_VISIBLE ||\n        (SUPPORTS_FOCUS_VISIBLE && (e.target as HTMLElement).matches(':focus-visible'))\n      ) {\n        isFocusVisible.value = true\n      }\n    }\n\n    function onBlur () {\n      isFocused.value = false\n      isFocusVisible.value = false\n    }\n\n    useRender(() => {\n      const label = slots.label\n        ? slots.label({\n          label: props.label,\n          props: { for: id.value },\n        })\n        : props.label\n      const type = group?.type.value ?? props.type\n      const [rootAttrs, inputAttrs] = filterInputAttrs(attrs)\n\n      return (\n        <div\n          class={[\n            'v-selection-control',\n            {\n              'v-selection-control--dirty': model.value,\n              'v-selection-control--disabled': props.disabled,\n              'v-selection-control--error': props.error,\n              'v-selection-control--focused': isFocused.value,\n              'v-selection-control--focus-visible': isFocusVisible.value,\n              'v-selection-control--inline': group?.inline.value || props.inline,\n            },\n            densityClasses.value,\n          ]}\n          { ...rootAttrs }\n        >\n          <div\n            class={[\n              'v-selection-control__wrapper',\n              textColorClasses.value,\n            ]}\n            style={ textColorStyles.value }\n          >\n            { slots.default?.() }\n\n            <div\n              class={[\n                'v-selection-control__input',\n              ]}\n              v-ripple={ props.ripple && [\n                !props.disabled && !props.readonly,\n                null,\n                ['center', 'circle'],\n              ]}\n            >\n              { icon.value && <VIcon key=\"icon\" icon={ icon.value } /> }\n\n              <input\n                v-model={ model.value }\n                ref={ input }\n                disabled={ props.disabled }\n                id={ id.value }\n                onBlur={ onBlur }\n                onFocus={ onFocus }\n                aria-readonly={ props.readonly }\n                type={ type }\n                value={ trueValue.value }\n                name={ group?.name.value ?? props.name }\n                aria-checked={ type === 'checkbox' ? model.value : undefined }\n                { ...inputAttrs }\n              />\n\n              { slots.input?.({\n                model,\n                textColorClasses,\n                props: {\n                  onFocus,\n                  onBlur,\n                  id: id.value,\n                },\n              }) }\n            </div>\n          </div>\n\n          { label && (\n            <VLabel for={ id.value }>\n              { label }\n            </VLabel>\n          ) }\n        </div>\n      )\n    })\n\n    return {\n      isFocused,\n      input,\n    }\n  },\n})\n\nexport type VSelectionControl = InstanceType<typeof VSelectionControl>\n\nexport function filterControlProps (props: ExtractPropTypes<ReturnType<typeof makeSelectionControlProps>>) {\n  return pick(props, Object.keys(VSelectionControl.props) as any)\n}\n"],"mappings":";AAAA;AACA,iC,CAEA;;SACSA,K;SACAC,M;SACAC,4B,gEAET;;SACSC,M,6CAET;;SACSC,S;SACAC,gB,EAAkBC,U;SAClBC,c;SACAC,e;SACAC,Y,uCAET;;AACA,SAASC,QAAT,EAAmBC,MAAnB,EAA2BC,GAA3B,QAAsC,KAAtC;SAEEC,S,EACAC,gB,EACAC,gB,EACAC,M,EACAC,I,EACAC,Y,EACAC,sB,EACAC,S,EACAC,W,gCAGF;;AAgBA,OAAO,MAAMC,yBAAyB,GAAGJ,YAAY,CAAC;EACpDK,KAAK,EAAEC,MAD6C;EAEpDC,QAAQ,EAAEC,OAF0C;EAGpDC,KAAK,EAAED,OAH6C;EAIpDE,EAAE,EAAEJ,MAJgD;EAKpDK,MAAM,EAAEH,OAL4C;EAMpDI,KAAK,EAAEN,MAN6C;EAOpDO,SAAS,EAAE3B,SAPyC;EAQpD4B,QAAQ,EAAE5B,SAR0C;EASpD6B,MAAM,EAAE;IACNC,IAAI,EAAER,OADA;IAENS,OAAO,EAAE;EAFH,CAT4C;EAapDC,QAAQ,EAAE;IACRF,IAAI,EAAER,OADE;IAERS,OAAO,EAAE;EAFD,CAb0C;EAiBpDE,IAAI,EAAEb,MAjB8C;EAkBpDc,QAAQ,EAAEZ,OAlB0C;EAmBpDa,SAAS,EAAE,IAnByC;EAoBpDC,UAAU,EAAE,IApBwC;EAqBpDC,UAAU,EAAE,IArBwC;EAsBpDP,IAAI,EAAEV,MAtB8C;EAuBpDkB,KAAK,EAAE,IAvB6C;EAwBpDC,eAAe,EAAE;IACfT,IAAI,EAAEU,QADS;IAEfT,OAAO,EAAEtB;EAFM,CAxBmC;EA6BpD,GAAGN,cAAc,EA7BmC;EA8BpD,GAAGF,gBAAgB;AA9BiC,CAAD,CAA9C;AAiCP,OAAO,SAASwC,mBAAT,CACLC,KADK,EAIL;EACA,MAAMC,KAAK,GAAGpC,MAAM,CAACT,4BAAD,EAA+B8C,SAA/B,CAApB;EACA,MAAM;IAAEC;EAAF,IAAqB3C,UAAU,CAACwC,KAAD,CAArC;EACA,MAAML,UAAU,GAAGjC,eAAe,CAACsC,KAAD,EAAQ,YAAR,CAAlC;EACA,MAAMP,SAAS,GAAG7B,QAAQ,CAAC,MACzBoC,KAAK,CAACP,SAAN,KAAoBS,SAApB,GAAgCF,KAAK,CAACP,SAAtC,GACEO,KAAK,CAACJ,KAAN,KAAgBM,SAAhB,GAA4BF,KAAK,CAACJ,KAAlC,GACA,IAHsB,CAA1B;EAKA,MAAMF,UAAU,GAAG9B,QAAQ,CAAC,MAAMoC,KAAK,CAACN,UAAN,KAAqBQ,SAArB,GAAiCF,KAAK,CAACN,UAAvC,GAAoD,KAA3D,CAA3B;EACA,MAAMU,UAAU,GAAGxC,QAAQ,CAAC,MAC1B,CAAAqC,KAAK,QAAL,YAAAA,KAAK,CAAEX,QAAP,CAAgBM,KAAhB,KACA,CAAC,CAACI,KAAK,CAACV,QADR,IAECU,KAAK,CAACV,QAAN,IAAkB,IAAlB,IAA0Be,KAAK,CAACC,OAAN,CAAcX,UAAU,CAACC,KAAzB,CAHF,CAA3B;EAKA,MAAMW,KAAK,GAAG3C,QAAQ,CAAC;IACrB4C,GAAG,GAAI;MACL,MAAMC,GAAG,GAAGR,KAAK,GAAGA,KAAK,CAACN,UAAN,CAAiBC,KAApB,GAA4BD,UAAU,CAACC,KAAxD;MAEA,OAAOQ,UAAU,CAACR,KAAX,GACHa,GAAG,CAACC,IAAJ,CAAUC,CAAD,IAAYX,KAAK,CAACH,eAAN,CAAsBc,CAAtB,EAAyBlB,SAAS,CAACG,KAAnC,CAArB,CADG,GAEHI,KAAK,CAACH,eAAN,CAAsBY,GAAtB,EAA2BhB,SAAS,CAACG,KAArC,CAFJ;IAGD,CAPoB;;IAQrBgB,GAAG,CAAEH,GAAF,EAAgB;MACjB,IAAIT,KAAK,CAACR,QAAV,EAAoB;MAEpB,MAAMqB,YAAY,GAAGJ,GAAG,GAAGhB,SAAS,CAACG,KAAb,GAAqBF,UAAU,CAACE,KAAxD;MAEA,IAAIkB,MAAM,GAAGD,YAAb;;MAEA,IAAIT,UAAU,CAACR,KAAf,EAAsB;QACpBkB,MAAM,GAAGL,GAAG,GACR,CAAC,GAAGlC,WAAW,CAACoB,UAAU,CAACC,KAAZ,CAAf,EAAmCiB,YAAnC,CADQ,GAERtC,WAAW,CAACoB,UAAU,CAACC,KAAZ,CAAX,CAA8BmB,MAA9B,CAAsCC,IAAD,IAAe,CAAChB,KAAK,CAACH,eAAN,CAAsBmB,IAAtB,EAA4BvB,SAAS,CAACG,KAAtC,CAArD,CAFJ;MAGD;;MAED,IAAIK,KAAJ,EAAW;QACTA,KAAK,CAACN,UAAN,CAAiBC,KAAjB,GAAyBkB,MAAzB;MACD,CAFD,MAEO;QACLnB,UAAU,CAACC,KAAX,GAAmBkB,MAAnB;MACD;IACF;;EA1BoB,CAAD,CAAtB;EA4BA,MAAM;IAAEG,gBAAF;IAAoBC;EAApB,IAAwCvD,YAAY,CAACC,QAAQ,CAAC,MAAM;IACxE,OACE2C,KAAK,CAACX,KAAN,IACA,CAACI,KAAK,CAACnB,KADP,IAEA,CAACmB,KAAK,CAACrB,QAHF,GAIHqB,KAAK,CAACvB,KAJH,GAIWyB,SAJlB;EAKD,CANkE,CAAT,CAA1D;EAOA,MAAMiB,IAAI,GAAGvD,QAAQ,CAAC,MAAM;IAAA;;IAC1B,OAAO2C,KAAK,CAACX,KAAN,4BACHK,KADG,oBACHA,KAAK,CAAEf,QAAP,CAAgBU,KADb,oCACsBI,KAAK,CAACd,QAD5B,4BAEHe,KAFG,oBAEHA,KAAK,CAAEhB,SAAP,CAAiBW,KAFd,oCAEuBI,KAAK,CAACf,SAFpC;EAGD,CAJoB,CAArB;EAMA,OAAO;IACLgB,KADK;IAELE,cAFK;IAGLV,SAHK;IAILC,UAJK;IAKLa,KALK;IAMLU,gBANK;IAOLC,eAPK;IAQLC;EARK,CAAP;AAUD;AAED,OAAO,MAAMC,iBAAiB,GAAGnD,gBAAgB,GAS5C;EACHsB,IAAI,EAAE,mBADH;EAGH8B,UAAU,EAAE;IAAEhE;EAAF,CAHT;EAKHiE,YAAY,EAAE,KALX;EAOHtB,KAAK,EAAExB,yBAAyB,EAP7B;EASH+C,KAAK,EAAE;IACL,qBAAsBd,GAAD,IAAc;EAD9B,CATJ;;EAaHe,KAAK,CAAExB,KAAF,QAA2B;IAAA,IAAlB;MAAEyB,KAAF;MAASC;IAAT,CAAkB;IAC9B,MAAM;MACJvB,cADI;MAEJF,KAFI;MAGJkB,IAHI;MAIJZ,KAJI;MAKJU,gBALI;MAMJC,eANI;MAOJzB;IAPI,IAQFM,mBAAmB,CAACC,KAAD,CARvB;IASA,MAAM2B,GAAG,GAAGzD,MAAM,EAAlB;IACA,MAAMY,EAAE,GAAGlB,QAAQ,CAAC,MAAMoC,KAAK,CAAClB,EAAN,IAAa,SAAQ6C,GAAI,EAAhC,CAAnB;IACA,MAAMC,SAAS,GAAG9D,GAAG,CAAC,KAAD,CAArB;IACA,MAAM+D,cAAc,GAAG/D,GAAG,CAAC,KAAD,CAA1B;IACA,MAAMgE,KAAK,GAAGhE,GAAG,EAAjB;;IAEA,SAASiE,OAAT,CAAkBC,CAAlB,EAAiC;MAC/BJ,SAAS,CAAChC,KAAV,GAAkB,IAAlB;;MACA,IACE,CAACvB,sBAAD,IACCA,sBAAsB,IAAK2D,CAAC,CAACC,MAAH,CAA0BC,OAA1B,CAAkC,gBAAlC,CAF7B,EAGE;QACAL,cAAc,CAACjC,KAAf,GAAuB,IAAvB;MACD;IACF;;IAED,SAASuC,MAAT,GAAmB;MACjBP,SAAS,CAAChC,KAAV,GAAkB,KAAlB;MACAiC,cAAc,CAACjC,KAAf,GAAuB,KAAvB;IACD;;IAEDtB,SAAS,CAAC,MAAM;MAAA;;MACd,MAAMU,KAAK,GAAG0C,KAAK,CAAC1C,KAAN,GACV0C,KAAK,CAAC1C,KAAN,CAAY;QACZA,KAAK,EAAEgB,KAAK,CAAChB,KADD;QAEZgB,KAAK,EAAE;UAAEoC,GAAG,EAAEtD,EAAE,CAACc;QAAV;MAFK,CAAZ,CADU,GAKVI,KAAK,CAAChB,KALV;MAMA,MAAMI,IAAI,wBAAGa,KAAH,oBAAGA,KAAK,CAAEb,IAAP,CAAYQ,KAAf,gCAAwBI,KAAK,CAACZ,IAAxC;MACA,MAAM,CAACiD,SAAD,EAAYC,UAAZ,IAA0BtE,gBAAgB,CAACyD,KAAD,CAAhD;MAEA;QAAA,SAEW,CACL,qBADK,EAEL;UACE,8BAA8BlB,KAAK,CAACX,KADtC;UAEE,iCAAiCI,KAAK,CAACrB,QAFzC;UAGE,8BAA8BqB,KAAK,CAACnB,KAHtC;UAIE,gCAAgC+C,SAAS,CAAChC,KAJ5C;UAKE,sCAAsCiC,cAAc,CAACjC,KALvD;UAME,+BAA+B,CAAAK,KAAK,QAAL,YAAAA,KAAK,CAAElB,MAAP,CAAca,KAAd,KAAuBI,KAAK,CAACjB;QAN9D,CAFK,EAULoB,cAAc,CAACP,KAVV;MAFX,GAcSyC,SAdT;QAAA,SAiBa,CACL,8BADK,EAELpB,gBAAgB,CAACrB,KAFZ,CAjBb;QAAA,SAqBcsB,eAAe,CAACtB;MArB9B,sBAuBQ8B,KAAK,CAACrC,OAvBd,qBAuBQ,oBAAAqC,KAAK,CAvBb;QAAA,SA0Be,CACL,4BADK;MA1Bf,IAmCUP,IAAI,CAACvB,KAAL;QAAA,OAAyB,MAAzB;QAAA,QAAuCuB,IAAI,CAACvB;MAA5C,QAnCV;QAAA,iCAsCoBW,KAAK,CAACX,KAtC1B;QAAA,OAuCgBkC,KAvChB;QAAA,YAwCqB9B,KAAK,CAACrB,QAxC3B;QAAA,MAyCeG,EAAE,CAACc,KAzClB;QAAA,UA0CmBuC,MA1CnB;QAAA,WA2CoBJ,OA3CpB;QAAA,iBA4C0B/B,KAAK,CAACR,QA5ChC;QAAA,QA6CiBJ,IA7CjB;QAAA,SA8CkBK,SAAS,CAACG,KA9C5B;QAAA,6BA+CiBK,KA/CjB,oBA+CiBA,KAAK,CAAEV,IAAP,CAAYK,KA/C7B,gCA+CsCI,KAAK,CAACT,IA/C5C;QAAA,gBAgDyBH,IAAI,KAAK,UAAT,GAAsBmB,KAAK,CAACX,KAA5B,GAAoCM;MAhD7D,GAiDeoC,UAjDf,4BAsCoB/B,KAAK,CAACX,KAtC1B,qBAoDU8B,KAAK,CAACI,KApDhB,qBAoDU,kBAAAJ,KAAK,EAAS;QACdnB,KADc;QAEdU,gBAFc;QAGdjB,KAAK,EAAE;UACL+B,OADK;UAELI,MAFK;UAGLrD,EAAE,EAAEA,EAAE,CAACc;QAHF;MAHO,CAAT,CApDf,mCA6BmBI,KAAK,CAACb,MAAN,IAAgB,CACzB,CAACa,KAAK,CAACrB,QAAP,IAAmB,CAACqB,KAAK,CAACR,QADD,EAEzB,IAFyB,EAGzB,CAAC,QAAD,EAAW,QAAX,CAHyB,CA7BnC,OAgEMR,KAAK;QAAA,OACSF,EAAE,CAACc;MADZ;QAAA,gBAEDZ,KAFC;MAAA,EAhEX;IAuED,CAjFQ,CAAT;IAmFA,OAAO;MACL4C,SADK;MAELE;IAFK,CAAP;EAID;;AAnIE,CAT4C,CAA1C;AAiJP,OAAO,SAASS,kBAAT,CAA6BvC,KAA7B,EAAoG;EACzG,OAAO7B,IAAI,CAAC6B,KAAD,EAAQwC,MAAM,CAACC,IAAP,CAAYrB,iBAAiB,CAACpB,KAA9B,CAAR,CAAX;AACD"}
+{"version":3,"file":"VSelectionControl.mjs","names":["VIcon","VLabel","VSelectionControlGroupSymbol","Ripple","IconValue","makeDensityProps","useDensity","makeThemeProps","useProxiedModel","useTextColor","computed","inject","ref","deepEqual","filterInputAttrs","genericComponent","getUid","pick","propsFactory","SUPPORTS_FOCUS_VISIBLE","useRender","wrapInArray","makeSelectionControlProps","color","String","disabled","Boolean","error","id","inline","label","falseIcon","trueIcon","ripple","type","default","multiple","name","readonly","trueValue","falseValue","modelValue","value","valueComparator","Function","useSelectionControl","props","group","undefined","densityClasses","isMultiple","Array","isArray","model","get","val","some","v","set","currentValue","newVal","filter","item","textColorClasses","textColorStyles","icon","VSelectionControl","directives","inheritAttrs","emits","setup","attrs","slots","uid","isFocused","isFocusVisible","input","onFocus","e","target","matches","onBlur","onInput","checked","for","rootAttrs","inputAttrs","filterControlProps","Object","keys"],"sources":["../../../src/components/VSelectionControl/VSelectionControl.tsx"],"sourcesContent":["// Styles\nimport './VSelectionControl.sass'\n\n// Components\nimport { VIcon } from '@/components/VIcon'\nimport { VLabel } from '@/components/VLabel'\nimport { VSelectionControlGroupSymbol } from '@/components/VSelectionControlGroup/VSelectionControlGroup'\n\n// Directives\nimport { Ripple } from '@/directives/ripple'\n\n// Composables\nimport { IconValue } from '@/composables/icons'\nimport { makeDensityProps, useDensity } from '@/composables/density'\nimport { makeThemeProps } from '@/composables/theme'\nimport { useProxiedModel } from '@/composables/proxiedModel'\nimport { useTextColor } from '@/composables/color'\n\n// Utilities\nimport { computed, inject, ref } from 'vue'\nimport {\n  deepEqual,\n  filterInputAttrs,\n  genericComponent,\n  getUid,\n  pick,\n  propsFactory,\n  SUPPORTS_FOCUS_VISIBLE,\n  useRender,\n  wrapInArray,\n} from '@/util'\n\n// Types\nimport type { ComputedRef, ExtractPropTypes, PropType, Ref, WritableComputedRef } from 'vue'\nimport type { MakeSlots } from '@/util'\n\nexport type SelectionControlSlot = {\n  model: WritableComputedRef<any>\n  isReadonly: ComputedRef<boolean>\n  isDisabled: ComputedRef<boolean>\n  textColorClasses: Ref<string[]>\n  props: {\n    onBlur: (e: Event) => void\n    onFocus: (e: FocusEvent) => void\n    id: string\n  }\n}\n\nexport const makeSelectionControlProps = propsFactory({\n  color: String,\n  disabled: Boolean,\n  error: Boolean,\n  id: String,\n  inline: Boolean,\n  label: String,\n  falseIcon: IconValue,\n  trueIcon: IconValue,\n  ripple: {\n    type: Boolean,\n    default: true,\n  },\n  multiple: {\n    type: Boolean as PropType<boolean | null>,\n    default: null,\n  },\n  name: String,\n  readonly: Boolean,\n  trueValue: null,\n  falseValue: null,\n  modelValue: null,\n  type: String,\n  value: null,\n  valueComparator: {\n    type: Function as PropType<typeof deepEqual>,\n    default: deepEqual,\n  },\n\n  ...makeThemeProps(),\n  ...makeDensityProps(),\n})\n\nexport function useSelectionControl (\n  props: ExtractPropTypes<ReturnType<typeof makeSelectionControlProps>> & {\n    'onUpdate:modelValue': ((val: any) => void) | undefined\n  }\n) {\n  const group = inject(VSelectionControlGroupSymbol, undefined)\n  const { densityClasses } = useDensity(props)\n  const modelValue = useProxiedModel(props, 'modelValue')\n  const trueValue = computed(() => (\n    props.trueValue !== undefined ? props.trueValue\n    : props.value !== undefined ? props.value\n    : true\n  ))\n  const falseValue = computed(() => props.falseValue !== undefined ? props.falseValue : false)\n  const isMultiple = computed(() => (\n    group?.multiple.value ||\n    !!props.multiple ||\n    (props.multiple == null && Array.isArray(modelValue.value))\n  ))\n  const model = computed({\n    get () {\n      const val = group ? group.modelValue.value : modelValue.value\n\n      return isMultiple.value\n        ? val.some((v: any) => props.valueComparator(v, trueValue.value))\n        : props.valueComparator(val, trueValue.value)\n    },\n    set (val: boolean) {\n      if (props.readonly) return\n\n      const currentValue = val ? trueValue.value : falseValue.value\n\n      let newVal = currentValue\n\n      if (isMultiple.value) {\n        newVal = val\n          ? [...wrapInArray(modelValue.value), currentValue]\n          : wrapInArray(modelValue.value).filter((item: any) => !props.valueComparator(item, trueValue.value))\n      }\n\n      if (group) {\n        group.modelValue.value = newVal\n      } else {\n        modelValue.value = newVal\n      }\n    },\n  })\n  const { textColorClasses, textColorStyles } = useTextColor(computed(() => {\n    return (\n      model.value &&\n      !props.error &&\n      !props.disabled\n    ) ? props.color : undefined\n  }))\n  const icon = computed(() => {\n    return model.value\n      ? group?.trueIcon.value ?? props.trueIcon\n      : group?.falseIcon.value ?? props.falseIcon\n  })\n\n  return {\n    group,\n    densityClasses,\n    trueValue,\n    falseValue,\n    model,\n    textColorClasses,\n    textColorStyles,\n    icon,\n  }\n}\n\nexport const VSelectionControl = genericComponent<new <T>() => {\n  $props: {\n    modelValue?: T\n    'onUpdate:modelValue'?: (val: T) => any\n  }\n  $slots: MakeSlots<{\n    default: []\n    input: [SelectionControlSlot]\n  }>\n}>()({\n  name: 'VSelectionControl',\n\n  directives: { Ripple },\n\n  inheritAttrs: false,\n\n  props: makeSelectionControlProps(),\n\n  emits: {\n    'update:modelValue': (val: any) => true,\n  },\n\n  setup (props, { attrs, slots }) {\n    const {\n      densityClasses,\n      group,\n      icon,\n      model,\n      textColorClasses,\n      textColorStyles,\n      trueValue,\n    } = useSelectionControl(props)\n    const uid = getUid()\n    const id = computed(() => props.id || `input-${uid}`)\n    const isFocused = ref(false)\n    const isFocusVisible = ref(false)\n    const input = ref<HTMLInputElement>()\n\n    function onFocus (e: FocusEvent) {\n      isFocused.value = true\n      if (\n        !SUPPORTS_FOCUS_VISIBLE ||\n        (SUPPORTS_FOCUS_VISIBLE && (e.target as HTMLElement).matches(':focus-visible'))\n      ) {\n        isFocusVisible.value = true\n      }\n    }\n\n    function onBlur () {\n      isFocused.value = false\n      isFocusVisible.value = false\n    }\n\n    function onInput (e: Event) {\n      model.value = (e.target as HTMLInputElement).checked\n    }\n\n    useRender(() => {\n      const label = slots.label\n        ? slots.label({\n          label: props.label,\n          props: { for: id.value },\n        })\n        : props.label\n      const type = group?.type.value ?? props.type\n      const [rootAttrs, inputAttrs] = filterInputAttrs(attrs)\n\n      return (\n        <div\n          class={[\n            'v-selection-control',\n            {\n              'v-selection-control--dirty': model.value,\n              'v-selection-control--disabled': props.disabled,\n              'v-selection-control--error': props.error,\n              'v-selection-control--focused': isFocused.value,\n              'v-selection-control--focus-visible': isFocusVisible.value,\n              'v-selection-control--inline': group?.inline.value || props.inline,\n            },\n            densityClasses.value,\n          ]}\n          { ...rootAttrs }\n        >\n          <div\n            class={[\n              'v-selection-control__wrapper',\n              textColorClasses.value,\n            ]}\n            style={ textColorStyles.value }\n          >\n            { slots.default?.() }\n\n            <div\n              class={[\n                'v-selection-control__input',\n              ]}\n              v-ripple={ props.ripple && [\n                !props.disabled && !props.readonly,\n                null,\n                ['center', 'circle'],\n              ]}\n            >\n              { icon.value && <VIcon key=\"icon\" icon={ icon.value } /> }\n\n              <input\n                ref={ input }\n                checked={ model.value }\n                disabled={ props.disabled }\n                id={ id.value }\n                onBlur={ onBlur }\n                onFocus={ onFocus }\n                onInput={ onInput }\n                aria-readonly={ props.readonly }\n                type={ type }\n                value={ trueValue.value }\n                name={ group?.name.value ?? props.name }\n                aria-checked={ type === 'checkbox' ? model.value : undefined }\n                { ...inputAttrs }\n              />\n\n              { slots.input?.({\n                model,\n                textColorClasses,\n                props: {\n                  onFocus,\n                  onBlur,\n                  id: id.value,\n                },\n              }) }\n            </div>\n          </div>\n\n          { label && (\n            <VLabel for={ id.value }>\n              { label }\n            </VLabel>\n          ) }\n        </div>\n      )\n    })\n\n    return {\n      isFocused,\n      input,\n    }\n  },\n})\n\nexport type VSelectionControl = InstanceType<typeof VSelectionControl>\n\nexport function filterControlProps (props: ExtractPropTypes<ReturnType<typeof makeSelectionControlProps>>) {\n  return pick(props, Object.keys(VSelectionControl.props) as any)\n}\n"],"mappings":"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"}

package/lib/components/VSnackbar/VSnackbar.css

@@ -36,7 +36,7 @@
   display: none;
 }
 .v-snackbar--variant-elevated, .v-snackbar--variant-flat {
-  background: #333333;
+  background: rgb(var(--v-theme-surface-variant));
   color: rgb(var(--v-theme-on-surface-variant));
 }
 .v-snackbar--variant-elevated {

package/lib/components/VSnackbar/VSnackbar.mjs

@@ -12,14 +12,13 @@ import { makeRoundedProps, useRounded } from "../../composables/rounded.mjs";
 import { makeTransitionProps } from "../../composables/transition.mjs";
 import { useProxiedModel } from "../../composables/proxiedModel.mjs";
 import { useScopeId } from "../../composables/scopeId.mjs";
-import { useForwardRef } from "../../composables/forwardRef.mjs"; // Utilities
+import { forwardRefs } from "../../composables/forwardRefs.mjs"; // Utilities
 
 import { onMounted, ref, watch } from 'vue';
 import { defineComponent, useRender } from "../../util/index.mjs";
 export const VSnackbar = defineComponent({
   name: 'VSnackbar',
   props: {
-    app: Boolean,
     contentClass: {
       type: String,
       default: ''
@@ -101,6 +100,7 @@ export const VSnackbar = defineComponent({
       "contentProps": {
         style: locationStyles.value
       },
+      "contentClass": props.contentClass,
       "persistent": true,
       "noClickAnimation": true,
       "scrim": false,
@@ -112,7 +112,7 @@ export const VSnackbar = defineComponent({
         "onPointerenter": onPointerenter,
         "onPointerleave": startTimeout
       }, [genOverlays(false, 'v-snackbar'), slots.default && _createVNode("div", {
-        "class": ['v-snackbar__content', props.contentClass],
+        "class": "v-snackbar__content",
         "role": "status",
         "aria-live": "polite"
       }, [slots.default()]), slots.actions && _createVNode(VDefaultsProvider, {
@@ -129,7 +129,7 @@ export const VSnackbar = defineComponent({
       })])],
       activator: slots.activator
     }));
-    return useForwardRef({}, overlay);
+    return forwardRefs({}, overlay);
   }
 
 });

package/lib/components/VSnackbar/VSnackbar.mjs.map

@@ -1 +1 @@
-{"version":3,"file":"VSnackbar.mjs","names":["VDefaultsProvider","VOverlay","genOverlays","makeVariantProps","useVariant","makeLocationProps","useLocation","makePositionProps","usePosition","makeRoundedProps","useRounded","makeTransitionProps","useProxiedModel","useScopeId","useForwardRef","onMounted","ref","watch","defineComponent","useRender","VSnackbar","name","props","app","Boolean","contentClass","type","String","default","multiLine","timeout","Number","vertical","modelValue","location","transition","emits","v","setup","slots","isActive","locationStyles","positionClasses","scopeId","colorClasses","colorStyles","variantClasses","roundedClasses","overlay","startTimeout","value","activeTimeout","window","clearTimeout","setTimeout","onPointerenter","style","actions","VBtn","variant","ripple","activator"],"sources":["../../../src/components/VSnackbar/VSnackbar.tsx"],"sourcesContent":["// Styles\nimport './VSnackbar.sass'\n\n// Components\nimport { VDefaultsProvider } from '@/components/VDefaultsProvider'\nimport { VOverlay } from '@/components/VOverlay'\n\n// Composables\nimport { genOverlays, makeVariantProps, useVariant } from '@/composables/variant'\nimport { makeLocationProps, useLocation } from '@/composables/location'\nimport { makePositionProps, usePosition } from '@/composables/position'\nimport { makeRoundedProps, useRounded } from '@/composables/rounded'\nimport { makeTransitionProps } from '@/composables/transition'\nimport { useProxiedModel } from '@/composables/proxiedModel'\nimport { useScopeId } from '@/composables/scopeId'\nimport { useForwardRef } from '@/composables/forwardRef'\n\n// Utilities\nimport { onMounted, ref, watch } from 'vue'\nimport { defineComponent, useRender } from '@/util'\n\nexport const VSnackbar = defineComponent({\n  name: 'VSnackbar',\n\n  props: {\n    app: Boolean,\n    contentClass: {\n      type: String,\n      default: '',\n    },\n    multiLine: Boolean,\n    timeout: {\n      type: [Number, String],\n      default: 5000,\n    },\n    vertical: Boolean,\n\n    modelValue: Boolean,\n\n    ...makeLocationProps({ location: 'bottom' } as const),\n    ...makePositionProps(),\n    ...makeRoundedProps(),\n    ...makeVariantProps(),\n    ...makeTransitionProps({ transition: 'v-snackbar-transition' }),\n  },\n\n  emits: {\n    'update:modelValue': (v: boolean) => true,\n  },\n\n  setup (props, { slots }) {\n    const isActive = useProxiedModel(props, 'modelValue')\n    const { locationStyles } = useLocation(props)\n    const { positionClasses } = usePosition(props)\n    const { scopeId } = useScopeId()\n\n    const { colorClasses, colorStyles, variantClasses } = useVariant(props)\n    const { roundedClasses } = useRounded(props)\n\n    const overlay = ref<VOverlay>()\n\n    watch(isActive, startTimeout)\n    watch(() => props.timeout, startTimeout)\n\n    onMounted(() => {\n      if (isActive.value) startTimeout()\n    })\n\n    let activeTimeout = -1\n    function startTimeout () {\n      window.clearTimeout(activeTimeout)\n      const timeout = Number(props.timeout)\n\n      if (!isActive.value || timeout === -1) return\n\n      activeTimeout = window.setTimeout(() => {\n        isActive.value = false\n      }, timeout)\n    }\n\n    function onPointerenter () {\n      window.clearTimeout(activeTimeout)\n    }\n\n    useRender(() => (\n      <VOverlay\n        v-model={ isActive.value }\n        ref={ overlay }\n        class={[\n          'v-snackbar',\n          {\n            'v-snackbar--active': isActive.value,\n            'v-snackbar--multi-line': props.multiLine && !props.vertical,\n            'v-snackbar--vertical': props.vertical,\n          },\n          positionClasses.value,\n        ]}\n        style={[colorStyles.value]}\n        contentProps={{\n          style: locationStyles.value,\n        }}\n        persistent\n        noClickAnimation\n        scrim={ false }\n        scrollStrategy=\"none\"\n        transition={ props.transition }\n        { ...scopeId }\n        v-slots={{ activator: slots.activator }}\n      >\n        <div\n          class={[\n            'v-snackbar__wrapper',\n            colorClasses.value,\n            roundedClasses.value,\n            variantClasses.value,\n          ]}\n          onPointerenter={ onPointerenter }\n          onPointerleave={ startTimeout }\n        >\n          { genOverlays(false, 'v-snackbar') }\n\n          { slots.default && (\n            <div\n              class={[\n                'v-snackbar__content',\n                props.contentClass,\n              ]}\n              role=\"status\"\n              aria-live=\"polite\"\n            >\n              { slots.default() }\n            </div>\n          ) }\n\n          { slots.actions && (\n            <VDefaultsProvider\n              defaults={{\n                VBtn: {\n                  variant: 'text',\n                  ripple: false,\n                },\n              }}\n            >\n              <div class=\"v-snackbar__actions\">\n                { slots.actions() }\n              </div>\n            </VDefaultsProvider>\n          ) }\n        </div>\n      </VOverlay>\n    ))\n\n    return useForwardRef({}, overlay)\n  },\n})\n\nexport type VSnackbar = InstanceType<typeof VSnackbar>\n"],"mappings":"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"}
+{"version":3,"file":"VSnackbar.mjs","names":["VDefaultsProvider","VOverlay","genOverlays","makeVariantProps","useVariant","makeLocationProps","useLocation","makePositionProps","usePosition","makeRoundedProps","useRounded","makeTransitionProps","useProxiedModel","useScopeId","forwardRefs","onMounted","ref","watch","defineComponent","useRender","VSnackbar","name","props","contentClass","type","String","default","multiLine","Boolean","timeout","Number","vertical","modelValue","location","transition","emits","v","setup","slots","isActive","locationStyles","positionClasses","scopeId","colorClasses","colorStyles","variantClasses","roundedClasses","overlay","startTimeout","value","activeTimeout","window","clearTimeout","setTimeout","onPointerenter","style","actions","VBtn","variant","ripple","activator"],"sources":["../../../src/components/VSnackbar/VSnackbar.tsx"],"sourcesContent":["// Styles\nimport './VSnackbar.sass'\n\n// Components\nimport { VDefaultsProvider } from '@/components/VDefaultsProvider'\nimport { VOverlay } from '@/components/VOverlay'\n\n// Composables\nimport { genOverlays, makeVariantProps, useVariant } from '@/composables/variant'\nimport { makeLocationProps, useLocation } from '@/composables/location'\nimport { makePositionProps, usePosition } from '@/composables/position'\nimport { makeRoundedProps, useRounded } from '@/composables/rounded'\nimport { makeTransitionProps } from '@/composables/transition'\nimport { useProxiedModel } from '@/composables/proxiedModel'\nimport { useScopeId } from '@/composables/scopeId'\nimport { forwardRefs } from '@/composables/forwardRefs'\n\n// Utilities\nimport { onMounted, ref, watch } from 'vue'\nimport { defineComponent, useRender } from '@/util'\n\nexport const VSnackbar = defineComponent({\n  name: 'VSnackbar',\n\n  props: {\n    contentClass: {\n      type: String,\n      default: '',\n    },\n    multiLine: Boolean,\n    timeout: {\n      type: [Number, String],\n      default: 5000,\n    },\n    vertical: Boolean,\n\n    modelValue: Boolean,\n\n    ...makeLocationProps({ location: 'bottom' } as const),\n    ...makePositionProps(),\n    ...makeRoundedProps(),\n    ...makeVariantProps(),\n    ...makeTransitionProps({ transition: 'v-snackbar-transition' }),\n  },\n\n  emits: {\n    'update:modelValue': (v: boolean) => true,\n  },\n\n  setup (props, { slots }) {\n    const isActive = useProxiedModel(props, 'modelValue')\n    const { locationStyles } = useLocation(props)\n    const { positionClasses } = usePosition(props)\n    const { scopeId } = useScopeId()\n\n    const { colorClasses, colorStyles, variantClasses } = useVariant(props)\n    const { roundedClasses } = useRounded(props)\n\n    const overlay = ref<VOverlay>()\n\n    watch(isActive, startTimeout)\n    watch(() => props.timeout, startTimeout)\n\n    onMounted(() => {\n      if (isActive.value) startTimeout()\n    })\n\n    let activeTimeout = -1\n    function startTimeout () {\n      window.clearTimeout(activeTimeout)\n      const timeout = Number(props.timeout)\n\n      if (!isActive.value || timeout === -1) return\n\n      activeTimeout = window.setTimeout(() => {\n        isActive.value = false\n      }, timeout)\n    }\n\n    function onPointerenter () {\n      window.clearTimeout(activeTimeout)\n    }\n\n    useRender(() => (\n      <VOverlay\n        v-model={ isActive.value }\n        ref={ overlay }\n        class={[\n          'v-snackbar',\n          {\n            'v-snackbar--active': isActive.value,\n            'v-snackbar--multi-line': props.multiLine && !props.vertical,\n            'v-snackbar--vertical': props.vertical,\n          },\n          positionClasses.value,\n        ]}\n        style={[colorStyles.value]}\n        contentProps={{\n          style: locationStyles.value,\n        }}\n        contentClass={ props.contentClass }\n        persistent\n        noClickAnimation\n        scrim={ false }\n        scrollStrategy=\"none\"\n        transition={ props.transition }\n        { ...scopeId }\n        v-slots={{ activator: slots.activator }}\n      >\n        <div\n          class={[\n            'v-snackbar__wrapper',\n            colorClasses.value,\n            roundedClasses.value,\n            variantClasses.value,\n          ]}\n          onPointerenter={ onPointerenter }\n          onPointerleave={ startTimeout }\n        >\n          { genOverlays(false, 'v-snackbar') }\n\n          { slots.default && (\n            <div\n              class=\"v-snackbar__content\"\n              role=\"status\"\n              aria-live=\"polite\"\n            >\n              { slots.default() }\n            </div>\n          ) }\n\n          { slots.actions && (\n            <VDefaultsProvider\n              defaults={{\n                VBtn: {\n                  variant: 'text',\n                  ripple: false,\n                },\n              }}\n            >\n              <div class=\"v-snackbar__actions\">\n                { slots.actions() }\n              </div>\n            </VDefaultsProvider>\n          ) }\n        </div>\n      </VOverlay>\n    ))\n\n    return forwardRefs({}, overlay)\n  },\n})\n\nexport type VSnackbar = InstanceType<typeof VSnackbar>\n"],"mappings":"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"}

package/lib/components/VSnackbar/_variables.scss

@@ -4,11 +4,10 @@
 // VSnackbar
 $snackbar-absolute-z-index: 1 !default;
 $snackbar-action-margin: 8px !default;
-$snackbar-background-color: #333333 !default;
 $snackbar-border-radius: settings.$border-radius-root !default;
 $snackbar-plain-opacity: .62 !default;
 $snackbar-btn-padding: 0 8px !default;
-$snackbar-background: #333333 !default;
+$snackbar-background: rgb(var(--v-theme-surface-variant)) !default;
 $snackbar-color: rgb(var(--v-theme-on-surface-variant)) !default;
 $snackbar-font-size: tools.map-deep-get(settings.$typography, 'body-2', 'size') !default;
 $snackbar-font-weight: tools.map-deep-get(settings.$typography, 'body-2', 'weight') !default;
@@ -17,7 +16,6 @@ $snackbar-line-height: tools.map-deep-get(settings.$typography, 'body-2', 'line-
 $snackbar-content-padding: 14px 16px !default;
 $snackbar-elevation: 6 !default;
 $snackbar-multi-line-wrapper-min-height: 68px !default;
-$snackbar-shaped-border-radius: map-get(settings.$rounded, 'xl') $snackbar-border-radius !default;
 $snackbar-transition-scale: .8 !default;
 $snackbar-vertical-action-margin-bottom: 8px !default;
 $snackbar-wrapper-margin: 8px !default;

package/lib/components/VTable/VTable.mjs.map

@@ -1 +1 @@
-{"version":3,"file":"VTable.mjs","names":["makeDensityProps","useDensity","makeTagProps","makeThemeProps","provideTheme","convertToUnit","defineComponent","useRender","VTable","name","props","fixedHeader","Boolean","fixedFooter","height","Number","String","setup","slots","themeClasses","densityClasses","top","bottom","value","default"],"sources":["../../../src/components/VTable/VTable.tsx"],"sourcesContent":["// Styles\nimport './VTable.sass'\n\n// Composables\nimport { makeDensityProps, useDensity } from '@/composables/density'\nimport { makeTagProps } from '@/composables/tag'\nimport { makeThemeProps, provideTheme } from '@/composables/theme'\n\n// Utilities\nimport { convertToUnit, defineComponent, useRender } from '@/util'\n\nexport const VTable = defineComponent({\n  name: 'VTable',\n\n  props: {\n    fixedHeader: Boolean,\n    fixedFooter: Boolean,\n    height: [Number, String],\n\n    ...makeDensityProps(),\n    ...makeTagProps(),\n    ...makeThemeProps(),\n  },\n\n  setup (props, { slots }) {\n    const { themeClasses } = provideTheme(props)\n    const { densityClasses } = useDensity(props)\n\n    useRender(() => (\n      <props.tag\n        class={[\n          'v-table',\n          {\n            'v-table--fixed-height': !!props.height,\n            'v-table--fixed-header': props.fixedHeader,\n            'v-table--fixed-footer': props.fixedFooter,\n            'v-table--has-top': !!slots.top,\n            'v-table--has-bottom': !!slots.bottom,\n          },\n          themeClasses.value,\n          densityClasses.value,\n        ]}\n      >\n        { slots.top?.() }\n\n        { slots.default && (\n          <div\n            class=\"v-table__wrapper\"\n            style={{ height: convertToUnit(props.height) }}\n          >\n            <table>\n              { slots.default() }\n            </table>\n          </div>\n        ) }\n\n        { slots.bottom?.() }\n      </props.tag>\n    ))\n\n    return {}\n  },\n})\n"],"mappings":";AAAA;AACA,sB,CAEA;;SACSA,gB,EAAkBC,U;SAClBC,Y;SACAC,c,EAAgBC,Y,uCAEzB;;SACSC,a,EAAeC,e,EAAiBC,S;AAEzC,OAAO,MAAMC,MAAM,GAAGF,eAAe,CAAC;EACpCG,IAAI,EAAE,QAD8B;EAGpCC,KAAK,EAAE;IACLC,WAAW,EAAEC,OADR;IAELC,WAAW,EAAED,OAFR;IAGLE,MAAM,EAAE,CAACC,MAAD,EAASC,MAAT,CAHH;IAKL,GAAGhB,gBAAgB,EALd;IAML,GAAGE,YAAY,EANV;IAOL,GAAGC,cAAc;EAPZ,CAH6B;;EAapCc,KAAK,CAAEP,KAAF,QAAoB;IAAA,IAAX;MAAEQ;IAAF,CAAW;IACvB,MAAM;MAAEC;IAAF,IAAmBf,YAAY,CAACM,KAAD,CAArC;IACA,MAAM;MAAEU;IAAF,IAAqBnB,UAAU,CAACS,KAAD,CAArC;IAEAH,SAAS,CAAC;MAAA;;MAAA;QAAA,SAEC,CACL,SADK,EAEL;UACE,yBAAyB,CAAC,CAACG,KAAK,CAACI,MADnC;UAEE,yBAAyBJ,KAAK,CAACC,WAFjC;UAGE,yBAAyBD,KAAK,CAACG,WAHjC;UAIE,oBAAoB,CAAC,CAACK,KAAK,CAACG,GAJ9B;UAKE,uBAAuB,CAAC,CAACH,KAAK,CAACI;QALjC,CAFK,EASLH,YAAY,CAACI,KATR,EAULH,cAAc,CAACG,KAVV;MAFD;QAAA,8BAeJL,KAAK,CAACG,GAfF,qBAeJ,gBAAAH,KAAK,CAfD,EAiBJA,KAAK,CAACM,OAAN;UAAA,SAEQ,kBAFR;UAAA,SAGS;YAAEV,MAAM,EAAET,aAAa,CAACK,KAAK,CAACI,MAAP;UAAvB;QAHT,iCAMMI,KAAK,CAACM,OAAN,EANN,IAjBI,mBA4BJN,KAAK,CAACI,MA5BF,qBA4BJ,mBAAAJ,KAAK,CA5BD;MAAA;IAAA,CAAD,CAAT;IAgCA,OAAO,EAAP;EACD;;AAlDmC,CAAD,CAA9B"}
+{"version":3,"file":"VTable.mjs","names":["makeDensityProps","useDensity","makeTagProps","makeThemeProps","provideTheme","convertToUnit","defineComponent","useRender","VTable","name","props","fixedHeader","Boolean","fixedFooter","height","Number","String","setup","slots","themeClasses","densityClasses","top","bottom","value","default"],"sources":["../../../src/components/VTable/VTable.tsx"],"sourcesContent":["// Styles\nimport './VTable.sass'\n\n// Composables\nimport { makeDensityProps, useDensity } from '@/composables/density'\nimport { makeTagProps } from '@/composables/tag'\nimport { makeThemeProps, provideTheme } from '@/composables/theme'\n\n// Utilities\nimport { convertToUnit, defineComponent, useRender } from '@/util'\n\nexport const VTable = defineComponent({\n  name: 'VTable',\n\n  props: {\n    fixedHeader: Boolean,\n    fixedFooter: Boolean,\n    height: [Number, String],\n\n    ...makeDensityProps(),\n    ...makeTagProps(),\n    ...makeThemeProps(),\n  },\n\n  setup (props, { slots }) {\n    const { themeClasses } = provideTheme(props)\n    const { densityClasses } = useDensity(props)\n\n    useRender(() => (\n      <props.tag\n        class={[\n          'v-table',\n          {\n            'v-table--fixed-height': !!props.height,\n            'v-table--fixed-header': props.fixedHeader,\n            'v-table--fixed-footer': props.fixedFooter,\n            'v-table--has-top': !!slots.top,\n            'v-table--has-bottom': !!slots.bottom,\n          },\n          themeClasses.value,\n          densityClasses.value,\n        ]}\n      >\n        { slots.top?.() }\n\n        { slots.default && (\n          <div\n            class=\"v-table__wrapper\"\n            style={{ height: convertToUnit(props.height) }}\n          >\n            <table>\n              { slots.default() }\n            </table>\n          </div>\n        ) }\n\n        { slots.bottom?.() }\n      </props.tag>\n    ))\n\n    return {}\n  },\n})\n\nexport type VTable = InstanceType<typeof VTable>\n"],"mappings":";AAAA;AACA,sB,CAEA;;SACSA,gB,EAAkBC,U;SAClBC,Y;SACAC,c,EAAgBC,Y,uCAEzB;;SACSC,a,EAAeC,e,EAAiBC,S;AAEzC,OAAO,MAAMC,MAAM,GAAGF,eAAe,CAAC;EACpCG,IAAI,EAAE,QAD8B;EAGpCC,KAAK,EAAE;IACLC,WAAW,EAAEC,OADR;IAELC,WAAW,EAAED,OAFR;IAGLE,MAAM,EAAE,CAACC,MAAD,EAASC,MAAT,CAHH;IAKL,GAAGhB,gBAAgB,EALd;IAML,GAAGE,YAAY,EANV;IAOL,GAAGC,cAAc;EAPZ,CAH6B;;EAapCc,KAAK,CAAEP,KAAF,QAAoB;IAAA,IAAX;MAAEQ;IAAF,CAAW;IACvB,MAAM;MAAEC;IAAF,IAAmBf,YAAY,CAACM,KAAD,CAArC;IACA,MAAM;MAAEU;IAAF,IAAqBnB,UAAU,CAACS,KAAD,CAArC;IAEAH,SAAS,CAAC;MAAA;;MAAA;QAAA,SAEC,CACL,SADK,EAEL;UACE,yBAAyB,CAAC,CAACG,KAAK,CAACI,MADnC;UAEE,yBAAyBJ,KAAK,CAACC,WAFjC;UAGE,yBAAyBD,KAAK,CAACG,WAHjC;UAIE,oBAAoB,CAAC,CAACK,KAAK,CAACG,GAJ9B;UAKE,uBAAuB,CAAC,CAACH,KAAK,CAACI;QALjC,CAFK,EASLH,YAAY,CAACI,KATR,EAULH,cAAc,CAACG,KAVV;MAFD;QAAA,8BAeJL,KAAK,CAACG,GAfF,qBAeJ,gBAAAH,KAAK,CAfD,EAiBJA,KAAK,CAACM,OAAN;UAAA,SAEQ,kBAFR;UAAA,SAGS;YAAEV,MAAM,EAAET,aAAa,CAACK,KAAK,CAACI,MAAP;UAAvB;QAHT,iCAMMI,KAAK,CAACM,OAAN,EANN,IAjBI,mBA4BJN,KAAK,CAACI,MA5BF,qBA4BJ,mBAAAJ,KAAK,CA5BD;MAAA;IAAA,CAAD,CAAT;IAgCA,OAAO,EAAP;EACD;;AAlDmC,CAAD,CAA9B"}

package/lib/components/VTabs/VTab.css

@@ -1,5 +1,4 @@
 .v-tab {
-  display: inline-flex;
   position: relative;
   max-width: 360px;
   min-width: 90px;

package/lib/components/VTabs/VTab.sass

@@ -1,7 +1,6 @@
 @use './variables' as *
 
 .v-tab
-  display: inline-flex
   position: relative
   max-width: $tab-max-width
   min-width: $tab-min-width

package/lib/components/VTextField/VTextField.css

@@ -44,9 +44,10 @@
   cursor: default;
   display: flex;
   opacity: 0;
-  padding-top: var(--v-field-padding-top);
   transition: inherit;
   white-space: nowrap;
+  padding-top: calc(var(--v-field-padding-top, 4px) + var(--v-input-padding-top, 0));
+  padding-bottom: var(--v-field-padding-bottom, 6px);
 }
 .v-field--active .v-text-field__prefix, .v-field--active .v-text-field__suffix {
   opacity: 1;

package/lib/components/VTextField/VTextField.mjs

@@ -1,4 +1,4 @@
-import { withDirectives as _withDirectives, mergeProps as _mergeProps, resolveDirective as _resolveDirective, createVNode as _createVNode, Fragment as _Fragment } from "vue";
+import { Fragment as _Fragment, withDirectives as _withDirectives, createVNode as _createVNode, mergeProps as _mergeProps, resolveDirective as _resolveDirective, vModelDynamic as _vModelDynamic } from "vue";
 // Styles
 import "./VTextField.css"; // Components
 
@@ -8,10 +8,10 @@ import { VCounter } from "../VCounter/index.mjs"; // Directives
 
 import Intersect from "../../directives/intersect/index.mjs"; // Composables
 
-import { useForwardRef } from "../../composables/forwardRef.mjs";
+import { forwardRefs } from "../../composables/forwardRefs.mjs";
 import { useProxiedModel } from "../../composables/proxiedModel.mjs"; // Utilities
 
-import { computed, nextTick, ref } from 'vue';
+import { cloneVNode, computed, nextTick, ref } from 'vue';
 import { filterInputAttrs, genericComponent, useRender } from "../../util/index.mjs"; // Types
 
 const activeTypes = ['color', 'file', 'time', 'date', 'datetime-local', 'week', 'month'];
@@ -104,10 +104,6 @@ export const VTextField = genericComponent()({
       });
     }
 
-    function onInput(e) {
-      model.value = e.target.value;
-    }
-
     useRender(() => {
       const hasCounter = !!(slots.counter || props.counter || props.counterValue);
       const hasDetails = !!(hasCounter || slots.details);
@@ -158,24 +154,16 @@ export const VTextField = genericComponent()({
             "error": isValid.value === false
           }), { ...slots,
             default: _ref3 => {
-              var _slots$default;
-
               let {
                 props: {
                   class: fieldClass,
                   ...slotProps
                 }
               } = _ref3;
-              return _createVNode(_Fragment, null, [props.prefix && _createVNode("span", {
-                "class": "v-text-field__prefix"
-              }, [props.prefix]), _createVNode("div", {
-                "class": fieldClass,
-                "onClick": e => emit('click:input', e),
-                "data-no-activator": ""
-              }, [(_slots$default = slots.default) == null ? void 0 : _slots$default.call(slots), _withDirectives(_createVNode("input", _mergeProps({
+
+              const inputNode = _withDirectives(_createVNode("input", _mergeProps({
                 "ref": inputRef,
-                "value": model.value,
-                "onInput": onInput,
+                "onUpdate:modelValue": $event => model.value = $event,
                 "autofocus": props.autofocus,
                 "readonly": isReadonly.value,
                 "disabled": isDisabled.value,
@@ -185,11 +173,21 @@ export const VTextField = genericComponent()({
                 "type": props.type,
                 "onFocus": onFocus,
                 "onBlur": () => isFocused.value = false
-              }, slotProps, inputAttrs), null), [[_resolveDirective("intersect"), {
+              }, slotProps, inputAttrs), null), [[_vModelDynamic, model.value], [_resolveDirective("intersect"), {
                 handler: onIntersect
               }, null, {
                 once: true
-              }]])]), props.suffix && _createVNode("span", {
+              }]]);
+
+              return _createVNode(_Fragment, null, [props.prefix && _createVNode("span", {
+                "class": "v-text-field__prefix"
+              }, [props.prefix]), slots.default ? _createVNode("div", {
+                "class": fieldClass,
+                "onClick": e => emit('click:input', e),
+                "data-no-activator": ""
+              }, [slots.default(), inputNode]) : cloneVNode(inputNode, {
+                class: fieldClass
+              }), props.suffix && _createVNode("span", {
                 "class": "v-text-field__suffix"
               }, [props.suffix])]);
             }
@@ -206,7 +204,7 @@ export const VTextField = genericComponent()({
         } : undefined
       });
     });
-    return useForwardRef({}, vInputRef, vFieldRef, inputRef);
+    return forwardRefs({}, vInputRef, vFieldRef, inputRef);
   }
 
 });

package/lib/components/VTextField/VTextField.mjs.map

@@ -1 +1 @@
-{"version":3,"file":"VTextField.mjs","names":["filterFieldProps","makeVFieldProps","VField","filterInputProps","makeVInputProps","VInput","VCounter","Intersect","useForwardRef","useProxiedModel","computed","nextTick","ref","filterInputAttrs","genericComponent","useRender","activeTypes","VTextField","name","directives","inheritAttrs","props","autofocus","Boolean","counter","Number","String","counterValue","Function","hint","persistentHint","prefix","placeholder","persistentPlaceholder","persistentCounter","suffix","type","default","emits","e","val","setup","attrs","emit","slots","model","value","toString","length","max","maxlength","undefined","onIntersect","isIntersecting","entries","target","focus","vInputRef","vFieldRef","isFocused","inputRef","isActive","includes","messages","onFocus","document","activeElement","onControlClick","onClear","stopPropagation","onInput","hasCounter","hasDetails","details","rootAttrs","inputAttrs","modelValue","_","inputProps","fieldProps","variant","id","isDisabled","isDirty","isReadonly","isValid","preventDefault","dirty","class","fieldClass","slotProps","handler"],"sources":["../../../src/components/VTextField/VTextField.tsx"],"sourcesContent":["// Styles\nimport './VTextField.sass'\n\n// Components\nimport { filterFieldProps, makeVFieldProps, VField } from '@/components/VField/VField'\nimport { filterInputProps, makeVInputProps, VInput } from '@/components/VInput/VInput'\nimport { VCounter } from '@/components/VCounter'\n\n// Directives\nimport Intersect from '@/directives/intersect'\n\n// Composables\nimport { useForwardRef } from '@/composables/forwardRef'\nimport { useProxiedModel } from '@/composables/proxiedModel'\n\n// Utilities\nimport { computed, nextTick, ref } from 'vue'\nimport { filterInputAttrs, genericComponent, useRender } from '@/util'\n\n// Types\nimport type { PropType } from 'vue'\nimport type { VFieldSlots } from '@/components/VField/VField'\nimport type { VInputSlots } from '@/components/VInput/VInput'\n\nconst activeTypes = ['color', 'file', 'time', 'date', 'datetime-local', 'week', 'month']\n\nexport const VTextField = genericComponent<new <T>() => {\n  $slots: VInputSlots & VFieldSlots\n}>()({\n  name: 'VTextField',\n\n  directives: { Intersect },\n\n  inheritAttrs: false,\n\n  props: {\n    autofocus: Boolean,\n    counter: [Boolean, Number, String] as PropType<true | number | string>,\n    counterValue: Function as PropType<(value: any) => number>,\n    hint: String,\n    persistentHint: Boolean,\n    prefix: String,\n    placeholder: String,\n    persistentPlaceholder: Boolean,\n    persistentCounter: Boolean,\n    suffix: String,\n    type: {\n      type: String,\n      default: 'text',\n    },\n\n    ...makeVInputProps(),\n    ...makeVFieldProps(),\n  },\n\n  emits: {\n    'click:clear': (e: MouseEvent) => true,\n    'click:control': (e: MouseEvent) => true,\n    'click:input': (e: MouseEvent) => true,\n    'update:modelValue': (val: string) => true,\n  },\n\n  setup (props, { attrs, emit, slots }) {\n    const model = useProxiedModel(props, 'modelValue')\n    const counterValue = computed(() => {\n      return typeof props.counterValue === 'function'\n        ? props.counterValue(model.value)\n        : (model.value ?? '').toString().length\n    })\n    const max = computed(() => {\n      if (attrs.maxlength) return attrs.maxlength as undefined\n\n      if (\n        !props.counter ||\n        (typeof props.counter !== 'number' &&\n        typeof props.counter !== 'string')\n      ) return undefined\n\n      return props.counter\n    })\n\n    function onIntersect (\n      isIntersecting: boolean,\n      entries: IntersectionObserverEntry[]\n    ) {\n      if (!props.autofocus || !isIntersecting) return\n\n      (entries[0].target as HTMLInputElement)?.focus?.()\n    }\n\n    const vInputRef = ref<VInput>()\n    const vFieldRef = ref<VInput>()\n    const isFocused = ref(false)\n    const inputRef = ref<HTMLInputElement>()\n    const isActive = computed(() => (\n      activeTypes.includes(props.type) ||\n      props.persistentPlaceholder ||\n      isFocused.value\n    ))\n    const messages = computed(() => {\n      return props.messages.length\n        ? props.messages\n        : (isFocused.value || props.persistentHint) ? props.hint : ''\n    })\n    function onFocus () {\n      if (inputRef.value !== document.activeElement) {\n        inputRef.value?.focus()\n      }\n\n      if (!isFocused.value) isFocused.value = true\n    }\n    function onControlClick (e: MouseEvent) {\n      onFocus()\n\n      emit('click:control', e)\n    }\n    function onClear (e: MouseEvent) {\n      e.stopPropagation()\n\n      onFocus()\n\n      nextTick(() => {\n        model.value = ''\n\n        emit('click:clear', e)\n      })\n    }\n    function onInput (e: Event) {\n      model.value = (e.target as HTMLInputElement).value\n    }\n\n    useRender(() => {\n      const hasCounter = !!(slots.counter || props.counter || props.counterValue)\n      const hasDetails = !!(hasCounter || slots.details)\n      const [rootAttrs, inputAttrs] = filterInputAttrs(attrs)\n      const [{ modelValue: _, ...inputProps }] = filterInputProps(props)\n      const [fieldProps] = filterFieldProps(props)\n\n      return (\n        <VInput\n          ref={ vInputRef }\n          v-model={ model.value }\n          class={[\n            'v-text-field',\n            {\n              'v-text-field--prefixed': props.prefix,\n              'v-text-field--suffixed': props.suffix,\n              'v-text-field--flush-details': ['plain', 'underlined'].includes(props.variant),\n            },\n          ]}\n          onClick:prepend={ attrs['onClick:prepend'] }\n          onClick:append={ attrs['onClick:append'] }\n          { ...rootAttrs }\n          { ...inputProps }\n          messages={ messages.value }\n        >\n          {{\n            ...slots,\n            default: ({\n              id,\n              isDisabled,\n              isDirty,\n              isReadonly,\n              isValid,\n            }) => (\n              <VField\n                ref={ vFieldRef }\n                onMousedown={ (e: MouseEvent) => {\n                  if (e.target === inputRef.value) return\n\n                  e.preventDefault()\n                }}\n                onClick:control={ onControlClick }\n                onClick:clear={ onClear }\n                onClick:prependInner={ attrs['onClick:prependInner'] }\n                onClick:appendInner={ attrs['onClick:appendInner'] }\n                role=\"textbox\"\n                { ...fieldProps }\n                id={ id.value }\n                active={ isActive.value || isDirty.value }\n                dirty={ isDirty.value || props.dirty }\n                focused={ isFocused.value }\n                error={ isValid.value === false }\n              >\n                {{\n                  ...slots,\n                  default: ({\n                    props: { class: fieldClass, ...slotProps },\n                  }) => {\n                    return (\n                      <>\n                        { props.prefix && (\n                          <span class=\"v-text-field__prefix\">\n                            { props.prefix }\n                          </span>\n                        ) }\n\n                        <div\n                          class={ fieldClass }\n                          onClick={ e => emit('click:input', e) }\n                          data-no-activator=\"\"\n                        >\n                          { slots.default?.() }\n\n                          <input\n                            ref={ inputRef }\n                            value={ model.value }\n                            onInput={ onInput }\n                            v-intersect={[{\n                              handler: onIntersect,\n                            }, null, ['once']]}\n                            autofocus={ props.autofocus }\n                            readonly={ isReadonly.value }\n                            disabled={ isDisabled.value }\n                            name={ props.name }\n                            placeholder={ props.placeholder }\n                            size={ 1 }\n                            type={ props.type }\n                            onFocus={ onFocus }\n                            onBlur={ () => (isFocused.value = false) }\n                            { ...slotProps }\n                            { ...inputAttrs }\n                          />\n                        </div>\n\n                        { props.suffix && (\n                          <span class=\"v-text-field__suffix\">\n                            { props.suffix }\n                          </span>\n                        ) }\n                      </>\n                    )\n                  },\n                }}\n              </VField>\n            ),\n            details: hasDetails ? slotProps => (\n              <>\n                { slots.details?.(slotProps) }\n\n                { hasCounter && (\n                  <>\n                    <span />\n\n                    <VCounter\n                      active={ props.persistentCounter || isFocused.value }\n                      value={ counterValue.value }\n                      max={ max.value }\n                      v-slots={ slots.counter }\n                    />\n                  </>\n                ) }\n              </>\n            ) : undefined,\n          }}\n        </VInput>\n      )\n    })\n\n    return useForwardRef({}, vInputRef, vFieldRef, inputRef)\n  },\n})\n\nexport type VTextField = InstanceType<typeof VTextField>\n"],"mappings":"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"}
+{"version":3,"file":"VTextField.mjs","names":["filterFieldProps","makeVFieldProps","VField","filterInputProps","makeVInputProps","VInput","VCounter","Intersect","forwardRefs","useProxiedModel","cloneVNode","computed","nextTick","ref","filterInputAttrs","genericComponent","useRender","activeTypes","VTextField","name","directives","inheritAttrs","props","autofocus","Boolean","counter","Number","String","counterValue","Function","hint","persistentHint","prefix","placeholder","persistentPlaceholder","persistentCounter","suffix","type","default","emits","e","val","setup","attrs","emit","slots","model","value","toString","length","max","maxlength","undefined","onIntersect","isIntersecting","entries","target","focus","vInputRef","vFieldRef","isFocused","inputRef","isActive","includes","messages","onFocus","document","activeElement","onControlClick","onClear","stopPropagation","hasCounter","hasDetails","details","rootAttrs","inputAttrs","modelValue","_","inputProps","fieldProps","variant","id","isDisabled","isDirty","isReadonly","isValid","preventDefault","dirty","class","fieldClass","slotProps","inputNode","handler"],"sources":["../../../src/components/VTextField/VTextField.tsx"],"sourcesContent":["// Styles\nimport './VTextField.sass'\n\n// Components\nimport { filterFieldProps, makeVFieldProps, VField } from '@/components/VField/VField'\nimport { filterInputProps, makeVInputProps, VInput } from '@/components/VInput/VInput'\nimport { VCounter } from '@/components/VCounter'\n\n// Directives\nimport Intersect from '@/directives/intersect'\n\n// Composables\nimport { forwardRefs } from '@/composables/forwardRefs'\nimport { useProxiedModel } from '@/composables/proxiedModel'\n\n// Utilities\nimport { cloneVNode, computed, nextTick, ref } from 'vue'\nimport { filterInputAttrs, genericComponent, useRender } from '@/util'\n\n// Types\nimport type { PropType } from 'vue'\nimport type { MakeSlots } from '@/util'\nimport type { VFieldSlots } from '@/components/VField/VField'\nimport type { VInputSlots } from '@/components/VInput/VInput'\n\nconst activeTypes = ['color', 'file', 'time', 'date', 'datetime-local', 'week', 'month']\n\nexport const VTextField = genericComponent<new <T>() => {\n  $slots: Omit<VInputSlots & VFieldSlots, 'default'> & MakeSlots<{\n    default: []\n  }>\n}>()({\n  name: 'VTextField',\n\n  directives: { Intersect },\n\n  inheritAttrs: false,\n\n  props: {\n    autofocus: Boolean,\n    counter: [Boolean, Number, String] as PropType<true | number | string>,\n    counterValue: Function as PropType<(value: any) => number>,\n    hint: String,\n    persistentHint: Boolean,\n    prefix: String,\n    placeholder: String,\n    persistentPlaceholder: Boolean,\n    persistentCounter: Boolean,\n    suffix: String,\n    type: {\n      type: String,\n      default: 'text',\n    },\n\n    ...makeVInputProps(),\n    ...makeVFieldProps(),\n  },\n\n  emits: {\n    'click:clear': (e: MouseEvent) => true,\n    'click:control': (e: MouseEvent) => true,\n    'click:input': (e: MouseEvent) => true,\n    'update:modelValue': (val: string) => true,\n  },\n\n  setup (props, { attrs, emit, slots }) {\n    const model = useProxiedModel(props, 'modelValue')\n    const counterValue = computed(() => {\n      return typeof props.counterValue === 'function'\n        ? props.counterValue(model.value)\n        : (model.value ?? '').toString().length\n    })\n    const max = computed(() => {\n      if (attrs.maxlength) return attrs.maxlength as undefined\n\n      if (\n        !props.counter ||\n        (typeof props.counter !== 'number' &&\n        typeof props.counter !== 'string')\n      ) return undefined\n\n      return props.counter\n    })\n\n    function onIntersect (\n      isIntersecting: boolean,\n      entries: IntersectionObserverEntry[]\n    ) {\n      if (!props.autofocus || !isIntersecting) return\n\n      (entries[0].target as HTMLInputElement)?.focus?.()\n    }\n\n    const vInputRef = ref<VInput>()\n    const vFieldRef = ref<VField>()\n    const isFocused = ref(false)\n    const inputRef = ref<HTMLInputElement>()\n    const isActive = computed(() => (\n      activeTypes.includes(props.type) ||\n      props.persistentPlaceholder ||\n      isFocused.value\n    ))\n    const messages = computed(() => {\n      return props.messages.length\n        ? props.messages\n        : (isFocused.value || props.persistentHint) ? props.hint : ''\n    })\n    function onFocus () {\n      if (inputRef.value !== document.activeElement) {\n        inputRef.value?.focus()\n      }\n\n      if (!isFocused.value) isFocused.value = true\n    }\n    function onControlClick (e: MouseEvent) {\n      onFocus()\n\n      emit('click:control', e)\n    }\n    function onClear (e: MouseEvent) {\n      e.stopPropagation()\n\n      onFocus()\n\n      nextTick(() => {\n        model.value = ''\n\n        emit('click:clear', e)\n      })\n    }\n\n    useRender(() => {\n      const hasCounter = !!(slots.counter || props.counter || props.counterValue)\n      const hasDetails = !!(hasCounter || slots.details)\n      const [rootAttrs, inputAttrs] = filterInputAttrs(attrs)\n      const [{ modelValue: _, ...inputProps }] = filterInputProps(props)\n      const [fieldProps] = filterFieldProps(props)\n\n      return (\n        <VInput\n          ref={ vInputRef }\n          v-model={ model.value }\n          class={[\n            'v-text-field',\n            {\n              'v-text-field--prefixed': props.prefix,\n              'v-text-field--suffixed': props.suffix,\n              'v-text-field--flush-details': ['plain', 'underlined'].includes(props.variant),\n            },\n          ]}\n          onClick:prepend={ attrs['onClick:prepend'] }\n          onClick:append={ attrs['onClick:append'] }\n          { ...rootAttrs }\n          { ...inputProps }\n          messages={ messages.value }\n        >\n          {{\n            ...slots,\n            default: ({\n              id,\n              isDisabled,\n              isDirty,\n              isReadonly,\n              isValid,\n            }) => (\n              <VField\n                ref={ vFieldRef }\n                onMousedown={ (e: MouseEvent) => {\n                  if (e.target === inputRef.value) return\n\n                  e.preventDefault()\n                }}\n                onClick:control={ onControlClick }\n                onClick:clear={ onClear }\n                onClick:prependInner={ attrs['onClick:prependInner'] }\n                onClick:appendInner={ attrs['onClick:appendInner'] }\n                role=\"textbox\"\n                { ...fieldProps }\n                id={ id.value }\n                active={ isActive.value || isDirty.value }\n                dirty={ isDirty.value || props.dirty }\n                focused={ isFocused.value }\n                error={ isValid.value === false }\n              >\n                {{\n                  ...slots,\n                  default: ({\n                    props: { class: fieldClass, ...slotProps },\n                  }) => {\n                    const inputNode = (\n                      <input\n                        ref={ inputRef }\n                        v-model={ model.value }\n                        v-intersect={[{\n                          handler: onIntersect,\n                        }, null, ['once']]}\n                        autofocus={ props.autofocus }\n                        readonly={ isReadonly.value }\n                        disabled={ isDisabled.value }\n                        name={ props.name }\n                        placeholder={ props.placeholder }\n                        size={ 1 }\n                        type={ props.type }\n                        onFocus={ onFocus }\n                        onBlur={ () => (isFocused.value = false) }\n                        { ...slotProps }\n                        { ...inputAttrs }\n                      />\n                    )\n\n                    return (\n                      <>\n                        { props.prefix && (\n                          <span class=\"v-text-field__prefix\">\n                            { props.prefix }\n                          </span>\n                        ) }\n\n                        { slots.default ? (\n                          <div\n                            class={ fieldClass }\n                            onClick={ e => emit('click:input', e) }\n                            data-no-activator=\"\"\n                          >\n                            { slots.default() }\n                            { inputNode }\n                          </div>\n                        ) : cloneVNode(inputNode, { class: fieldClass }) }\n\n                        { props.suffix && (\n                          <span class=\"v-text-field__suffix\">\n                            { props.suffix }\n                          </span>\n                        ) }\n                      </>\n                    )\n                  },\n                }}\n              </VField>\n            ),\n            details: hasDetails ? slotProps => (\n              <>\n                { slots.details?.(slotProps) }\n\n                { hasCounter && (\n                  <>\n                    <span />\n\n                    <VCounter\n                      active={ props.persistentCounter || isFocused.value }\n                      value={ counterValue.value }\n                      max={ max.value }\n                      v-slots={ slots.counter }\n                    />\n                  </>\n                ) }\n              </>\n            ) : undefined,\n          }}\n        </VInput>\n      )\n    })\n\n    return forwardRefs({}, vInputRef, vFieldRef, inputRef)\n  },\n})\n\nexport type VTextField = InstanceType<typeof VTextField>\n"],"mappings":"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"}

package/lib/components/VTextField/VTextField.sass

@@ -54,9 +54,10 @@
     cursor: default
     display: flex
     opacity: 0
-    padding-top: var(--v-field-padding-top)
     transition: inherit
     white-space: nowrap
+    padding-top: calc(var(--v-field-padding-top, 4px) + var(--v-input-padding-top, 0))
+    padding-bottom: var(--v-field-padding-bottom, 6px)
 
     .v-field--active &
       opacity: 1