fix: merge

package-lock.json

@@ -12,7 +12,7 @@
                 "@popperjs/core": "^2.11.8",
                 "@sentry/svelte": "^7.66.0",
                 "@sentry/tracing": "^7.66.0",
-                "@stripe/stripe-js": "^2.1.11",
+                "@stripe/stripe-js": "^2.2.0",
                 "ai": "^2.2.11",
                 "analytics": "^0.8.9",
                 "dayjs": "^1.11.9",
@@ -2055,9 +2055,9 @@
             }
         },
         "node_modules/@stripe/stripe-js": {
-            "version": "2.1.11",
-            "resolved": "https://registry.npmjs.org/@stripe/stripe-js/-/stripe-js-2.1.11.tgz",
-            "integrity": "sha512-GRyInO+VPMjjgUzVPKpDtz+5s8JKssJ99uhWBGo09yxDQBb+bhkm6PxmVa8C+qsSd30JFO1Z+pgIJ0AMmmZJKg=="
+            "version": "2.2.0",
+            "resolved": "https://registry.npmjs.org/@stripe/stripe-js/-/stripe-js-2.2.0.tgz",
+            "integrity": "sha512-YyXQbsXvnNRJ6MofFhCLIQ4W7UpfkfSOQhjIaHEiCMBv3IBxhzugXiYNNzceGTK/7DL31v7HtTnkJ+FI+6AIow=="
         },
         "node_modules/@sveltejs/adapter-static": {
             "version": "2.0.3",

package.json

@@ -24,7 +24,7 @@
         "@popperjs/core": "^2.11.8",
         "@sentry/svelte": "^7.66.0",
         "@sentry/tracing": "^7.66.0",
-        "@stripe/stripe-js": "^1.54.2",
+        "@stripe/stripe-js": "^2.2.0",
         "ai": "^2.2.11",
         "analytics": "^0.8.9",
         "dayjs": "^1.11.9",

src/lib/elements/forms/inputCheckbox.svelte

@@ -1,5 +1,6 @@
 <script lang="ts">
     import { FormItem, Helper, Label } from '.';
+    import type { FormItemTag } from './formItem.svelte';
 
     interface $$Props extends Partial<HTMLLabelElement> {
         id: string;
@@ -12,6 +13,7 @@
         disabled?: boolean;
         element?: HTMLInputElement | undefined;
         indeterminate?: boolean;
+        wrapperTag?: FormItemTag;
     }
 
     export let id: string;
@@ -23,6 +25,7 @@
     export let required = false;
     export let disabled = false;
     export let element: HTMLInputElement | undefined = undefined;
+    export let wrapperTag: FormItemTag = 'li';
 
     let error: string;
 
@@ -40,7 +43,7 @@
     }
 </script>
 
-<FormItem>
+<FormItem tag={wrapperTag}>
     {#if label}
         <Label {required} {tooltip} {optionalText} hide={!showLabel} for={id}>
             {label}

src/lib/elements/table/cellCheck.svelte

@@ -2,6 +2,7 @@
     import { toggle } from '$lib/helpers/array';
     import { isHTMLInputElement } from '$lib/helpers/types';
     import { TableCell } from '.';
+    import { InputCheckbox } from '../forms';
 
     export let id: string;
     export let selectedIds: string[] = [];
@@ -29,10 +30,10 @@
         tabindex="-1"
         on:click={handleClick}
         on:keypress={handleClick} />
-    <input
-        {id}
-        type="checkbox"
-        bind:this={el}
+    <InputCheckbox
+        bind:element={el}
+        id="select-{id}"
+        wrapperTag="div"
         checked={selectedIds.includes(id)}
         on:click={handleClick} />
 </TableCell>

src/lib/elements/table/cellHeadCheck.svelte

@@ -1,6 +1,7 @@
 <script lang="ts">
     import { isHTMLInputElement } from '$lib/helpers/types';
     import { TableCellHead } from '.';
+    import { InputCheckbox } from '../forms';
 
     export let selected: string[] = [];
     export let pageItemsIds: string[] = [];
@@ -23,10 +24,10 @@
 </script>
 
 <TableCellHead width={10}>
-    <input
+    <InputCheckbox
         id="select-all"
+        wrapperTag="div"
         indeterminate={someSelected && !allSelected}
-        type="checkbox"
         checked={allSelected}
         on:click={handleClick} />
 </TableCellHead>