flowbite-svelte 0.26.30 → 0.26.31

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.
Files changed (12) hide show
  1. package/CHANGELOG.md +9 -0
  2. package/forms/Iconinput.svelte +67 -43
  3. package/forms/Iconinput.svelte.d.ts +13 -0
  4. package/forms/Input.svelte +29 -28
  5. package/forms/Input.svelte.d.ts +1 -0
  6. package/package.json +1 -1
  7. package/tabs/TabHead.svelte +1 -1
  8. package/tabs/TabHead.svelte.d.ts +1 -1
  9. package/tabs/TabHeadItem.svelte +1 -1
  10. package/tabs/TabHeadItem.svelte.d.ts +1 -1
  11. package/tabs/TabWrapper.svelte +1 -2
  12. package/tabs/TabWrapper.svelte.d.ts +0 -2
package/CHANGELOG.md CHANGED
@@ -2,6 +2,15 @@
2
2
 
3
3
  All notable changes to this project will be documented in this file. See [standard-version](https://github.com/conventional-changelog/standard-version) for commit guidelines.
4
4
 
5
+ ### [0.26.31](https://github.com/themesberg/flowbite-svelte/compare/v0.26.30...v0.26.31) (2022-09-23)
6
+
7
+
8
+ ### Bug Fixes
9
+
10
+ * add default style to TabHeadItem and TabHead and removed {tabStyle} from default example in tab page ([a9025c4](https://github.com/themesberg/flowbite-svelte/commit/a9025c432d57fe6896ab20249d711ff7739c9f1c))
11
+ * add events to IconInput and on:input to Input components ([6668918](https://github.com/themesberg/flowbite-svelte/commit/66689185cd6cdf94ab66e1ff05ba33fbcaf6be0f))
12
+ * remove activeTabvalue from TabWrapper and let:tabId vrom tab page examples ([ee1b444](https://github.com/themesberg/flowbite-svelte/commit/ee1b444cd552de4cd0c13e4356159ce44a864024))
13
+
5
14
  ### [0.26.30](https://github.com/themesberg/flowbite-svelte/compare/v0.26.29...v0.26.30) (2022-09-22)
6
15
 
7
16
 
package/forms/Iconinput.svelte CHANGED
@@ -10,48 +10,72 @@ export let noBorderDivClass = 'flex absolute inset-y-0 left-0 items-center pl-3'
10
10
  </script>
11
11
 
12
12
  {#if noBorder}
13
- <div class="relative">
14
- <div
15
- class={classNames(
16
- noBorderDivClass,
17
- {
18
- 'p-2 sm:text-xs': size === 'sm',
19
- 'p-2.5 text-sm': size === 'md',
20
- 'sm:text-md p-4': size === 'lg'
21
- },
22
- pointerEvent ? 'cursor-pointer' : 'pointer-events-none'
23
- )}>
24
- <slot />
25
- </div>
26
- <input
27
- {...$$restProps}
28
- bind:value
29
- class={classNames(
30
- noBorderInputClass,
31
- {
32
- 'p-2 sm:text-xs pl-9': size === 'sm',
33
- 'p-2.5 text-sm pl-10': size === 'md',
34
- 'sm:text-md p-4 pl-11': size === 'lg'
35
- },
36
- $$props.class
37
- )} />
38
- </div>
13
+ <div class="relative">
14
+ <div
15
+ class={classNames(
16
+ noBorderDivClass,
17
+ {
18
+ 'p-2 sm:text-xs': size === 'sm',
19
+ 'p-2.5 text-sm': size === 'md',
20
+ 'sm:text-md p-4': size === 'lg'
21
+ },
22
+ pointerEvent ? 'cursor-pointer' : 'pointer-events-none'
23
+ )}>
24
+ <slot />
25
+ </div>
26
+ <input
27
+ {...$$restProps}
28
+ bind:value
29
+ on:blur
30
+ on:change
31
+ on:click
32
+ on:focus
33
+ on:keydown
34
+ on:keypress
35
+ on:keyup
36
+ on:mouseover
37
+ on:mouseenter
38
+ on:mouseleave
39
+ on:paste
40
+ on:input
41
+ class={classNames(
42
+ noBorderInputClass,
43
+ {
44
+ 'p-2 sm:text-xs pl-9': size === 'sm',
45
+ 'p-2.5 text-sm pl-10': size === 'md',
46
+ 'sm:text-md p-4 pl-11': size === 'lg'
47
+ },
48
+ $$props.class
49
+ )} />
50
+ </div>
39
51
  {:else}
40
- <div class="flex">
41
- <span class={spanClass}>
42
- <slot />
43
- </span>
44
- <input
45
- {...$$restProps}
46
- bind:value
47
- class={classNames(
48
- inputClass,
49
- {
50
- 'p-2 sm:text-xs': size === 'sm',
51
- 'p-2.5 text-sm': size === 'md',
52
- 'sm:text-md p-4': size === 'lg'
53
- },
54
- $$props.class
55
- )} />
56
- </div>
52
+ <div class="flex">
53
+ <span class={spanClass}>
54
+ <slot />
55
+ </span>
56
+ <input
57
+ {...$$restProps}
58
+ bind:value
59
+ on:blur
60
+ on:change
61
+ on:click
62
+ on:focus
63
+ on:keydown
64
+ on:keypress
65
+ on:keyup
66
+ on:mouseover
67
+ on:mouseenter
68
+ on:mouseleave
69
+ on:paste
70
+ on:input
71
+ class={classNames(
72
+ inputClass,
73
+ {
74
+ 'p-2 sm:text-xs': size === 'sm',
75
+ 'p-2.5 text-sm': size === 'md',
76
+ 'sm:text-md p-4': size === 'lg'
77
+ },
78
+ $$props.class
79
+ )} />
80
+ </div>
57
81
  {/if}
package/forms/Iconinput.svelte.d.ts CHANGED
@@ -12,6 +12,19 @@ declare const __propDef: {
12
12
  noBorderDivClass?: string | undefined;
13
13
  };
14
14
  events: {
15
+ blur: FocusEvent;
16
+ change: Event;
17
+ click: MouseEvent;
18
+ focus: FocusEvent;
19
+ keydown: KeyboardEvent;
20
+ keypress: KeyboardEvent;
21
+ keyup: KeyboardEvent;
22
+ mouseover: MouseEvent;
23
+ mouseenter: MouseEvent;
24
+ mouseleave: MouseEvent;
25
+ paste: ClipboardEvent;
26
+ input: Event;
27
+ } & {
15
28
  [evt: string]: CustomEvent<any>;
16
29
  };
17
30
  slots: {
package/forms/Input.svelte CHANGED
@@ -19,31 +19,32 @@ const setType = (node) => {
19
19
  </script>
20
20
 
21
21
  <input
22
- {...$$restProps}
23
- bind:value
24
- on:blur
25
- on:change
26
- on:click
27
- on:focus
28
- on:keydown
29
- on:keypress
30
- on:keyup
31
- on:mouseover
32
- on:mouseenter
33
- on:mouseleave
34
- on:paste
35
- use:setType
36
- class={classNames(
37
- inputClass,
38
- colorClasses[color],
39
- color === 'base' &&
40
- (background
41
- ? 'dark:bg-gray-600 dark:border-gray-500'
42
- : 'dark:bg-gray-700 dark:border-gray-600'),
43
- {
44
- 'p-2 sm:text-xs': size === 'sm',
45
- 'p-2.5 text-sm': size === 'md',
46
- 'sm:text-md p-4': size === 'lg'
47
- },
48
- $$props.class
49
- )} />
22
+ {...$$restProps}
23
+ bind:value
24
+ on:blur
25
+ on:change
26
+ on:click
27
+ on:focus
28
+ on:keydown
29
+ on:keypress
30
+ on:keyup
31
+ on:mouseover
32
+ on:mouseenter
33
+ on:mouseleave
34
+ on:paste
35
+ on:input
36
+ use:setType
37
+ class={classNames(
38
+ inputClass,
39
+ colorClasses[color],
40
+ color === 'base' &&
41
+ (background
42
+ ? 'dark:bg-gray-600 dark:border-gray-500'
43
+ : 'dark:bg-gray-700 dark:border-gray-600'),
44
+ {
45
+ 'p-2 sm:text-xs': size === 'sm',
46
+ 'p-2.5 text-sm': size === 'md',
47
+ 'sm:text-md p-4': size === 'lg'
48
+ },
49
+ $$props.class
50
+ )} />
package/forms/Input.svelte.d.ts CHANGED
@@ -21,6 +21,7 @@ declare const __propDef: {
21
21
  mouseenter: MouseEvent;
22
22
  mouseleave: MouseEvent;
23
23
  paste: ClipboardEvent;
24
+ input: Event;
24
25
  } & {
25
26
  [evt: string]: CustomEvent<any>;
26
27
  };
package/package.json CHANGED
@@ -1,6 +1,6 @@
1
1
  {
2
2
  "name": "flowbite-svelte",
3
- "version": "0.26.30",
3
+ "version": "0.26.31",
4
4
  "description": "Flowbite components for Svelte",
5
5
  "main": "index.js",
6
6
  "author": {
package/tabs/TabHead.svelte CHANGED
@@ -1,4 +1,4 @@
1
- <script>export let tabStyle;
1
+ <script>export let tabStyle = 'default';
2
2
  export let customDivClass = '';
3
3
  export let customUlClass = '';
4
4
  const divClasses = {
package/tabs/TabHead.svelte.d.ts CHANGED
@@ -1,7 +1,7 @@
1
1
  import { SvelteComponentTyped } from "svelte";
2
2
  declare const __propDef: {
3
3
  props: {
4
- tabStyle: 'default' | 'full' | 'icon' | 'pill' | 'underline' | 'custom';
4
+ tabStyle?: "default" | "icon" | "custom" | "pill" | "underline" | "full" | undefined;
5
5
  customDivClass?: string | undefined;
6
6
  customUlClass?: string | undefined;
7
7
  };
package/tabs/TabHeadItem.svelte CHANGED
@@ -1,6 +1,6 @@
1
1
  <script>import classNames from 'classnames';
2
2
  export let id;
3
- export let tabStyle;
3
+ export let tabStyle = 'default';
4
4
  export let activeTabValue;
5
5
  export let customActiveClass = '';
6
6
  export let customInActiveClass = '';
package/tabs/TabHeadItem.svelte.d.ts CHANGED
@@ -3,7 +3,7 @@ declare const __propDef: {
3
3
  props: {
4
4
  [x: string]: any;
5
5
  id: number;
6
- tabStyle: string;
6
+ tabStyle?: "default" | "icon" | "custom" | "pill" | "underline" | "full" | undefined;
7
7
  activeTabValue: number;
8
8
  customActiveClass?: string | undefined;
9
9
  customInActiveClass?: string | undefined;
package/tabs/TabWrapper.svelte CHANGED
@@ -1,9 +1,8 @@
1
1
  <script>import classNames from 'classnames';
2
2
  export let divClass = 'w-full';
3
3
  export let tabStyle = 'default';
4
- export let activeTabValue;
5
4
  </script>
6
5
 
7
6
  <div class={classNames(divClass, $$props.class)}>
8
- <slot {tabStyle} {activeTabValue} />
7
+ <slot {tabStyle} />
9
8
  </div>
package/tabs/TabWrapper.svelte.d.ts CHANGED
@@ -4,7 +4,6 @@ declare const __propDef: {
4
4
  [x: string]: any;
5
5
  divClass?: string | undefined;
6
6
  tabStyle?: "default" | "icon" | "custom" | "pill" | "underline" | "full" | undefined;
7
- activeTabValue: number;
8
7
  };
9
8
  events: {
10
9
  [evt: string]: CustomEvent<any>;
@@ -12,7 +11,6 @@ declare const __propDef: {
12
11
  slots: {
13
12
  default: {
14
13
  tabStyle: "default" | "icon" | "custom" | "pill" | "underline" | "full";
15
- activeTabValue: number;
16
14
  };
17
15
  };
18
16
  };