flowbite-svelte 0.36.2 → 0.36.4

This diff represents the content of publicly available package versions that have been released to one of the supported registries. The information contained in this diff is provided for informational purposes only and reflects changes between package versions as they appear in their respective public registries.
@@ -11,6 +11,9 @@ const sizes = {
11
11
  };
12
12
  let toggleTheme;
13
13
  onMount(() => {
14
+ if (localStorage.getItem('color-theme')) {
15
+ initialTheme = localStorage.getItem('color-theme') || 'light';
16
+ }
14
17
  localStorage.getItem('color-theme') === initialTheme ||
15
18
  (!('color-theme' in localStorage) && window.matchMedia('(prefers-color-scheme: dark)').matches)
16
19
  ? window.document.documentElement.classList.add(initialTheme)
@@ -1 +1 @@
1
- {"version":3,"file":"DarkMode.svelte.d.ts","sourceRoot":"","sources":["../../../src/lib/darkmode/DarkMode.svelte"],"names":[],"mappings":"AAAA,OAAO,EAAE,oBAAoB,EAAE,MAAM,QAAQ,CAE5C;AAwDD,QAAA,MAAM,SAAS;;;;;;;;;;;;;;CAA+D,CAAC;AAC/E,MAAM,MAAM,aAAa,GAAG,OAAO,SAAS,CAAC,KAAK,CAAC;AACnD,MAAM,MAAM,cAAc,GAAG,OAAO,SAAS,CAAC,MAAM,CAAC;AACrD,MAAM,MAAM,aAAa,GAAG,OAAO,SAAS,CAAC,KAAK,CAAC;AAEnD,MAAM,CAAC,OAAO,OAAO,QAAS,SAAQ,oBAAoB,CAAC,aAAa,EAAE,cAAc,EAAE,aAAa,CAAC;CACvG"}
1
+ {"version":3,"file":"DarkMode.svelte.d.ts","sourceRoot":"","sources":["../../../src/lib/darkmode/DarkMode.svelte"],"names":[],"mappings":"AAAA,OAAO,EAAE,oBAAoB,EAAE,MAAM,QAAQ,CAE5C;AA4DD,QAAA,MAAM,SAAS;;;;;;;;;;;;;;CAA+D,CAAC;AAC/E,MAAM,MAAM,aAAa,GAAG,OAAO,SAAS,CAAC,KAAK,CAAC;AACnD,MAAM,MAAM,cAAc,GAAG,OAAO,SAAS,CAAC,MAAM,CAAC;AACrD,MAAM,MAAM,aAAa,GAAG,OAAO,SAAS,CAAC,KAAK,CAAC;AAEnD,MAAM,CAAC,OAAO,OAAO,QAAS,SAAQ,oBAAoB,CAAC,aAAa,EAAE,cAAc,EAAE,aAAa,CAAC;CACvG"}
@@ -11,6 +11,8 @@ export let autoclose = false;
11
11
  export let permanent = false;
12
12
  export let backdropClasses = 'bg-gray-900 bg-opacity-50 dark:bg-opacity-80';
13
13
  export let defaultClass = 'relative flex flex-col mx-auto';
14
+ export let outsideclose = false;
15
+ export let id = "modal";
14
16
  const dispatch = createEventDispatcher();
15
17
  $: dispatch(open ? 'open' : 'hide');
16
18
  function prepareFocus(node) {
@@ -69,33 +71,39 @@ const hide = (e) => {
69
71
  e.preventDefault();
70
72
  open = false;
71
73
  };
74
+ function isHTMLElement(value) {
75
+ return value instanceof HTMLElement;
76
+ }
77
+ const hidebyOutside = (e) => {
78
+ if (isHTMLElement(e.target) && e.target.id === 'outerModal') {
79
+ open = false;
80
+ }
81
+ };
72
82
  let frameClass;
73
83
  $: frameClass = classNames(defaultClass, $$props.class);
74
84
  const isScrollable = (e) => [
75
85
  e.scrollWidth > e.clientWidth && ['scroll', 'auto'].indexOf(getComputedStyle(e).overflowX) >= 0,
76
86
  e.scrollHeight > e.clientHeight && ['scroll', 'auto'].indexOf(getComputedStyle(e).overflowY) >= 0
77
87
  ];
78
- function preventWheelDefault(e) {
79
- // @ts-ignore
80
- const [x, y] = isScrollable(this);
81
- return x || y || e.preventDefault();
82
- }
83
88
  function handleKeys(e) {
84
89
  if (e.key === 'Escape' && !permanent)
85
90
  return hide(e);
86
91
  }
87
92
  </script>
88
93
 
94
+
89
95
  {#if open}
90
96
  <!-- backdrop -->
91
97
  <div class={classNames('fixed inset-0 z-40', backdropClasses)} />
92
98
  <!-- dialog -->
93
99
  <div
100
+ id='outerModal'
94
101
  on:keydown={handleKeys}
95
102
  on:wheel|preventDefault|nonpassive
96
103
  use:prepareFocus
97
104
  use:focusTrap
98
105
  on:click={autoclose ? onAutoClose : null}
106
+ on:click={outsideclose? hidebyOutside: null}
99
107
  class={classNames(
100
108
  'fixed top-0 left-0 right-0 h-modal md:inset-0 md:h-full z-50 w-full p-4 flex',
101
109
  ...getPlacementClasses()
@@ -103,7 +111,7 @@ function handleKeys(e) {
103
111
  tabindex="-1"
104
112
  aria-modal="true"
105
113
  role="dialog">
106
- <div class="flex relative {sizes[size]} w-full max-h-full">
114
+ <div class="flex relative {sizes[size]} w-full max-h-full" {id} >
107
115
  <!-- Modal content -->
108
116
  <Frame rounded shadow {...$$restProps} class={frameClass}>
109
117
  <!-- Modal header -->
@@ -126,7 +134,6 @@ function handleKeys(e) {
126
134
  {/if}
127
135
  <!-- Modal body -->
128
136
  <div
129
- id="modal"
130
137
  class="p-6 space-y-6 flex-1 overflow-y-auto overscroll-contain"
131
138
  on:keydown|stopPropagation={handleKeys}
132
139
  on:wheel|stopPropagation|passive>
@@ -22,7 +22,7 @@ declare const __propDef: {
22
22
  draggable?: import("svelte/elements").Booleanish | null | undefined;
23
23
  enterkeyhint?: "enter" | "done" | "go" | "next" | "previous" | "search" | "send" | null | undefined;
24
24
  hidden?: boolean | null | undefined;
25
- id?: string | null | undefined;
25
+ id?: string | undefined;
26
26
  lang?: string | null | undefined;
27
27
  part?: string | null | undefined;
28
28
  placeholder?: string | null | undefined;
@@ -249,6 +249,8 @@ declare const __propDef: {
249
249
  autoclose?: boolean | undefined;
250
250
  permanent?: boolean | undefined;
251
251
  backdropClasses?: string | undefined;
252
+ defaultClass?: string | undefined;
253
+ outsideclose?: boolean | undefined;
252
254
  };
253
255
  events: {
254
256
  wheel: WheelEvent;
@@ -1 +1 @@
1
- {"version":3,"file":"Modal.svelte.d.ts","sourceRoot":"","sources":["../../../src/lib/modals/Modal.svelte"],"names":[],"mappings":"AAAA,OAAO,EAAE,oBAAoB,EAAE,MAAM,QAAQ,CAE5C;AAMD,OAAO,KAAK,EAAE,QAAQ,EAAE,MAAM,YAAY,CAAC;AAsK3C,QAAA,MAAM,SAAS;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;CAAwC,CAAC;AACxD,MAAM,MAAM,UAAU,GAAG,OAAO,SAAS,CAAC,KAAK,CAAC;AAChD,MAAM,MAAM,WAAW,GAAG,OAAO,SAAS,CAAC,MAAM,CAAC;AAClD,MAAM,MAAM,UAAU,GAAG,OAAO,SAAS,CAAC,KAAK,CAAC;AAEhD,MAAM,CAAC,OAAO,OAAO,KAAM,SAAQ,oBAAoB,CAAC,UAAU,EAAE,WAAW,EAAE,UAAU,CAAC;CAC3F"}
1
+ {"version":3,"file":"Modal.svelte.d.ts","sourceRoot":"","sources":["../../../src/lib/modals/Modal.svelte"],"names":[],"mappings":"AAAA,OAAO,EAAE,oBAAoB,EAAE,MAAM,QAAQ,CAE5C;AAMD,OAAO,KAAK,EAAE,QAAQ,EAAE,MAAM,YAAY,CAAC;AAgL3C,QAAA,MAAM,SAAS;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;CAAwC,CAAC;AACxD,MAAM,MAAM,UAAU,GAAG,OAAO,SAAS,CAAC,KAAK,CAAC;AAChD,MAAM,MAAM,WAAW,GAAG,OAAO,SAAS,CAAC,MAAM,CAAC;AAClD,MAAM,MAAM,UAAU,GAAG,OAAO,SAAS,CAAC,KAAK,CAAC;AAEhD,MAAM,CAAC,OAAO,OAAO,KAAM,SAAQ,oBAAoB,CAAC,UAAU,EAAE,WAAW,EAAE,UAAU,CAAC;CAC3F"}
package/package.json CHANGED
@@ -1,6 +1,6 @@
1
1
  {
2
2
  "name": "flowbite-svelte",
3
- "version": "0.36.2",
3
+ "version": "0.36.4",
4
4
  "description": "Flowbite components for Svelte",
5
5
  "main": "dist/index.js",
6
6
  "author": {
@@ -35,16 +35,16 @@
35
35
  "svelte": "^3.55.1"
36
36
  },
37
37
  "devDependencies": {
38
- "@playwright/test": "^1.33.0",
39
- "@sveltejs/adapter-vercel": "^2.4.3",
40
- "@sveltejs/kit": "^1.16.2",
38
+ "@playwright/test": "^1.34.0",
39
+ "@sveltejs/adapter-vercel": "^3.0.0",
40
+ "@sveltejs/kit": "^1.18.0",
41
41
  "@sveltejs/package": "2.0.2",
42
- "@typescript-eslint/eslint-plugin": "^5.59.2",
43
- "@typescript-eslint/parser": "^5.59.2",
42
+ "@typescript-eslint/eslint-plugin": "^5.59.6",
43
+ "@typescript-eslint/parser": "^5.59.6",
44
44
  "autoprefixer": "^10.4.14",
45
45
  "createprops": "^0.6.1",
46
- "esbuild": "0.17.18",
47
- "eslint": "^8.40.0",
46
+ "esbuild": "0.17.19",
47
+ "eslint": "^8.41.0",
48
48
  "eslint-config-prettier": "^8.8.0",
49
49
  "eslint-plugin-svelte3": "^4.0.0",
50
50
  "mdsvex": "^0.10.6",
@@ -54,17 +54,17 @@
54
54
  "prettier": "^2.8.8",
55
55
  "prettier-plugin-svelte": "^2.10.0",
56
56
  "prism-themes": "^1.9.0",
57
- "publint": "^0.1.11",
58
- "svelte": "^3.59.0",
59
- "svelte-check": "^3.3.1",
60
- "svelte-meta-tags": "^2.7.0",
57
+ "publint": "^0.1.12",
58
+ "svelte": "^3.59.1",
59
+ "svelte-check": "^3.3.2",
60
+ "svelte-meta-tags": "^2.7.2",
61
61
  "svelte-preprocess": "^5.0.3",
62
- "svelte2tsx": "^0.6.13",
62
+ "svelte2tsx": "^0.6.14",
63
63
  "tailwindcss": "^3.3.2",
64
- "tslib": "^2.5.0",
64
+ "tslib": "^2.5.2",
65
65
  "typescript": "^5.0.4",
66
- "vite": "^4.3.5",
67
- "vitest": "^0.31.0"
66
+ "vite": "^4.3.8",
67
+ "vitest": "^0.31.1"
68
68
  },
69
69
  "type": "module",
70
70
  "keywords": [
@@ -110,7 +110,7 @@
110
110
  "url": "https://github.com/themesberg/flowbite-svelte"
111
111
  },
112
112
  "dependencies": {
113
- "@docsearch/js": "^3.3.4",
113
+ "@docsearch/js": "^3.3.5",
114
114
  "@popperjs/core": "^2.11.7",
115
115
  "classnames": "^2.3.2",
116
116
  "flowbite": "^1.6.5"