@onereach/ui-components 4.3.9 → 4.3.10-beta.2655.0

package/dist/bundled/v2/components/OrModalV3/OrModal.js

@@ -1,6 +1,6 @@
 import { defineComponent, ref, computed, watch } from 'vue-demi';
 import { ModalSize } from './props.js';
-import { ModalRoot, ModalRootSizes, ModalHeader } from './styles.js';
+import { ModalRoot, ModalRootSizes, ModalHeader, ModalContent, ModalFooter } from './styles.js';
 import __vue_component__$1 from '../OrOverlayV3/OrOverlay.js';
 import __vue_component__$2 from '../OrIconButtonV3/OrIconButton.js';
 import { n as normalizeComponent } from '../../normalize-component-6e8e3d80.js';
@@ -51,6 +51,8 @@ var script = defineComponent({
     // Styles
     const rootStyles = computed(() => ['or-modal-v3', ...ModalRoot, ...ModalRootSizes[props.size]]);
     const headerStyles = computed(() => [...ModalHeader]);
+    const contentStyles = computed(() => [...ModalContent]);
+    const footerStyles = computed(() => [...ModalFooter]);
     // State
     const isActive = ref(false);
     // Events
@@ -77,6 +79,8 @@ var script = defineComponent({
       root,
       rootStyles,
       headerStyles,
+      contentStyles,
+      footerStyles,
       isActive,
       open,
       close
@@ -115,8 +119,10 @@ var __vue_render__ = function () {
       }
     }
   })], 1), _vm._v(" "), _c('div', {
-    class: ['grow', 'overflow-y-auto']
-  }, [_vm._t("default")], 2), _vm._v(" "), _vm._t("footer")], 2)]) : _vm._e();
+    class: _vm.contentStyles
+  }, [_vm._t("default")], 2), _vm._v(" "), _c('div', {
+    class: _vm.footerStyles
+  }, [_vm._t("footer")], 2)])]) : _vm._e();
 };
 var __vue_staticRenderFns__ = [];
 

package/dist/bundled/v2/components/OrModalV3/OrModal.vue.d.ts

@@ -4,6 +4,8 @@ declare const _default: import("vue").ComponentOptions<import("vue").default, im
     root: import("@vue/composition-api").Ref<HTMLElement | undefined>;
     rootStyles: import("@vue/composition-api").ComputedRef<string[]>;
     headerStyles: import("@vue/composition-api").ComputedRef<string[]>;
+    contentStyles: import("@vue/composition-api").ComputedRef<string[]>;
+    footerStyles: import("@vue/composition-api").ComputedRef<string[]>;
     isActive: import("@vue/composition-api").Ref<boolean>;
     open: () => void;
     close: () => void;
@@ -34,6 +36,8 @@ declare const _default: import("vue").ComponentOptions<import("vue").default, im
     root: import("@vue/composition-api").Ref<HTMLElement | undefined>;
     rootStyles: import("@vue/composition-api").ComputedRef<string[]>;
     headerStyles: import("@vue/composition-api").ComputedRef<string[]>;
+    contentStyles: import("@vue/composition-api").ComputedRef<string[]>;
+    footerStyles: import("@vue/composition-api").ComputedRef<string[]>;
     isActive: import("@vue/composition-api").Ref<boolean>;
     open: () => void;
     close: () => void;

package/dist/bundled/v2/components/OrModalV3/styles.d.ts

@@ -2,3 +2,5 @@ import { ModalSize } from './props';
 export declare const ModalRoot: string[];
 export declare const ModalRootSizes: Record<ModalSize, string[]>;
 export declare const ModalHeader: string[];
+export declare const ModalContent: string[];
+export declare const ModalFooter: string[];

package/dist/bundled/v2/components/OrModalV3/styles.js

@@ -6,7 +6,7 @@ const ModalRoot = [
 // Shape
 'md:rounded-md',
 // Spacing
-'px-md md:px-lg', 'py-md md:py-lg', 'gap-md md:gap-lg',
+'gap-md md:gap-lg',
 // Typography
 'typography-body-2-regular',
 // Theme
@@ -25,9 +25,19 @@ const ModalRootSizes = {
   'md:w-[480px]']
 };
 const ModalHeader = [
-// Layouot
+// Layout
 'layout-row',
+// Spacing
+'px-md md:px-lg', 'pt-md md:pt-lg',
 // Typography
 'typography-headline-2'];
+const ModalContent = [
+// Box
+'grow', 'overflow-auto',
+// Spacing
+'px-md md:px-lg'];
+const ModalFooter = [
+// Spacing
+'px-md md:px-lg', 'pb-md md:pb-lg'];
 
-export { ModalHeader, ModalRoot, ModalRootSizes };
+export { ModalContent, ModalFooter, ModalHeader, ModalRoot, ModalRootSizes };