fds-vue-core 2.0.34 → 2.0.35

package/dist/components/FdsModal/FdsModal.vue.d.ts.map

@@ -1 +1 @@
-{"version":3,"file":"FdsModal.vue.d.ts","sourceRoot":"","sources":["../../../src/components/FdsModal/FdsModal.vue"],"names":[],"mappings":"AAqPA,OAAO,KAAK,EAAE,aAAa,EAAE,MAAM,SAAS,CAAA;AAkV5C,QAAA,IAAI,QAAQ,IAAW,EAAE,QAAQ,IAAY,CAAE;AAC/C,KAAK,WAAW,GAAG,EAAE,GACnB;IAAE,OAAO,CAAC,EAAE,CAAC,KAAK,EAAE,OAAO,QAAQ,KAAK,GAAG,CAAA;CAAE,GAC7C;IAAE,cAAc,CAAC,EAAE,CAAC,KAAK,EAAE,OAAO,QAAQ,KAAK,GAAG,CAAA;CAAE,CAAC;AA8BvD,QAAA,MAAM,eAAe;;;;;;;;;;;;;;;;;4EAInB,CAAC;wBACkB,eAAe,CAAC,OAAO,eAAe,EAAE,WAAW,CAAC;AAAzE,wBAA0E;AAY1E,KAAK,eAAe,CAAC,CAAC,EAAE,CAAC,IAAI,CAAC,GAAG;IAChC,QAAO;QACN,MAAM,EAAE,CAAC,CAAC;KAEV,CAAA;CACD,CAAC"}
+{"version":3,"file":"FdsModal.vue.d.ts","sourceRoot":"","sources":["../../../src/components/FdsModal/FdsModal.vue"],"names":[],"mappings":"AAyPA,OAAO,KAAK,EAAE,aAAa,EAAE,MAAM,SAAS,CAAA;AA+U5C,QAAA,IAAI,QAAQ,IAAW,EAAE,QAAQ,IAAY,CAAE;AAC/C,KAAK,WAAW,GAAG,EAAE,GACnB;IAAE,OAAO,CAAC,EAAE,CAAC,KAAK,EAAE,OAAO,QAAQ,KAAK,GAAG,CAAA;CAAE,GAC7C;IAAE,cAAc,CAAC,EAAE,CAAC,KAAK,EAAE,OAAO,QAAQ,KAAK,GAAG,CAAA;CAAE,CAAC;AA+BvD,QAAA,MAAM,eAAe;;;;;;;;;;;;;;;;;4EAInB,CAAC;wBACkB,eAAe,CAAC,OAAO,eAAe,EAAE,WAAW,CAAC;AAAzE,wBAA0E;AAY1E,KAAK,eAAe,CAAC,CAAC,EAAE,CAAC,IAAI,CAAC,GAAG;IAChC,QAAO;QACN,MAAM,EAAE,CAAC,CAAC;KAEV,CAAA;CACD,CAAC"}

package/dist/fds-vue-core.cjs.js

@@ -439,7 +439,7 @@ const _sfc_main$v = /* @__PURE__ */ vue.defineComponent({
     ]);
     const checkboxClasses = vue.computed(() => [
       "rounded-md transition-colors duration-200 accent-blue-500 m-[3px]",
-      "peer z-40 bg-white min-w-[18px] min-h-[18px] focus-visible:outline-none",
+      "peer z-2 bg-white min-w-[18px] min-h-[18px] focus-visible:outline-none",
       props.disabled && "cursor-not-allowed"
     ]);
     const autoId = `fds-checkbox-${Math.random().toString(36).slice(2, 9)}`;
@@ -1174,7 +1174,7 @@ const _sfc_main$s = /* @__PURE__ */ vue.defineComponent({
       props.disabled && "hover:bg-transparent active:bg-transparent"
     ]);
     const inputClasses = vue.computed(() => [
-      "peer z-40 bg-white min-w-[18px] min-h-[18px] focus-visible:outline-none rounded-full accent-blue-500",
+      "peer z-2 bg-white min-w-[18px] min-h-[18px] focus-visible:outline-none rounded-full accent-blue-500",
       props.disabled && "cursor-not-allowed"
     ]);
     return (_ctx, _cache) => {
@@ -3438,12 +3438,16 @@ const _sfc_main$5 = /* @__PURE__ */ vue.defineComponent({
     const slots = vue.useSlots();
     const isOpen = vue.ref(props.open);
     let cleanupFocusTrap = null;
+    const hasFooter = vue.computed(() => !!slots["modal-footer"]);
+    const modalOuterClasses = vue.computed(() => [
+      "fixed top-0 left-0 w-full h-full overflow-auto z-100"
+    ]);
     const modalInnerClasses = vue.computed(() => [
-      "fixed min-w-[288px] w-[calc(100%-5rem)] max-h-[80%] bg-white rounded-lg overflow-auto z-[99999] shadow-[0_16px_32px_rgba(12,72,153,0.12)] p-6",
-      "translate-x-[-50%]",
+      "relative min-w-[288px] w-[calc(100%-5rem)]  bg-white rounded-lg overflow-auto z-[99999] shadow-lg p-6 left-1/2",
+      "top-1/2 translate-x-[-50%]",
+      props.alignTop ? "max-h-[60%] top-[10rem]" : "max-h-[80%] translate-y-[-50%]",
+      hasFooter.value ? "pb-0" : "",
       {
-        "left-1/2 top-1/2 translate-y-[-50%]": !props.alignTop,
-        "top-[10rem]": props.alignTop,
         "max-w-[480px]": props.size === "sm",
         "max-w-[588px]": props.size === "md",
         "max-w-[768px]": props.size === "lg",
@@ -3468,13 +3472,12 @@ const _sfc_main$5 = /* @__PURE__ */ vue.defineComponent({
     const closeLabel = vue.computed(
       () => props.locale === "sv" ? "Stäng dialogruta" : "Close modal window"
     );
-    const hasFooter = vue.computed(() => !!slots["modal-footer"]);
     const footerClasses = vue.computed(() => [
       "mt-6 flex flex-col gap-4 pb-8",
       {
         "sm:flex-row sm:justify-end": !props.alignLeftFooter,
         "sm:flex-row sm:justify-start": props.alignLeftFooter,
-        "sticky pt-4 pb-6 mt-4 bottom-0 bg-white shadow-[0px_-8px_16px_0px_rgba(255,255,255,0.59)] z-[2]": props.stickyFooter
+        "sticky p-6 -mx-6 bg-white bottom-0 shadow-[0px_-8px_16px_0px_rgba(255,255,255,0.59)] z-[2]": props.stickyFooter
       }
     ]);
     const handleBackdropClick = () => {
@@ -3500,7 +3503,7 @@ const _sfc_main$5 = /* @__PURE__ */ vue.defineComponent({
     const trapFocus = () => {
       if (!isOpen.value) return;
       vue.nextTick(() => {
-        const modal = document.querySelector(".fds-modal__inner");
+        const modal = document.querySelector(".fds-modal-inner");
         if (!modal) return;
         const tabList = getTabList(modal);
         if (tabList.length > 0) {
@@ -3565,12 +3568,12 @@ const _sfc_main$5 = /* @__PURE__ */ vue.defineComponent({
       return vue.openBlock(), vue.createBlock(vue.Teleport, { to: "body" }, [
         isOpen.value ? (vue.openBlock(), vue.createElementBlock("div", {
           key: 0,
-          class: "fixed top-0 left-0 w-full h-full overflow-auto z-100",
-          onClick: handleBackdropClick
+          onClick: handleBackdropClick,
+          class: vue.normalizeClass(modalOuterClasses.value)
         }, [
           _cache[2] || (_cache[2] = vue.createElementVNode("div", { class: "fixed top-0 left-0 w-full h-full bg-black/34 z-99" }, null, -1)),
           vue.createElementVNode("div", {
-            class: vue.normalizeClass(["fds-modal__inner", modalInnerClasses.value]),
+            class: vue.normalizeClass(["fds-modal-inner", modalInnerClasses.value]),
             role: "alertdialog",
             "aria-modal": "true",
             onClick: _cache[1] || (_cache[1] = vue.withModifiers(() => {
@@ -3608,12 +3611,12 @@ const _sfc_main$5 = /* @__PURE__ */ vue.defineComponent({
               vue.renderSlot(_ctx.$slots, "modal-footer", {}, void 0, true)
             ], 2)) : vue.createCommentVNode("", true)
           ], 2)
-        ])) : vue.createCommentVNode("", true)
+        ], 2)) : vue.createCommentVNode("", true)
       ]);
     };
   }
 });
-const FdsModal = /* @__PURE__ */ _export_sfc(_sfc_main$5, [["__scopeId", "data-v-8b537fc0"]]);
+const FdsModal = /* @__PURE__ */ _export_sfc(_sfc_main$5, [["__scopeId", "data-v-9a84f324"]]);
 const _hoisted_1$3 = ["id"];
 const _hoisted_2$1 = { class: "flex items-center justify-start gap-1 w-[100px]" };
 const _hoisted_3 = { class: "flex items-center justify-center w-auto gap-2 order-0 sm:order-0" };