@fluid-topics/ft-modal 1.3.54 → 1.3.56

package/build/ft-modal.styles.d.ts

@@ -18,5 +18,6 @@ export declare const FtModalCssVariables: {
     overlayBackgroundColor: import("@fluid-topics/ft-wc-utils").FtCssVariable;
     overlayOpacity: import("@fluid-topics/ft-wc-utils").FtCssVariable;
     closingButtonColor: import("@fluid-topics/ft-wc-utils").FtCssVariable;
+    contentOverflow: import("@fluid-topics/ft-wc-utils").FtCssVariable;
 };
 export declare const ftmodalStyles: import("lit").CSSResult;

package/build/ft-modal.styles.js

@@ -1,5 +1,5 @@
 import { css } from "lit";
-import { designSystemVariables, FtCssVariableFactory } from "@fluid-topics/ft-wc-utils";
+import { designSystemVariables, FtCssVariableFactory, } from "@fluid-topics/ft-wc-utils";
 export const FtModalCssVariables = {
     shadow: FtCssVariableFactory.extend("--ft-modal-shadow", "", designSystemVariables.elevation03),
     borderRadius: FtCssVariableFactory.extend("--ft-modal-border-radius", "", designSystemVariables.borderRadiusM),
@@ -20,20 +20,11 @@ export const FtModalCssVariables = {
     overlayBackgroundColor: FtCssVariableFactory.create("--ft-modal-overlay-background-color", "", "COLOR", "rgb(10, 10, 13)"),
     overlayOpacity: FtCssVariableFactory.create("--ft-modal-overlay-opacity", "", "NUMBER", "0.4"),
     closingButtonColor: FtCssVariableFactory.extend("--ft-modal-closing-button-color", "", designSystemVariables.colorOnSurfaceMedium),
+    contentOverflow: FtCssVariableFactory.create("--ft-modal-content-overflow", "", "UNKNOWN", "visible"),
 };
 // language=CSS
 export const ftmodalStyles = css `
 
-    @keyframes slide-in-from-right {
-        0% {
-            transform: translateX(100%);
-        }
-
-        100% {
-            transform: translateX(0%);
-        }
-    }
-
     @keyframes fade-in {
         0% {
             opacity: 0;
@@ -127,12 +118,12 @@ export const ftmodalStyles = css `
         color: ${FtModalCssVariables.contentColor};
         background-color: ${FtModalCssVariables.contentBackgroundColor};
         border-radius: 0px 0px ${FtModalCssVariables.borderRadius} ${FtModalCssVariables.borderRadius};
-        overflow: auto;
+        overflow: ${FtModalCssVariables.contentOverflow};
     }
 
     [part=content] {
         flex-grow: 1;
-        overflow: auto;
+        overflow: ${FtModalCssVariables.contentOverflow};
     }
 
     [part=actions] {
@@ -152,29 +143,4 @@ export const ftmodalStyles = css `
         }
     }
 
-    [part=inner-container].drawer {
-        top: 0;
-        right: 0;
-        bottom: 0;
-        margin-right: 0;
-        max-height: 100%;
-
-        animation-duration: 0.2s;
-        animation-name: slide-in-from-right;
-        animation-timing-function: cubic-bezier(.46,0,.31,.95);
-
-        @media (min-width: 768px) {
-            transform: none;
-            height: 100%;
-        }
-    }
-
-    .drawer [part=header],
-    .drawer [part=body] {
-        border-radius: 0;
-    }
-
-    .drawer [part=header] {
-        flex-direction: row-reverse;
-    }
 `;

package/package.json

@@ -1,6 +1,6 @@
 {
     "name": "@fluid-topics/ft-modal",
-    "version": "1.3.54",
+    "version": "1.3.56",
     "description": "Modal for Design System V2",
     "keywords": [
         "Lit"
@@ -19,11 +19,11 @@
         "url": "ssh://git@scm.mrs.antidot.net:2222/fluidtopics/ft-web-components.git"
     },
     "dependencies": {
-        "@fluid-topics/ft-wc-utils": "1.3.54",
+        "@fluid-topics/ft-wc-utils": "1.3.56",
         "lit": "3.1.0"
     },
     "devDependencies": {
-        "@fluid-topics/ft-wc-test-utils": "1.3.54"
+        "@fluid-topics/ft-wc-test-utils": "1.3.56"
     },
-    "gitHead": "cf94f6196c0b97b6f3ee585302a0ffe35c442f32"
+    "gitHead": "01868f9694982c27cc22b788567208da17c855e2"
 }