Merge pull request #37 from kampsy/dev

Dev to main

Author: kampsy

.github/workflows/beta-release.yml

@@ -0,0 +1,44 @@
+name: Beta Release
+
+on:
+  push:
+    branches:
+      - tailwindcss-v4
+
+permissions:
+  contents: write # to be able to publish a GitHub release
+  issues: write # to comment on issues after release
+  pull-requests: write # to comment on PRs after release
+  id-token: write # for OIDC (npm provenance)
+
+jobs:
+  beta-release:
+    name: Build & Publish @beta Release
+    runs-on: ubuntu-latest
+    steps:
+      - name: Checkout
+        uses: actions/checkout@v4
+        with:
+          fetch-depth: 0
+
+      - name: Setup Node
+        uses: actions/setup-node@v4
+        with:
+          node-version: 'lts/*'
+
+      - name: Use PNPM
+        uses: pnpm/action-setup@v4
+        with:
+          version: 8
+
+      - name: Install dependencies
+        run: pnpm install
+
+      # - name: Verify Integrity
+      #  run: pnpm audit signatures
+
+      - name: Run Semantic Release
+        env:
+          GITHUB_TOKEN: ${{ secrets.GITHUB_TOKEN }}
+          NPM_TOKEN: ${{ secrets.NPM_TOKEN }}
+        run: npx semantic-release --tag-format='beta-v{version}'

src/lib/collapse/content.svelte

@@ -32,10 +32,12 @@
 
 	let content: HTMLDivElement = $state<any>();
 	$effect(() => {
-		if (isActive) {
-			content.setAttribute('aria-hidden', 'false');
-		} else {
-			content.setAttribute('aria-hidden', 'true');
+		if (content) {
+			if (isActive) {
+				content.setAttribute('aria-hidden', 'false');
+			} else {
+				content.setAttribute('aria-hidden', 'true');
+			}
 		}
 	});
 </script>

src/lib/menu/root.svelte

@@ -51,7 +51,7 @@
 	<div
 		in:fade|local
 		out:fade|local
-		class="fixed top-0 left-0 w-full h-full bg-black bg-opacity-[0.4] lg:hidden z-[1000]"
+		class="fixed top-0 left-0 w-full h-full bg-kui-black bg-opacity-40 lg:hidden z-[1000]"
 	></div>
 {/if}
 

src/lib/modal/content.svelte

@@ -1,5 +1,4 @@
 <script lang="ts">
-	import { Button } from '$lib/index.js';
 	import { clickOutside } from '$lib/utils/event.js';
 	import { getContext, type Snippet } from 'svelte';
 	import { cubicOut } from 'svelte/easing';

src/lib/modal/root.svelte

@@ -57,12 +57,17 @@
 	});
 </script>
 
-<dialog bind:this={dialog} tabindex="-1">
+<!--Backgrop background-->
+{#if active}
 	<div
-		in:fade|local
-		out:fade|local
-		class="fixed top-0 left-0 w-full h-full flex items-center justify-center bg-kui-black bg-opacity-35 dark:bg-opacity-45"
-	>
+		in:fade|local={{ duration: 100 }}
+		out:fade|local={{ duration: 100 }}
+		class="fixed top-0 left-0 w-full h-full bg-kui-black bg-opacity-40 z-[1000]"
+	></div>
+{/if}
+
+<dialog bind:this={dialog}>
+	<div in:fade out:fade class="fixed top-0 left-0 w-full h-full flex items-center justify-center">
 		{@render children()}
 	</div>
 </dialog>