@vuetify/nightly 3.7.4-next.2024-11-06 → 3.7.5-dev.2024-12-16

package/lib/components/VSwitch/VSwitch.css

@@ -1,133 +1,143 @@
-@layer vuetify.components {
-  .v-switch .v-label {
-    padding-inline-start: 10px;
-  }
-  .v-switch__loader {
-    display: flex;
-  }
-  .v-switch__loader .v-progress-circular {
-    color: rgb(var(--v-theme-surface));
-  }
-  .v-switch__track,
-  .v-switch__thumb {
-    transition: none;
-  }
-  .v-selection-control--error:not(.v-selection-control--disabled) .v-switch__track,
-  .v-selection-control--error:not(.v-selection-control--disabled) .v-switch__thumb {
-    background-color: rgb(var(--v-theme-error));
-    color: rgb(var(--v-theme-on-error));
-  }
-  .v-switch__track-true {
-    margin-inline-end: auto;
-  }
-  .v-selection-control:not(.v-selection-control--dirty) .v-switch__track-true {
-    opacity: 0;
-  }
-  .v-switch__track-false {
-    margin-inline-start: auto;
-  }
-  .v-selection-control--dirty .v-switch__track-false {
-    opacity: 0;
-  }
-  .v-switch__track {
-    display: inline-flex;
-    align-items: center;
-    font-size: 0.5rem;
-    padding: 0 5px;
-    background-color: rgb(var(--v-theme-surface-variant));
-    border-radius: 9999px;
-    height: 14px;
-    opacity: 0.6;
-    min-width: 36px;
-    cursor: pointer;
-    transition: 0.2s background-color cubic-bezier(0.4, 0, 0.2, 1);
-  }
-  .v-switch--inset .v-switch__track {
-    border-radius: 9999px;
-    font-size: 0.75rem;
-    height: 32px;
-    min-width: 52px;
-  }
-  .v-switch__thumb {
-    align-items: center;
-    background-color: rgb(var(--v-theme-surface-bright));
-    color: rgb(var(--v-theme-on-surface-bright));
-    border-radius: 50%;
-    display: flex;
-    font-size: 0.75rem;
-    height: 20px;
-    justify-content: center;
-    width: 20px;
-    pointer-events: none;
-    transition: 0.15s 0.05s transform cubic-bezier(0, 0, 0.2, 1), 0.2s color cubic-bezier(0.4, 0, 0.2, 1), 0.2s background-color cubic-bezier(0.4, 0, 0.2, 1);
-    position: relative;
-    overflow: hidden;
-  }
-  .v-switch:not(.v-switch--inset) .v-switch__thumb {
-    box-shadow: 0px 2px 4px -1px var(--v-shadow-key-umbra-opacity, rgba(0, 0, 0, 0.2)), 0px 4px 5px 0px var(--v-shadow-key-penumbra-opacity, rgba(0, 0, 0, 0.14)), 0px 1px 10px 0px var(--v-shadow-key-ambient-opacity, rgba(0, 0, 0, 0.12));
-  }
-  .v-switch.v-switch--flat:not(.v-switch--inset) .v-switch__thumb {
-    background: rgb(var(--v-theme-surface-variant));
-    color: rgb(var(--v-theme-on-surface-variant));
-  }
-  .v-switch.v-switch--flat:not(.v-switch--inset) .v-switch__thumb {
-    box-shadow: 0px 0px 0px 0px var(--v-shadow-key-umbra-opacity, rgba(0, 0, 0, 0.2)), 0px 0px 0px 0px var(--v-shadow-key-penumbra-opacity, rgba(0, 0, 0, 0.14)), 0px 0px 0px 0px var(--v-shadow-key-ambient-opacity, rgba(0, 0, 0, 0.12));
-  }
-  .v-switch--inset .v-switch__thumb {
-    height: 24px;
-    width: 24px;
-    transform: scale(0.6666666667);
-  }
-  .v-switch--inset .v-switch__thumb--filled {
-    transform: none;
-  }
-  .v-switch--inset .v-selection-control--dirty .v-switch__thumb {
-    transform: none;
-    transition: 0.15s 0.05s transform cubic-bezier(0, 0, 0.2, 1);
-  }
-  .v-switch.v-input {
-    flex: 0 1 auto;
-  }
-  .v-switch .v-selection-control {
-    min-height: var(--v-input-control-height);
-  }
-  .v-switch .v-selection-control__input {
-    border-radius: 50%;
-    transition: 0.2s transform cubic-bezier(0.4, 0, 0.2, 1);
-    position: absolute;
-  }
-  .v-locale--is-ltr.v-switch .v-selection-control__input, .v-locale--is-ltr .v-switch .v-selection-control__input {
-    transform: translateX(-10px);
-  }
-  .v-locale--is-rtl.v-switch .v-selection-control__input, .v-locale--is-rtl .v-switch .v-selection-control__input {
-    transform: translateX(10px);
-  }
-  .v-switch .v-selection-control__input .v-icon {
-    position: absolute;
-  }
-  .v-locale--is-ltr.v-switch .v-selection-control--dirty .v-selection-control__input, .v-locale--is-ltr .v-switch .v-selection-control--dirty .v-selection-control__input {
-    transform: translateX(10px);
-  }
-  .v-locale--is-rtl.v-switch .v-selection-control--dirty .v-selection-control__input, .v-locale--is-rtl .v-switch .v-selection-control--dirty .v-selection-control__input {
-    transform: translateX(-10px);
-  }
-  .v-switch.v-switch--indeterminate .v-selection-control__input {
-    transform: scale(0.8);
-  }
-  .v-switch.v-switch--indeterminate .v-switch__thumb {
-    transform: scale(0.75);
-    box-shadow: none;
-  }
-  .v-switch.v-switch--inset .v-selection-control__wrapper {
-    width: auto;
-  }
-  .v-switch.v-input--vertical .v-label {
-    min-width: max-content;
-  }
-  .v-switch.v-input--vertical .v-selection-control__wrapper {
-    transform: rotate(-90deg);
-  }
+.v-switch .v-label {
+  padding-inline-start: 10px;
+}
+
+.v-switch__loader {
+  display: flex;
+}
+.v-switch__loader .v-progress-circular {
+  color: rgb(var(--v-theme-surface));
+}
+
+.v-switch__track,
+.v-switch__thumb {
+  transition: none;
+}
+.v-selection-control--error:not(.v-selection-control--disabled) .v-switch__track,
+.v-selection-control--error:not(.v-selection-control--disabled) .v-switch__thumb {
+  background-color: rgb(var(--v-theme-error));
+  color: rgb(var(--v-theme-on-error));
+}
+
+.v-switch__track-true {
+  margin-inline-end: auto;
+}
+.v-selection-control:not(.v-selection-control--dirty) .v-switch__track-true {
+  opacity: 0;
+}
+
+.v-switch__track-false {
+  margin-inline-start: auto;
+}
+.v-selection-control--dirty .v-switch__track-false {
+  opacity: 0;
+}
+
+.v-switch__track {
+  display: inline-flex;
+  align-items: center;
+  font-size: 0.5rem;
+  padding: 0 5px;
+  background-color: rgb(var(--v-theme-surface-variant));
+  border-radius: 9999px;
+  height: 14px;
+  opacity: 0.6;
+  min-width: 36px;
+  cursor: pointer;
+  transition: 0.2s background-color cubic-bezier(0.4, 0, 0.2, 1);
+}
+.v-switch--inset .v-switch__track {
+  border-radius: 9999px;
+  font-size: 0.75rem;
+  height: 32px;
+  min-width: 52px;
+}
+
+.v-switch__thumb {
+  align-items: center;
+  background-color: rgb(var(--v-theme-surface-bright));
+  color: rgb(var(--v-theme-on-surface-bright));
+  border-radius: 50%;
+  display: flex;
+  font-size: 0.75rem;
+  height: 20px;
+  justify-content: center;
+  width: 20px;
+  pointer-events: none;
+  transition: 0.15s 0.05s transform cubic-bezier(0, 0, 0.2, 1), 0.2s color cubic-bezier(0.4, 0, 0.2, 1), 0.2s background-color cubic-bezier(0.4, 0, 0.2, 1);
+  position: relative;
+  overflow: hidden;
+}
+.v-switch:not(.v-switch--inset) .v-switch__thumb {
+  box-shadow: 0px 2px 4px -1px var(--v-shadow-key-umbra-opacity, rgba(0, 0, 0, 0.2)), 0px 4px 5px 0px var(--v-shadow-key-penumbra-opacity, rgba(0, 0, 0, 0.14)), 0px 1px 10px 0px var(--v-shadow-key-ambient-opacity, rgba(0, 0, 0, 0.12));
+}
+.v-switch.v-switch--flat:not(.v-switch--inset) .v-switch__thumb {
+  background: rgb(var(--v-theme-surface-variant));
+  color: rgb(var(--v-theme-on-surface-variant));
+}
+.v-switch.v-switch--flat:not(.v-switch--inset) .v-switch__thumb {
+  box-shadow: 0px 0px 0px 0px var(--v-shadow-key-umbra-opacity, rgba(0, 0, 0, 0.2)), 0px 0px 0px 0px var(--v-shadow-key-penumbra-opacity, rgba(0, 0, 0, 0.14)), 0px 0px 0px 0px var(--v-shadow-key-ambient-opacity, rgba(0, 0, 0, 0.12));
+}
+.v-switch--inset .v-switch__thumb {
+  height: 24px;
+  width: 24px;
+  transform: scale(0.6666666667);
+}
+.v-switch--inset .v-switch__thumb--filled {
+  transform: none;
+}
+.v-switch--inset .v-selection-control--dirty .v-switch__thumb {
+  transform: none;
+  transition: 0.15s 0.05s transform cubic-bezier(0, 0, 0.2, 1);
+}
+
+.v-switch.v-input {
+  flex: 0 1 auto;
+}
+.v-switch .v-selection-control {
+  min-height: var(--v-input-control-height);
+}
+.v-switch .v-selection-control__input {
+  border-radius: 50%;
+  transition: 0.2s transform cubic-bezier(0.4, 0, 0.2, 1);
+  position: absolute;
+}
+.v-locale--is-ltr.v-switch .v-selection-control__input, .v-locale--is-ltr .v-switch .v-selection-control__input {
+  transform: translateX(-10px);
+}
+
+.v-locale--is-rtl.v-switch .v-selection-control__input, .v-locale--is-rtl .v-switch .v-selection-control__input {
+  transform: translateX(10px);
+}
+
+.v-switch .v-selection-control__input .v-icon {
+  position: absolute;
+}
+.v-locale--is-ltr.v-switch .v-selection-control--dirty .v-selection-control__input, .v-locale--is-ltr .v-switch .v-selection-control--dirty .v-selection-control__input {
+  transform: translateX(10px);
+}
+
+.v-locale--is-rtl.v-switch .v-selection-control--dirty .v-selection-control__input, .v-locale--is-rtl .v-switch .v-selection-control--dirty .v-selection-control__input {
+  transform: translateX(-10px);
+}
+
+.v-switch.v-switch--indeterminate .v-selection-control__input {
+  transform: scale(0.8);
+}
+.v-switch.v-switch--indeterminate .v-switch__thumb {
+  transform: scale(0.75);
+  box-shadow: none;
+}
+.v-switch.v-switch--inset .v-selection-control__wrapper {
+  width: auto;
+}
+.v-switch.v-input--vertical .v-label {
+  min-width: max-content;
+}
+.v-switch.v-input--vertical .v-selection-control__wrapper {
+  transform: rotate(-90deg);
 }
+
 @media (forced-colors: active) {
   .v-switch .v-switch__loader .v-progress-circular {
     color: currentColor;

package/lib/components/VSwitch/VSwitch.mjs

@@ -12,8 +12,8 @@ import { makeVSelectionControlProps, VSelectionControl } from "../VSelectionCont
 import { useFocus } from "../../composables/focus.mjs";
 import { LoaderSlot, useLoader } from "../../composables/loader.mjs";
 import { useProxiedModel } from "../../composables/proxiedModel.mjs"; // Utilities
-import { computed, ref } from 'vue';
-import { filterInputAttrs, genericComponent, getUid, IN_BROWSER, propsFactory, useRender } from "../../util/index.mjs"; // Types
+import { computed, ref, useId } from 'vue';
+import { filterInputAttrs, genericComponent, IN_BROWSER, propsFactory, useRender } from "../../util/index.mjs"; // Types
 export const makeVSwitchProps = propsFactory({
   indeterminate: Boolean,
   inset: Boolean,
@@ -54,7 +54,7 @@ export const VSwitch = genericComponent()({
     const loaderColor = computed(() => {
       return typeof props.loading === 'string' && props.loading !== '' ? props.loading : props.color;
     });
-    const uid = getUid();
+    const uid = useId();
     const id = computed(() => props.id || `switch-${uid}`);
     function onChange() {
       if (indeterminate.value) {

package/lib/components/VSwitch/VSwitch.mjs.map

@@ -1 +1 @@
-{"version":3,"file":"VSwitch.mjs","names":["VScaleTransition","VDefaultsProvider","VIcon","makeVInputProps","VInput","VProgressCircular","makeVSelectionControlProps","VSelectionControl","useFocus","LoaderSlot","useLoader","useProxiedModel","computed","ref","filterInputAttrs","genericComponent","getUid","IN_BROWSER","propsFactory","useRender","makeVSwitchProps","indeterminate","Boolean","inset","flat","loading","type","String","default","VSwitch","name","inheritAttrs","props","emits","focused","value","setup","_ref","attrs","slots","model","loaderClasses","isFocused","focus","blur","control","isForcedColorsModeActive","window","matchMedia","matches","loaderColor","color","uid","id","onChange","onTrackClick","e","stopPropagation","preventDefault","input","click","rootAttrs","controlAttrs","inputProps","filterProps","controlProps","_createVNode","_mergeProps","class","$event","style","_ref2","messagesId","isDisabled","isReadonly","isValid","slotProps","undefined","_ref3","backgroundColorClasses","backgroundColorStyles","_ref4","inputNode","icon","_Fragment","thumb","size","loader","isActive"],"sources":["../../../src/components/VSwitch/VSwitch.tsx"],"sourcesContent":["// Styles\nimport './VSwitch.sass'\n\n// Components\nimport { VScaleTransition } from '@/components/transitions'\nimport { VDefaultsProvider } from '@/components/VDefaultsProvider/VDefaultsProvider'\nimport { VIcon } from '@/components/VIcon'\nimport { makeVInputProps, VInput } from '@/components/VInput/VInput'\nimport { VProgressCircular } from '@/components/VProgressCircular'\nimport { makeVSelectionControlProps, VSelectionControl } from '@/components/VSelectionControl/VSelectionControl'\n\n// Composables\nimport { useFocus } from '@/composables/focus'\nimport { LoaderSlot, useLoader } from '@/composables/loader'\nimport { useProxiedModel } from '@/composables/proxiedModel'\n\n// Utilities\nimport { computed, ref } from 'vue'\nimport { filterInputAttrs, genericComponent, getUid, IN_BROWSER, propsFactory, useRender } from '@/util'\n\n// Types\nimport type { ComputedRef, Ref } from 'vue'\nimport type { VInputSlots } from '@/components/VInput/VInput'\nimport type { VSelectionControlSlots } from '@/components/VSelectionControl/VSelectionControl'\nimport type { IconValue } from '@/composables/icons'\nimport type { LoaderSlotProps } from '@/composables/loader'\nimport type { GenericProps } from '@/util'\n\nexport type VSwitchSlot = {\n  model: Ref<boolean>\n  isValid: ComputedRef<boolean | null>\n}\n\nexport type VSwitchSlots =\n  & VInputSlots\n  & VSelectionControlSlots\n  & {\n    loader: LoaderSlotProps\n    thumb: { icon: IconValue | undefined } & VSwitchSlot\n    'track-false': VSwitchSlot\n    'track-true': VSwitchSlot\n  }\n\nexport const makeVSwitchProps = propsFactory({\n  indeterminate: Boolean,\n  inset: Boolean,\n  flat: Boolean,\n  loading: {\n    type: [Boolean, String],\n    default: false,\n  },\n\n  ...makeVInputProps(),\n  ...makeVSelectionControlProps(),\n}, 'VSwitch')\n\nexport const VSwitch = genericComponent<new <T>(\n  props: {\n    modelValue?: T | null\n    'onUpdate:modelValue'?: (value: T | null) => void\n  },\n  slots: VSwitchSlots,\n) => GenericProps<typeof props, typeof slots>>()({\n  name: 'VSwitch',\n\n  inheritAttrs: false,\n\n  props: makeVSwitchProps(),\n\n  emits: {\n    'update:focused': (focused: boolean) => true,\n    'update:modelValue': (value: any) => true,\n    'update:indeterminate': (value: boolean) => true,\n  },\n\n  setup (props, { attrs, slots }) {\n    const indeterminate = useProxiedModel(props, 'indeterminate')\n    const model = useProxiedModel(props, 'modelValue')\n    const { loaderClasses } = useLoader(props)\n    const { isFocused, focus, blur } = useFocus(props)\n    const control = ref<VSelectionControl>()\n    const isForcedColorsModeActive = IN_BROWSER && window.matchMedia('(forced-colors: active)').matches\n\n    const loaderColor = computed(() => {\n      return typeof props.loading === 'string' && props.loading !== ''\n        ? props.loading\n        : props.color\n    })\n\n    const uid = getUid()\n    const id = computed(() => props.id || `switch-${uid}`)\n\n    function onChange () {\n      if (indeterminate.value) {\n        indeterminate.value = false\n      }\n    }\n    function onTrackClick (e: Event) {\n      e.stopPropagation()\n      e.preventDefault()\n      control.value?.input?.click()\n    }\n\n    useRender(() => {\n      const [rootAttrs, controlAttrs] = filterInputAttrs(attrs)\n      const inputProps = VInput.filterProps(props)\n      const controlProps = VSelectionControl.filterProps(props)\n\n      return (\n        <VInput\n          class={[\n            'v-switch',\n            { 'v-switch--flat': props.flat },\n            { 'v-switch--inset': props.inset },\n            { 'v-switch--indeterminate': indeterminate.value },\n            loaderClasses.value,\n            props.class,\n          ]}\n          { ...rootAttrs }\n          { ...inputProps }\n          v-model={ model.value }\n          id={ id.value }\n          focused={ isFocused.value }\n          style={ props.style }\n        >\n          {{\n            ...slots,\n            default: ({\n              id,\n              messagesId,\n              isDisabled,\n              isReadonly,\n              isValid,\n            }) => {\n              const slotProps = {\n                model,\n                isValid,\n              }\n\n              return (\n                <VSelectionControl\n                  ref={ control }\n                  { ...controlProps }\n                  v-model={ model.value }\n                  id={ id.value }\n                  aria-describedby={ messagesId.value }\n                  type=\"checkbox\"\n                  onUpdate:modelValue={ onChange }\n                  aria-checked={ indeterminate.value ? 'mixed' : undefined }\n                  disabled={ isDisabled.value }\n                  readonly={ isReadonly.value }\n                  onFocus={ focus }\n                  onBlur={ blur }\n                  { ...controlAttrs }\n                >\n                  {{\n                    ...slots,\n                    default: ({ backgroundColorClasses, backgroundColorStyles }) => (\n                      <div\n                        class={[\n                          'v-switch__track',\n                          !isForcedColorsModeActive ? backgroundColorClasses.value : undefined,\n                        ]}\n                        style={ backgroundColorStyles.value }\n                        onClick={ onTrackClick }\n                      >\n                        { slots['track-true'] && (\n                          <div key=\"prepend\" class=\"v-switch__track-true\">\n                            { slots['track-true'](slotProps) }\n                          </div>\n                        )}\n\n                        { slots['track-false'] && (\n                          <div key=\"append\" class=\"v-switch__track-false\">\n                            { slots['track-false'](slotProps) }\n                          </div>\n                        )}\n                      </div>\n                    ),\n                    input: ({ inputNode, icon, backgroundColorClasses, backgroundColorStyles }) => (\n                      <>\n                        { inputNode }\n                        <div\n                          class={[\n                            'v-switch__thumb',\n                            { 'v-switch__thumb--filled': icon || props.loading },\n                            props.inset || isForcedColorsModeActive ? undefined : backgroundColorClasses.value,\n                          ]}\n                          style={ props.inset ? undefined : backgroundColorStyles.value }\n                        >\n                          { slots.thumb ? (\n                            <VDefaultsProvider\n                              defaults={{\n                                VIcon: {\n                                  icon,\n                                  size: 'x-small',\n                                },\n                              }}\n                            >\n                              { slots.thumb({ ...slotProps, icon }) }\n                            </VDefaultsProvider>\n                          ) : (\n                            <VScaleTransition>\n                              { !props.loading ? (\n                                (icon && (\n                                  <VIcon\n                                    key={ String(icon) }\n                                    icon={ icon }\n                                    size=\"x-small\"\n                                  />\n                                ))) : (\n                                <LoaderSlot\n                                  name=\"v-switch\"\n                                  active\n                                  color={ isValid.value === false ? undefined : loaderColor.value }\n                                >\n                                  { slotProps => (\n                                    slots.loader\n                                      ? slots.loader(slotProps)\n                                      : (\n                                        <VProgressCircular\n                                          active={ slotProps.isActive }\n                                          color={ slotProps.color }\n                                          indeterminate\n                                          size=\"16\"\n                                          width=\"2\"\n                                        />\n                                      )\n                                  )}\n                                </LoaderSlot>\n                              )}\n                            </VScaleTransition>\n                          )}\n                        </div>\n                      </>\n                    ),\n                  }}\n                </VSelectionControl>\n              )\n            },\n          }}\n        </VInput>\n      )\n    })\n\n    return {}\n  },\n})\n\nexport type VSwitch = InstanceType<typeof VSwitch>\n"],"mappings":"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","ignoreList":[]}
+{"version":3,"file":"VSwitch.mjs","names":["VScaleTransition","VDefaultsProvider","VIcon","makeVInputProps","VInput","VProgressCircular","makeVSelectionControlProps","VSelectionControl","useFocus","LoaderSlot","useLoader","useProxiedModel","computed","ref","useId","filterInputAttrs","genericComponent","IN_BROWSER","propsFactory","useRender","makeVSwitchProps","indeterminate","Boolean","inset","flat","loading","type","String","default","VSwitch","name","inheritAttrs","props","emits","focused","value","setup","_ref","attrs","slots","model","loaderClasses","isFocused","focus","blur","control","isForcedColorsModeActive","window","matchMedia","matches","loaderColor","color","uid","id","onChange","onTrackClick","e","stopPropagation","preventDefault","input","click","rootAttrs","controlAttrs","inputProps","filterProps","controlProps","_createVNode","_mergeProps","class","$event","style","_ref2","messagesId","isDisabled","isReadonly","isValid","slotProps","undefined","_ref3","backgroundColorClasses","backgroundColorStyles","_ref4","inputNode","icon","_Fragment","thumb","size","loader","isActive"],"sources":["../../../src/components/VSwitch/VSwitch.tsx"],"sourcesContent":["// Styles\nimport './VSwitch.sass'\n\n// Components\nimport { VScaleTransition } from '@/components/transitions'\nimport { VDefaultsProvider } from '@/components/VDefaultsProvider/VDefaultsProvider'\nimport { VIcon } from '@/components/VIcon'\nimport { makeVInputProps, VInput } from '@/components/VInput/VInput'\nimport { VProgressCircular } from '@/components/VProgressCircular'\nimport { makeVSelectionControlProps, VSelectionControl } from '@/components/VSelectionControl/VSelectionControl'\n\n// Composables\nimport { useFocus } from '@/composables/focus'\nimport { LoaderSlot, useLoader } from '@/composables/loader'\nimport { useProxiedModel } from '@/composables/proxiedModel'\n\n// Utilities\nimport { computed, ref, useId } from 'vue'\nimport { filterInputAttrs, genericComponent, IN_BROWSER, propsFactory, useRender } from '@/util'\n\n// Types\nimport type { ComputedRef, Ref } from 'vue'\nimport type { VInputSlots } from '@/components/VInput/VInput'\nimport type { VSelectionControlSlots } from '@/components/VSelectionControl/VSelectionControl'\nimport type { IconValue } from '@/composables/icons'\nimport type { LoaderSlotProps } from '@/composables/loader'\nimport type { GenericProps } from '@/util'\n\nexport type VSwitchSlot = {\n  model: Ref<boolean>\n  isValid: ComputedRef<boolean | null>\n}\n\nexport type VSwitchSlots =\n  & VInputSlots\n  & VSelectionControlSlots\n  & {\n    loader: LoaderSlotProps\n    thumb: { icon: IconValue | undefined } & VSwitchSlot\n    'track-false': VSwitchSlot\n    'track-true': VSwitchSlot\n  }\n\nexport const makeVSwitchProps = propsFactory({\n  indeterminate: Boolean,\n  inset: Boolean,\n  flat: Boolean,\n  loading: {\n    type: [Boolean, String],\n    default: false,\n  },\n\n  ...makeVInputProps(),\n  ...makeVSelectionControlProps(),\n}, 'VSwitch')\n\nexport const VSwitch = genericComponent<new <T>(\n  props: {\n    modelValue?: T | null\n    'onUpdate:modelValue'?: (value: T | null) => void\n  },\n  slots: VSwitchSlots,\n) => GenericProps<typeof props, typeof slots>>()({\n  name: 'VSwitch',\n\n  inheritAttrs: false,\n\n  props: makeVSwitchProps(),\n\n  emits: {\n    'update:focused': (focused: boolean) => true,\n    'update:modelValue': (value: any) => true,\n    'update:indeterminate': (value: boolean) => true,\n  },\n\n  setup (props, { attrs, slots }) {\n    const indeterminate = useProxiedModel(props, 'indeterminate')\n    const model = useProxiedModel(props, 'modelValue')\n    const { loaderClasses } = useLoader(props)\n    const { isFocused, focus, blur } = useFocus(props)\n    const control = ref<VSelectionControl>()\n    const isForcedColorsModeActive = IN_BROWSER && window.matchMedia('(forced-colors: active)').matches\n\n    const loaderColor = computed(() => {\n      return typeof props.loading === 'string' && props.loading !== ''\n        ? props.loading\n        : props.color\n    })\n\n    const uid = useId()\n    const id = computed(() => props.id || `switch-${uid}`)\n\n    function onChange () {\n      if (indeterminate.value) {\n        indeterminate.value = false\n      }\n    }\n    function onTrackClick (e: Event) {\n      e.stopPropagation()\n      e.preventDefault()\n      control.value?.input?.click()\n    }\n\n    useRender(() => {\n      const [rootAttrs, controlAttrs] = filterInputAttrs(attrs)\n      const inputProps = VInput.filterProps(props)\n      const controlProps = VSelectionControl.filterProps(props)\n\n      return (\n        <VInput\n          class={[\n            'v-switch',\n            { 'v-switch--flat': props.flat },\n            { 'v-switch--inset': props.inset },\n            { 'v-switch--indeterminate': indeterminate.value },\n            loaderClasses.value,\n            props.class,\n          ]}\n          { ...rootAttrs }\n          { ...inputProps }\n          v-model={ model.value }\n          id={ id.value }\n          focused={ isFocused.value }\n          style={ props.style }\n        >\n          {{\n            ...slots,\n            default: ({\n              id,\n              messagesId,\n              isDisabled,\n              isReadonly,\n              isValid,\n            }) => {\n              const slotProps = {\n                model,\n                isValid,\n              }\n\n              return (\n                <VSelectionControl\n                  ref={ control }\n                  { ...controlProps }\n                  v-model={ model.value }\n                  id={ id.value }\n                  aria-describedby={ messagesId.value }\n                  type=\"checkbox\"\n                  onUpdate:modelValue={ onChange }\n                  aria-checked={ indeterminate.value ? 'mixed' : undefined }\n                  disabled={ isDisabled.value }\n                  readonly={ isReadonly.value }\n                  onFocus={ focus }\n                  onBlur={ blur }\n                  { ...controlAttrs }\n                >\n                  {{\n                    ...slots,\n                    default: ({ backgroundColorClasses, backgroundColorStyles }) => (\n                      <div\n                        class={[\n                          'v-switch__track',\n                          !isForcedColorsModeActive ? backgroundColorClasses.value : undefined,\n                        ]}\n                        style={ backgroundColorStyles.value }\n                        onClick={ onTrackClick }\n                      >\n                        { slots['track-true'] && (\n                          <div key=\"prepend\" class=\"v-switch__track-true\">\n                            { slots['track-true'](slotProps) }\n                          </div>\n                        )}\n\n                        { slots['track-false'] && (\n                          <div key=\"append\" class=\"v-switch__track-false\">\n                            { slots['track-false'](slotProps) }\n                          </div>\n                        )}\n                      </div>\n                    ),\n                    input: ({ inputNode, icon, backgroundColorClasses, backgroundColorStyles }) => (\n                      <>\n                        { inputNode }\n                        <div\n                          class={[\n                            'v-switch__thumb',\n                            { 'v-switch__thumb--filled': icon || props.loading },\n                            props.inset || isForcedColorsModeActive ? undefined : backgroundColorClasses.value,\n                          ]}\n                          style={ props.inset ? undefined : backgroundColorStyles.value }\n                        >\n                          { slots.thumb ? (\n                            <VDefaultsProvider\n                              defaults={{\n                                VIcon: {\n                                  icon,\n                                  size: 'x-small',\n                                },\n                              }}\n                            >\n                              { slots.thumb({ ...slotProps, icon }) }\n                            </VDefaultsProvider>\n                          ) : (\n                            <VScaleTransition>\n                              { !props.loading ? (\n                                (icon && (\n                                  <VIcon\n                                    key={ String(icon) }\n                                    icon={ icon }\n                                    size=\"x-small\"\n                                  />\n                                ))) : (\n                                <LoaderSlot\n                                  name=\"v-switch\"\n                                  active\n                                  color={ isValid.value === false ? undefined : loaderColor.value }\n                                >\n                                  { slotProps => (\n                                    slots.loader\n                                      ? slots.loader(slotProps)\n                                      : (\n                                        <VProgressCircular\n                                          active={ slotProps.isActive }\n                                          color={ slotProps.color }\n                                          indeterminate\n                                          size=\"16\"\n                                          width=\"2\"\n                                        />\n                                      )\n                                  )}\n                                </LoaderSlot>\n                              )}\n                            </VScaleTransition>\n                          )}\n                        </div>\n                      </>\n                    ),\n                  }}\n                </VSelectionControl>\n              )\n            },\n          }}\n        </VInput>\n      )\n    })\n\n    return {}\n  },\n})\n\nexport type VSwitch = InstanceType<typeof VSwitch>\n"],"mappings":"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","ignoreList":[]}

package/lib/components/VSystemBar/VSystemBar.css

@@ -1,46 +1,44 @@
-@layer vuetify.components {
-  .v-system-bar {
-    align-items: center;
-    display: flex;
-    flex: 1 1 auto;
-    height: 24px;
-    justify-content: flex-end;
-    max-width: 100%;
-    padding-inline: 8px;
-    position: relative;
-    text-align: end;
-    width: 100%;
-  }
-  .v-system-bar .v-icon {
-    opacity: var(--v-medium-emphasis-opacity);
-  }
-  .v-system-bar {
-    box-shadow: 0px 0px 0px 0px var(--v-shadow-key-umbra-opacity, rgba(0, 0, 0, 0.2)), 0px 0px 0px 0px var(--v-shadow-key-penumbra-opacity, rgba(0, 0, 0, 0.14)), 0px 0px 0px 0px var(--v-shadow-key-ambient-opacity, rgba(0, 0, 0, 0.12));
-  }
-  .v-system-bar--absolute {
-    position: absolute;
-  }
-  .v-system-bar--fixed {
-    position: fixed;
-  }
-  .v-system-bar {
-    background: rgba(var(--v-theme-surface-light));
-    color: rgba(var(--v-theme-on-surface-light), var(--v-high-emphasis-opacity));
-  }
-  .v-system-bar {
-    font-size: 0.75rem;
-    font-weight: 400;
-    letter-spacing: 0.0333333333em;
-    line-height: 1.667;
-    text-transform: none;
-  }
-  .v-system-bar--rounded {
-    border-radius: 0;
-  }
-  .v-system-bar--window {
-    height: 32px;
-  }
-  .v-system-bar:not(.v-system-bar--absolute) {
-    padding-inline-end: calc(var(--v-scrollbar-offset) + 8px);
-  }
+.v-system-bar {
+  align-items: center;
+  display: flex;
+  flex: 1 1 auto;
+  height: 24px;
+  justify-content: flex-end;
+  max-width: 100%;
+  padding-inline: 8px;
+  position: relative;
+  text-align: end;
+  width: 100%;
+}
+.v-system-bar .v-icon {
+  opacity: var(--v-medium-emphasis-opacity);
+}
+.v-system-bar {
+  box-shadow: 0px 0px 0px 0px var(--v-shadow-key-umbra-opacity, rgba(0, 0, 0, 0.2)), 0px 0px 0px 0px var(--v-shadow-key-penumbra-opacity, rgba(0, 0, 0, 0.14)), 0px 0px 0px 0px var(--v-shadow-key-ambient-opacity, rgba(0, 0, 0, 0.12));
+}
+.v-system-bar--absolute {
+  position: absolute;
+}
+.v-system-bar--fixed {
+  position: fixed;
+}
+.v-system-bar {
+  background: rgba(var(--v-theme-surface-light));
+  color: rgba(var(--v-theme-on-surface-light), var(--v-high-emphasis-opacity));
+}
+.v-system-bar {
+  font-size: 0.75rem;
+  font-weight: 400;
+  letter-spacing: 0.0333333333em;
+  line-height: 1.667;
+  text-transform: none;
+}
+.v-system-bar--rounded {
+  border-radius: 0;
+}
+.v-system-bar--window {
+  height: 32px;
+}
+.v-system-bar:not(.v-system-bar--absolute) {
+  padding-inline-end: calc(var(--v-scrollbar-offset) + 8px);
 }