vuetify 3.2.5 → 3.3.0

package/lib/labs/VBottomSheet/VBottomSheet.mjs.map

@@ -0,0 +1 @@
+{"version":3,"file":"VBottomSheet.mjs","names":["makeVDialogProps","VDialog","useProxiedModel","genericComponent","propsFactory","useRender","makeVBottomSheetProps","inset","Boolean","contentClass","transition","VBottomSheet","name","props","emits","value","setup","_ref","slots","isActive","dialogProps","filterProps","_createVNode","_mergeProps","$event"],"sources":["../../../src/labs/VBottomSheet/VBottomSheet.tsx"],"sourcesContent":["// Styles\nimport './VBottomSheet.sass'\n\n// Components\nimport { makeVDialogProps, VDialog } from '@/components/VDialog/VDialog'\n\n// Composables\nimport { useProxiedModel } from '@/composables/proxiedModel'\n\n// Utilities\nimport { genericComponent, propsFactory, useRender } from '@/util'\n\n// Types\nimport type { OverlaySlots } from '@/components/VOverlay/VOverlay'\n\nexport const makeVBottomSheetProps = propsFactory({\n  inset: Boolean,\n\n  ...makeVDialogProps({\n    contentClass: 'v-bottom-sheet__content',\n    transition: 'bottom-sheet-transition',\n  }),\n}, 'v-bottom-sheet')\n\nexport const VBottomSheet = genericComponent<OverlaySlots>()({\n  name: 'VBottomSheet',\n\n  props: makeVBottomSheetProps(),\n\n  emits: {\n    'update:modelValue': (value: boolean) => true,\n  },\n\n  setup (props, { slots }) {\n    const isActive = useProxiedModel(props, 'modelValue')\n\n    useRender(() => {\n      const [dialogProps] = VDialog.filterProps(props)\n\n      return (\n        <VDialog\n          { ...dialogProps }\n          v-model={ isActive.value }\n          class={[\n            'v-bottom-sheet',\n            {\n              'v-bottom-sheet--inset': props.inset,\n            },\n          ]}\n          v-slots={ slots }\n        />\n      )\n    })\n\n    return {}\n  },\n})\n\nexport type VBottomSheet = InstanceType<typeof VBottomSheet>\n"],"mappings":";AAAA;AACA;;AAEA;AAAA,SACSA,gBAAgB,EAAEC,OAAO,gDAElC;AAAA,SACSC,eAAe,8CAExB;AAAA,SACSC,gBAAgB,EAAEC,YAAY,EAAEC,SAAS,gCAElD;AAGA,OAAO,MAAMC,qBAAqB,GAAGF,YAAY,CAAC;EAChDG,KAAK,EAAEC,OAAO;EAEd,GAAGR,gBAAgB,CAAC;IAClBS,YAAY,EAAE,yBAAyB;IACvCC,UAAU,EAAE;EACd,CAAC;AACH,CAAC,EAAE,gBAAgB,CAAC;AAEpB,OAAO,MAAMC,YAAY,GAAGR,gBAAgB,EAAgB,CAAC;EAC3DS,IAAI,EAAE,cAAc;EAEpBC,KAAK,EAAEP,qBAAqB,EAAE;EAE9BQ,KAAK,EAAE;IACL,mBAAmB,EAAGC,KAAc,IAAK;EAC3C,CAAC;EAEDC,KAAKA,CAAEH,KAAK,EAAAI,IAAA,EAAa;IAAA,IAAX;MAAEC;IAAM,CAAC,GAAAD,IAAA;IACrB,MAAME,QAAQ,GAAGjB,eAAe,CAACW,KAAK,EAAE,YAAY,CAAC;IAErDR,SAAS,CAAC,MAAM;MACd,MAAM,CAACe,WAAW,CAAC,GAAGnB,OAAO,CAACoB,WAAW,CAACR,KAAK,CAAC;MAEhD,OAAAS,YAAA,CAAArB,OAAA,EAAAsB,WAAA,CAESH,WAAW;QAAA,cACND,QAAQ,CAACJ,KAAK;QAAA,uBAAAS,MAAA,IAAdL,QAAQ,CAACJ,KAAK,GAAAS,MAAA;QAAA,SACjB,CACL,gBAAgB,EAChB;UACE,uBAAuB,EAAEX,KAAK,CAACN;QACjC,CAAC;MACF,IACSW,KAAK;IAGrB,CAAC,CAAC;IAEF,OAAO,CAAC,CAAC;EACX;AACF,CAAC,CAAC"}

package/lib/labs/VBottomSheet/VBottomSheet.sass

@@ -0,0 +1,37 @@
+@use '../../styles/settings'
+@use '../../styles/tools'
+@use './variables' as *
+
+// Transition
+.bottom-sheet-transition
+  &-enter-from
+    transform: translateY(100%)
+
+  &-leave-to
+    transform: translateY(100%)
+
+// Block
+.v-bottom-sheet
+  > .v-bottom-sheet__content.v-overlay__content
+    align-self: flex-end
+    border-radius: 0
+    flex: 0 1 auto
+    left: 0
+    right: 0
+    margin-inline-start: 0
+    margin-inline-end: 0
+    margin-bottom: 0
+    transition-duration: $bottom-sheet-transition-duration
+    width: 100%
+    max-width: 100%
+    overflow: visible
+
+    > .v-card,
+    > .v-sheet
+      border-radius: $bottom-sheet-border-radius
+
+  &.v-bottom-sheet--inset
+    max-width: none
+
+    @media #{map-get(settings.$display-breakpoints, 'sm-and-up')}
+      max-width: $bottom-sheet-inset-width

package/lib/labs/VBottomSheet/_variables.scss

@@ -0,0 +1,5 @@
+@use '../../styles/settings';
+
+$bottom-sheet-inset-width: 70% !default;
+$bottom-sheet-border-radius: 0 !default;
+$bottom-sheet-transition-duration: .2s !default;