vuetify 3.6.0-alpha.2 → 3.6.0

package/lib/components/VDialog/VDialog.mjs.map

@@ -1 +1 @@
-{"version":3,"file":"VDialog.mjs","names":["VDialogTransition","VDefaultsProvider","VOverlay","makeVOverlayProps","forwardRefs","useProxiedModel","useScopeId","mergeProps","nextTick","ref","watch","focusableChildren","genericComponent","IN_BROWSER","propsFactory","useRender","makeVDialogProps","fullscreen","Boolean","retainFocus","type","default","scrollable","origin","scrollStrategy","transition","component","zIndex","VDialog","name","props","emits","e","value","afterLeave","setup","_ref","slots","isActive","scopeId","overlay","onFocusin","before","relatedTarget","after","target","contentEl","globalTop","document","includes","contains","focusable","length","firstElement","lastElement","focus","val","addEventListener","removeEventListener","immediate","onAfterEnter","activeElement","preventScroll","activatorEl","overlayProps","filterProps","activatorProps","String","contentProps","tabindex","_createVNode","_mergeProps","class","style","$event","activator","_len","arguments","args","Array","_key"],"sources":["../../../src/components/VDialog/VDialog.tsx"],"sourcesContent":["// Styles\nimport './VDialog.sass'\n\n// Components\nimport { VDialogTransition } from '@/components/transitions'\nimport { VDefaultsProvider } from '@/components/VDefaultsProvider'\nimport { VOverlay } from '@/components/VOverlay'\nimport { makeVOverlayProps } from '@/components/VOverlay/VOverlay'\n\n// Composables\nimport { forwardRefs } from '@/composables/forwardRefs'\nimport { useProxiedModel } from '@/composables/proxiedModel'\nimport { useScopeId } from '@/composables/scopeId'\n\n// Utilities\nimport { mergeProps, nextTick, ref, watch } from 'vue'\nimport { focusableChildren, genericComponent, IN_BROWSER, propsFactory, useRender } from '@/util'\n\n// Types\nimport type { Component } from 'vue'\nimport type { OverlaySlots } from '@/components/VOverlay/VOverlay'\n\nexport const makeVDialogProps = propsFactory({\n  fullscreen: Boolean,\n  retainFocus: {\n    type: Boolean,\n    default: true,\n  },\n  scrollable: Boolean,\n\n  ...makeVOverlayProps({\n    origin: 'center center' as const,\n    scrollStrategy: 'block' as const,\n    transition: { component: VDialogTransition as Component },\n    zIndex: 2400,\n  }),\n}, 'VDialog')\n\nexport const VDialog = genericComponent<OverlaySlots>()({\n  name: 'VDialog',\n\n  props: makeVDialogProps(),\n\n  emits: {\n    'click:outside': (e: MouseEvent) => true,\n    'update:modelValue': (value: boolean) => true,\n    afterLeave: () => true,\n  },\n\n  setup (props, { slots }) {\n    const isActive = useProxiedModel(props, 'modelValue')\n    const { scopeId } = useScopeId()\n\n    const overlay = ref<VOverlay>()\n    function onFocusin (e: FocusEvent) {\n      const before = e.relatedTarget as HTMLElement | null\n      const after = e.target as HTMLElement | null\n\n      if (\n        before !== after &&\n        overlay.value?.contentEl &&\n        // We're the topmost dialog\n        overlay.value?.globalTop &&\n        // It isn't the document or the dialog body\n        ![document, overlay.value.contentEl].includes(after!) &&\n        // It isn't inside the dialog body\n        !overlay.value.contentEl.contains(after)\n      ) {\n        const focusable = focusableChildren(overlay.value.contentEl)\n\n        if (!focusable.length) return\n\n        const firstElement = focusable[0]\n        const lastElement = focusable[focusable.length - 1]\n\n        if (before === firstElement) {\n          lastElement.focus()\n        } else {\n          firstElement.focus()\n        }\n      }\n    }\n\n    if (IN_BROWSER) {\n      watch(() => isActive.value && props.retainFocus, val => {\n        val\n          ? document.addEventListener('focusin', onFocusin)\n          : document.removeEventListener('focusin', onFocusin)\n      }, { immediate: true })\n    }\n\n    function onAfterEnter () {\n      if (overlay.value?.contentEl && !overlay.value.contentEl.contains(document.activeElement)) {\n        overlay.value.contentEl.focus({ preventScroll: true })\n      }\n    }\n\n    watch(isActive, async val => {\n      if (!val) {\n        await nextTick()\n        overlay.value!.activatorEl?.focus({ preventScroll: true })\n      }\n    })\n\n    useRender(() => {\n      const overlayProps = VOverlay.filterProps(props)\n      const activatorProps = mergeProps({\n        'aria-haspopup': 'dialog',\n        'aria-expanded': String(isActive.value),\n      }, props.activatorProps)\n      const contentProps = mergeProps({\n        tabindex: -1,\n      }, props.contentProps)\n\n      return (\n        <VOverlay\n          ref={ overlay }\n          class={[\n            'v-dialog',\n            {\n              'v-dialog--fullscreen': props.fullscreen,\n              'v-dialog--scrollable': props.scrollable,\n            },\n            props.class,\n          ]}\n          style={ props.style }\n          { ...overlayProps }\n          v-model={ isActive.value }\n          aria-modal=\"true\"\n          activatorProps={ activatorProps }\n          contentProps={ contentProps }\n          role=\"dialog\"\n          onAfterEnter={ onAfterEnter }\n          { ...scopeId }\n        >\n          {{\n            activator: slots.activator,\n            default: (...args) => (\n              <VDefaultsProvider root=\"VDialog\">\n                { slots.default?.(...args) }\n              </VDefaultsProvider>\n            ),\n          }}\n        </VOverlay>\n      )\n    })\n\n    return forwardRefs({}, overlay)\n  },\n})\n\nexport type VDialog = InstanceType<typeof VDialog>\n"],"mappings":"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","ignoreList":[]}
+{"version":3,"file":"VDialog.mjs","names":["VDialogTransition","VDefaultsProvider","VOverlay","makeVOverlayProps","forwardRefs","useProxiedModel","useScopeId","mergeProps","nextTick","ref","watch","focusableChildren","genericComponent","IN_BROWSER","propsFactory","useRender","makeVDialogProps","fullscreen","Boolean","retainFocus","type","default","scrollable","origin","scrollStrategy","transition","component","zIndex","VDialog","name","props","emits","value","afterLeave","setup","_ref","emit","slots","isActive","scopeId","overlay","onFocusin","e","before","relatedTarget","after","target","contentEl","globalTop","document","includes","contains","focusable","length","firstElement","lastElement","focus","val","addEventListener","removeEventListener","immediate","onAfterEnter","activeElement","preventScroll","onAfterLeave","activatorEl","overlayProps","filterProps","activatorProps","String","contentProps","tabindex","_createVNode","_mergeProps","class","style","$event","activator","_len","arguments","args","Array","_key"],"sources":["../../../src/components/VDialog/VDialog.tsx"],"sourcesContent":["// Styles\nimport './VDialog.sass'\n\n// Components\nimport { VDialogTransition } from '@/components/transitions'\nimport { VDefaultsProvider } from '@/components/VDefaultsProvider'\nimport { VOverlay } from '@/components/VOverlay'\nimport { makeVOverlayProps } from '@/components/VOverlay/VOverlay'\n\n// Composables\nimport { forwardRefs } from '@/composables/forwardRefs'\nimport { useProxiedModel } from '@/composables/proxiedModel'\nimport { useScopeId } from '@/composables/scopeId'\n\n// Utilities\nimport { mergeProps, nextTick, ref, watch } from 'vue'\nimport { focusableChildren, genericComponent, IN_BROWSER, propsFactory, useRender } from '@/util'\n\n// Types\nimport type { Component } from 'vue'\nimport type { OverlaySlots } from '@/components/VOverlay/VOverlay'\n\nexport const makeVDialogProps = propsFactory({\n  fullscreen: Boolean,\n  retainFocus: {\n    type: Boolean,\n    default: true,\n  },\n  scrollable: Boolean,\n\n  ...makeVOverlayProps({\n    origin: 'center center' as const,\n    scrollStrategy: 'block' as const,\n    transition: { component: VDialogTransition as Component },\n    zIndex: 2400,\n  }),\n}, 'VDialog')\n\nexport const VDialog = genericComponent<OverlaySlots>()({\n  name: 'VDialog',\n\n  props: makeVDialogProps(),\n\n  emits: {\n    'update:modelValue': (value: boolean) => true,\n    afterLeave: () => true,\n  },\n\n  setup (props, { emit, slots }) {\n    const isActive = useProxiedModel(props, 'modelValue')\n    const { scopeId } = useScopeId()\n\n    const overlay = ref<VOverlay>()\n    function onFocusin (e: FocusEvent) {\n      const before = e.relatedTarget as HTMLElement | null\n      const after = e.target as HTMLElement | null\n\n      if (\n        before !== after &&\n        overlay.value?.contentEl &&\n        // We're the topmost dialog\n        overlay.value?.globalTop &&\n        // It isn't the document or the dialog body\n        ![document, overlay.value.contentEl].includes(after!) &&\n        // It isn't inside the dialog body\n        !overlay.value.contentEl.contains(after)\n      ) {\n        const focusable = focusableChildren(overlay.value.contentEl)\n\n        if (!focusable.length) return\n\n        const firstElement = focusable[0]\n        const lastElement = focusable[focusable.length - 1]\n\n        if (before === firstElement) {\n          lastElement.focus()\n        } else {\n          firstElement.focus()\n        }\n      }\n    }\n\n    if (IN_BROWSER) {\n      watch(() => isActive.value && props.retainFocus, val => {\n        val\n          ? document.addEventListener('focusin', onFocusin)\n          : document.removeEventListener('focusin', onFocusin)\n      }, { immediate: true })\n    }\n\n    function onAfterEnter () {\n      if (overlay.value?.contentEl && !overlay.value.contentEl.contains(document.activeElement)) {\n        overlay.value.contentEl.focus({ preventScroll: true })\n      }\n    }\n\n    function onAfterLeave () {\n      emit('afterLeave')\n    }\n\n    watch(isActive, async val => {\n      if (!val) {\n        await nextTick()\n        overlay.value!.activatorEl?.focus({ preventScroll: true })\n      }\n    })\n\n    useRender(() => {\n      const overlayProps = VOverlay.filterProps(props)\n      const activatorProps = mergeProps({\n        'aria-haspopup': 'dialog',\n        'aria-expanded': String(isActive.value),\n      }, props.activatorProps)\n      const contentProps = mergeProps({\n        tabindex: -1,\n      }, props.contentProps)\n\n      return (\n        <VOverlay\n          ref={ overlay }\n          class={[\n            'v-dialog',\n            {\n              'v-dialog--fullscreen': props.fullscreen,\n              'v-dialog--scrollable': props.scrollable,\n            },\n            props.class,\n          ]}\n          style={ props.style }\n          { ...overlayProps }\n          v-model={ isActive.value }\n          aria-modal=\"true\"\n          activatorProps={ activatorProps }\n          contentProps={ contentProps }\n          role=\"dialog\"\n          onAfterEnter={ onAfterEnter }\n          onAfterLeave={ onAfterLeave }\n          { ...scopeId }\n        >\n          {{\n            activator: slots.activator,\n            default: (...args) => (\n              <VDefaultsProvider root=\"VDialog\">\n                { slots.default?.(...args) }\n              </VDefaultsProvider>\n            ),\n          }}\n        </VOverlay>\n      )\n    })\n\n    return forwardRefs({}, overlay)\n  },\n})\n\nexport type VDialog = InstanceType<typeof VDialog>\n"],"mappings":"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","ignoreList":[]}

package/lib/components/VDialog/VDialog.sass

@@ -1,83 +1,86 @@
 @use '../../styles/tools'
 @use './variables' as *
 
-// Block
-.v-dialog
-  align-items: center
-  justify-content: center
-  margin: auto
-
-  > .v-overlay__content
-    max-height: calc(100% - #{$dialog-margin * 2})
-    width: calc(100% - #{$dialog-margin * 2})
-    max-width: calc(100% - #{$dialog-margin * 2})
-    margin: $dialog-margin
+@include tools.layer('components')
+  .v-dialog
+    align-items: center
+    justify-content: center
+    margin: auto
 
-    &,
-    > form
-      display: flex
-      flex-direction: column
-      min-height: 0
+    > .v-overlay__content
+      max-height: calc(100% - #{$dialog-margin * 2})
+      width: calc(100% - #{$dialog-margin * 2})
+      max-width: calc(100% - #{$dialog-margin * 2})
+      margin: $dialog-margin
 
-      > .v-card,
-      > .v-sheet
-        --v-scrollbar-offset: 0px
-        border-radius: $dialog-border-radius
-        overflow-y: auto
-
-        @include tools.elevation($dialog-elevation)
-
-      > .v-card
+      &,
+      > form
         display: flex
         flex-direction: column
+        min-height: 0
 
-        > .v-card-item
-          padding: $dialog-card-header-padding
+        > .v-card,
+        > .v-sheet
+          --v-scrollbar-offset: 0px
+          border-radius: $dialog-border-radius
+          overflow-y: auto
 
-          + .v-card-text
-            padding-top: $dialog-card-header-text-padding-top
+          @include tools.elevation($dialog-elevation)
 
-        > .v-card-text
-          font-size: inherit
-          letter-spacing: $dialog-card-text-letter-spacing
-          line-height: inherit
-          padding: $dialog-card-text-padding
-
-.v-dialog--fullscreen
-  --v-scrollbar-offset: 0px
-
-  > .v-overlay__content
-    border-radius: 0
-    margin: 0
-    padding: 0
-    width: 100%
-    height: 100%
-    max-width: 100%
-    max-height: 100%
-    overflow-y: auto
-    top: 0
-    left: 0
+        > .v-card
+          display: flex
+          flex-direction: column
+
+          > .v-card-item
+            padding: $dialog-card-header-padding
+
+            + .v-card-text
+              padding-top: $dialog-card-header-text-padding-top
+
+          > .v-card-text
+            font-size: inherit
+            letter-spacing: $dialog-card-text-letter-spacing
+            line-height: inherit
+            padding: $dialog-card-text-padding
+
+          > .v-card-actions
+            justify-content: $dialog-card-actions-justify
+
+  .v-dialog--fullscreen
+    --v-scrollbar-offset: 0px
 
+    > .v-overlay__content
+      border-radius: 0
+      margin: 0
+      padding: 0
+      width: 100%
+      height: 100%
+      max-width: 100%
+      max-height: 100%
+      overflow-y: auto
+      top: 0
+      left: 0
+
+      &,
+      > form
+        > .v-card,
+        > .v-sheet
+          min-height: 100%
+          min-width: 100%
+          border-radius: 0
+
+  .v-dialog--scrollable > .v-overlay__content
     &,
     > form
-      > .v-card,
-      > .v-sheet
-        min-height: 100%
-        min-width: 100%
-        border-radius: 0
-
-.v-dialog--scrollable > .v-overlay__content
-  &,
-  > form
-    display: flex
-
-    > .v-card
       display: flex
-      flex: 1 1 100%
-      flex-direction: column
-      max-height: 100%
-      max-width: 100%
 
-      > .v-card-text
-        backface-visibility: hidden
-        overflow-y: auto
+      > .v-card
+        display: flex
+        flex: 1 1 100%
+        flex-direction: column
+        max-height: 100%
+        max-width: 100%
+
+        > .v-card-text
+          backface-visibility: hidden
+          overflow-y: auto

package/lib/components/VDialog/__test__/VDialog.spec.cy.mjs

@@ -0,0 +1,39 @@
+import { createVNode as _createVNode, createTextVNode as _createTextVNode } from "vue";
+/// <reference types="../../../../types/cypress" />
+// Components
+import { VDialog } from "../index.mjs"; // Utilities
+import { ref } from 'vue';
+
+// Tests
+describe('VDialog', () => {
+  it('should render correctly', () => {
+    const model = ref(false);
+    cy.mount(() => _createVNode(VDialog, {
+      "modelValue": model.value,
+      "onUpdate:modelValue": $event => model.value = $event,
+      "data-test": "dialog"
+    }, {
+      default: () => [_createVNode("div", {
+        "data-test": "content"
+      }, [_createTextVNode("Content")])]
+    })).get('[data-test="dialog"]').should('not.exist').then(() => {
+      model.value = true;
+    }).get('[data-test="dialog"]').should('be.visible').get('[data-test="content"]').should('be.visible').get('body').click().then(() => {
+      expect(model.value).to.be.false;
+    }).get('[data-test="dialog"]').should('not.exist').get('[data-test="content"]').should('not.exist');
+  });
+  it('should emit afterLeave', () => {
+    const model = ref(true);
+    const onAfterLeave = cy.spy().as('afterLeave');
+    cy.mount(() => _createVNode(VDialog, {
+      "modelValue": model.value,
+      "onUpdate:modelValue": $event => model.value = $event,
+      "onAfterLeave": onAfterLeave
+    }, {
+      default: () => [_createVNode("div", {
+        "data-test": "content"
+      }, [_createTextVNode("Content")])]
+    })).get('body').click().get('@afterLeave').should('have.been.calledOnce');
+  });
+});
+//# sourceMappingURL=VDialog.spec.cy.mjs.map

package/lib/components/VDialog/__test__/VDialog.spec.cy.mjs.map

@@ -0,0 +1 @@
+{"version":3,"file":"VDialog.spec.cy.mjs","names":["VDialog","ref","describe","it","model","cy","mount","_createVNode","value","$event","default","_createTextVNode","get","should","then","click","expect","to","be","false","onAfterLeave","spy","as"],"sources":["../../../../src/components/VDialog/__test__/VDialog.spec.cy.tsx"],"sourcesContent":["/// <reference types=\"../../../../types/cypress\" />\n\n// Components\nimport { VDialog } from '..'\n\n// Utilities\nimport { ref } from 'vue'\n\n// Tests\ndescribe('VDialog', () => {\n  it('should render correctly', () => {\n    const model = ref(false)\n    cy.mount(() => (\n      <VDialog v-model={ model.value } data-test=\"dialog\">\n        <div data-test=\"content\">Content</div>\n      </VDialog>\n    )).get('[data-test=\"dialog\"]').should('not.exist')\n      .then(() => { model.value = true })\n      .get('[data-test=\"dialog\"]').should('be.visible')\n      .get('[data-test=\"content\"]').should('be.visible')\n      .get('body').click()\n      .then(() => {\n        expect(model.value).to.be.false\n      })\n      .get('[data-test=\"dialog\"]').should('not.exist')\n      .get('[data-test=\"content\"]').should('not.exist')\n  })\n\n  it('should emit afterLeave', () => {\n    const model = ref(true)\n    const onAfterLeave = cy.spy().as('afterLeave')\n    cy.mount(() => (\n      <VDialog v-model={ model.value } onAfterLeave={ onAfterLeave }>\n        <div data-test=\"content\">Content</div>\n      </VDialog>\n    )).get('body').click()\n      .get('@afterLeave').should('have.been.calledOnce')\n  })\n})\n"],"mappings":";AAAA;AAEA;AAAA,SACSA,OAAO,wBAEhB;AACA,SAASC,GAAG,QAAQ,KAAK;;AAEzB;AACAC,QAAQ,CAAC,SAAS,EAAE,MAAM;EACxBC,EAAE,CAAC,yBAAyB,EAAE,MAAM;IAClC,MAAMC,KAAK,GAAGH,GAAG,CAAC,KAAK,CAAC;IACxBI,EAAE,CAACC,KAAK,CAAC,MAAAC,YAAA,CAAAP,OAAA;MAAA,cACYI,KAAK,CAACI,KAAK;MAAA,uBAAAC,MAAA,IAAXL,KAAK,CAACI,KAAK,GAAAC,MAAA;MAAA;IAAA;MAAAC,OAAA,EAAAA,CAAA,MAAAH,YAAA;QAAA;MAAA,IAAAI,gBAAA;IAAA,EAG/B,CAAC,CAACC,GAAG,CAAC,sBAAsB,CAAC,CAACC,MAAM,CAAC,WAAW,CAAC,CAC/CC,IAAI,CAAC,MAAM;MAAEV,KAAK,CAACI,KAAK,GAAG,IAAI;IAAC,CAAC,CAAC,CAClCI,GAAG,CAAC,sBAAsB,CAAC,CAACC,MAAM,CAAC,YAAY,CAAC,CAChDD,GAAG,CAAC,uBAAuB,CAAC,CAACC,MAAM,CAAC,YAAY,CAAC,CACjDD,GAAG,CAAC,MAAM,CAAC,CAACG,KAAK,CAAC,CAAC,CACnBD,IAAI,CAAC,MAAM;MACVE,MAAM,CAACZ,KAAK,CAACI,KAAK,CAAC,CAACS,EAAE,CAACC,EAAE,CAACC,KAAK;IACjC,CAAC,CAAC,CACDP,GAAG,CAAC,sBAAsB,CAAC,CAACC,MAAM,CAAC,WAAW,CAAC,CAC/CD,GAAG,CAAC,uBAAuB,CAAC,CAACC,MAAM,CAAC,WAAW,CAAC;EACrD,CAAC,CAAC;EAEFV,EAAE,CAAC,wBAAwB,EAAE,MAAM;IACjC,MAAMC,KAAK,GAAGH,GAAG,CAAC,IAAI,CAAC;IACvB,MAAMmB,YAAY,GAAGf,EAAE,CAACgB,GAAG,CAAC,CAAC,CAACC,EAAE,CAAC,YAAY,CAAC;IAC9CjB,EAAE,CAACC,KAAK,CAAC,MAAAC,YAAA,CAAAP,OAAA;MAAA,cACYI,KAAK,CAACI,KAAK;MAAA,uBAAAC,MAAA,IAAXL,KAAK,CAACI,KAAK,GAAAC,MAAA;MAAA,gBAAkBW;IAAY;MAAAV,OAAA,EAAAA,CAAA,MAAAH,YAAA;QAAA;MAAA,IAAAI,gBAAA;IAAA,EAG7D,CAAC,CAACC,GAAG,CAAC,MAAM,CAAC,CAACG,KAAK,CAAC,CAAC,CACnBH,GAAG,CAAC,aAAa,CAAC,CAACC,MAAM,CAAC,sBAAsB,CAAC;EACtD,CAAC,CAAC;AACJ,CAAC,CAAC","ignoreList":[]}

package/lib/components/VDialog/_variables.scss

@@ -7,7 +7,8 @@ $dialog-elevation: 24 !default;
 $dialog-border-radius: settings.$border-radius-root !default;
 $dialog-margin: 24px !default;
 
-$dialog-card-header-padding: 14px 24px 0 !default;
-$dialog-card-header-text-padding-top: 10px !default;
-$dialog-card-text-padding: 16px 24px 10px !default;
+$dialog-card-actions-justify: flex-end !default;
+$dialog-card-header-padding: 16px 24px !default;
+$dialog-card-header-text-padding-top: 0 !default;
+$dialog-card-text-padding: 16px 24px 24px !default;
 $dialog-card-text-letter-spacing: tools.map-deep-get(settings.$typography, 'body-1', 'letter-spacing') !default;