flowbite-svelte 0.44.12 → 0.44.14
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.
- package/dist/buttons/Button.svelte +1 -1
- package/dist/buttons/GradientButton.svelte +1 -1
- package/dist/buttons/GradientButton.svelte.d.ts +3 -3
- package/dist/carousels/Carousel.svelte +1 -1
- package/dist/device-mockup/Android.svelte +25 -15
- package/dist/device-mockup/Android.svelte.d.ts +18 -11
- package/dist/device-mockup/Android.svelte.d.ts.map +1 -1
- package/dist/device-mockup/DefaultMockup.svelte +22 -12
- package/dist/device-mockup/DefaultMockup.svelte.d.ts +16 -9
- package/dist/device-mockup/DefaultMockup.svelte.d.ts.map +1 -1
- package/dist/device-mockup/Desktop.svelte +24 -0
- package/dist/device-mockup/Desktop.svelte.d.ts +31 -0
- package/dist/device-mockup/Desktop.svelte.d.ts.map +1 -0
- package/dist/device-mockup/DeviceMockup.svelte +18 -201
- package/dist/device-mockup/DeviceMockup.svelte.d.ts +0 -85
- package/dist/device-mockup/DeviceMockup.svelte.d.ts.map +1 -1
- package/dist/device-mockup/Ios.svelte +22 -12
- package/dist/device-mockup/Ios.svelte.d.ts +16 -9
- package/dist/device-mockup/Ios.svelte.d.ts.map +1 -1
- package/dist/device-mockup/Laptop.svelte +26 -0
- package/dist/device-mockup/Laptop.svelte.d.ts +31 -0
- package/dist/device-mockup/Laptop.svelte.d.ts.map +1 -0
- package/dist/device-mockup/Smartwatch.svelte +22 -6
- package/dist/device-mockup/Smartwatch.svelte.d.ts +16 -5
- package/dist/device-mockup/Smartwatch.svelte.d.ts.map +1 -1
- package/dist/device-mockup/Tablet.svelte +22 -12
- package/dist/device-mockup/Tablet.svelte.d.ts +16 -9
- package/dist/device-mockup/Tablet.svelte.d.ts.map +1 -1
- package/dist/index.d.ts +1 -2
- package/dist/index.js +3 -2
- package/dist/marquee/Marquee.svelte +55 -0
- package/dist/marquee/Marquee.svelte.d.ts +29 -0
- package/dist/marquee/Marquee.svelte.d.ts.map +1 -0
- package/dist/types.d.ts +1 -1
- package/dist/types.d.ts.map +1 -1
- package/package.json +13 -17
- package/dist/forms/RadioInline.svelte +0 -9
- package/dist/forms/RadioInline.svelte.d.ts +0 -29
- package/dist/forms/RadioInline.svelte.d.ts.map +0 -1
- package/dist/forms/VoiceSearch.svelte +0 -53
- package/dist/forms/VoiceSearch.svelte.d.ts +0 -42
- package/dist/forms/VoiceSearch.svelte.d.ts.map +0 -1
- package/dist/navbar/NavSidebarHamburger.svelte +0 -18
- package/dist/navbar/NavSidebarHamburger.svelte.d.ts +0 -27
- package/dist/navbar/NavSidebarHamburger.svelte.d.ts.map +0 -1
- package/dist/navbar/SidebarMenu.svelte +0 -36
- package/dist/navbar/SidebarMenu.svelte.d.ts +0 -31
- package/dist/navbar/SidebarMenu.svelte.d.ts.map +0 -1
|
@@ -1,50 +1,7 @@
|
|
|
1
1
|
import { SvelteComponent } from "svelte";
|
|
2
2
|
declare const __propDef: {
|
|
3
3
|
props: {
|
|
4
|
-
[x: string]: any;
|
|
5
4
|
device?: "default" | "ios" | "android" | "tablet" | "laptop" | "desktop" | "smartwatch" | undefined;
|
|
6
|
-
androidDiv?: string | undefined;
|
|
7
|
-
androidSlot?: string | undefined;
|
|
8
|
-
androidTop?: string | undefined;
|
|
9
|
-
androidLeftTop?: string | undefined;
|
|
10
|
-
androidLeftMid?: string | undefined;
|
|
11
|
-
androidLeftBot?: string | undefined;
|
|
12
|
-
androidRight?: string | undefined;
|
|
13
|
-
defaultDiv?: string | undefined;
|
|
14
|
-
defaultSlot?: string | undefined;
|
|
15
|
-
defaultTop?: string | undefined;
|
|
16
|
-
defaultLeftTop?: string | undefined;
|
|
17
|
-
defaultLeftBot?: string | undefined;
|
|
18
|
-
defaultRight?: string | undefined;
|
|
19
|
-
desktopInner?: string | undefined;
|
|
20
|
-
desktopBot?: string | undefined;
|
|
21
|
-
desktopBotUnder?: string | undefined;
|
|
22
|
-
destopDiv?: string | undefined;
|
|
23
|
-
desktopSlot?: string | undefined;
|
|
24
|
-
iosDiv?: string | undefined;
|
|
25
|
-
iosSlot?: string | undefined;
|
|
26
|
-
iosTop?: string | undefined;
|
|
27
|
-
iosLeftTop?: string | undefined;
|
|
28
|
-
iosLeftBot?: string | undefined;
|
|
29
|
-
iosRight?: string | undefined;
|
|
30
|
-
laptopDiv?: string | undefined;
|
|
31
|
-
laptopSlot?: string | undefined;
|
|
32
|
-
laptopInner?: string | undefined;
|
|
33
|
-
laptopBot?: string | undefined;
|
|
34
|
-
laptopBotCen?: string | undefined;
|
|
35
|
-
smartwatchDiv?: string | undefined;
|
|
36
|
-
smartwatchSlot?: string | undefined;
|
|
37
|
-
smartRightTop?: string | undefined;
|
|
38
|
-
smartRightBot?: string | undefined;
|
|
39
|
-
smartTop?: string | undefined;
|
|
40
|
-
smartBot?: string | undefined;
|
|
41
|
-
smartwatchInner?: string | undefined;
|
|
42
|
-
tabletDiv?: string | undefined;
|
|
43
|
-
tabletSlot?: string | undefined;
|
|
44
|
-
tabletLeftTop?: string | undefined;
|
|
45
|
-
tabletLeftMid?: string | undefined;
|
|
46
|
-
tabletLeftBot?: string | undefined;
|
|
47
|
-
tabletRight?: string | undefined;
|
|
48
5
|
};
|
|
49
6
|
events: {
|
|
50
7
|
[evt: string]: CustomEvent<any>;
|
|
@@ -60,48 +17,6 @@ export type DeviceMockupSlots = typeof __propDef.slots;
|
|
|
60
17
|
* [Go to docs](https://flowbite-svelte.com/)
|
|
61
18
|
* ## Props
|
|
62
19
|
* @prop export let device: 'default' | 'ios' | 'android' | 'tablet' | 'laptop' | 'desktop' | 'smartwatch' = 'default';
|
|
63
|
-
* @prop export let androidDiv: string = 'relative mx-auto border-gray-800 dark:border-gray-800 bg-gray-800 border-[14px] rounded-xl h-[600px] w-[300px] shadow-xl';
|
|
64
|
-
* @prop export let androidSlot: string = 'rounded-xl overflow-hidden w-[272px] h-[572px] bg-white dark:bg-gray-800';
|
|
65
|
-
* @prop export let androidTop: string = 'w-[148px] h-[18px] bg-gray-800 top-0 rounded-b-[1rem] left-1/2 -translate-x-1/2 absolute';
|
|
66
|
-
* @prop export let androidLeftTop: string = 'h-[32px] w-[3px] bg-gray-800 absolute -left-[17px] top-[72px] rounded-l-lg';
|
|
67
|
-
* @prop export let androidLeftMid: string = 'h-[46px] w-[3px] bg-gray-800 absolute -left-[17px] top-[124px] rounded-l-lg';
|
|
68
|
-
* @prop export let androidLeftBot: string = 'h-[46px] w-[3px] bg-gray-800 absolute -left-[17px] top-[178px] rounded-l-lg';
|
|
69
|
-
* @prop export let androidRight: string = 'h-[64px] w-[3px] bg-gray-800 absolute -right-[17px] top-[142px] rounded-r-lg';
|
|
70
|
-
* @prop export let defaultDiv: string = 'relative mx-auto border-gray-800 dark:border-gray-800 bg-gray-800 border-[14px] rounded-[2.5rem] h-[600px] w-[300px]';
|
|
71
|
-
* @prop export let defaultSlot: string = 'rounded-[2rem] overflow-hidden w-[272px] h-[572px] bg-white dark:bg-gray-800';
|
|
72
|
-
* @prop export let defaultTop: string = 'h-[32px] w-[3px] bg-gray-800 dark:bg-gray-800 absolute -left-[17px] top-[72px] rounded-l-lg';
|
|
73
|
-
* @prop export let defaultLeftTop: string = 'h-[46px] w-[3px] bg-gray-800 dark:bg-gray-800 absolute -left-[17px] top-[124px] rounded-l-lg';
|
|
74
|
-
* @prop export let defaultLeftBot: string = 'h-[46px] w-[3px] bg-gray-800 dark:bg-gray-800 absolute -left-[17px] top-[178px] rounded-l-lg';
|
|
75
|
-
* @prop export let defaultRight: string = 'h-[64px] w-[3px] bg-gray-800 dark:bg-gray-800 absolute -right-[17px] top-[142px] rounded-r-lg';
|
|
76
|
-
* @prop export let desktopInner: string = 'rounded-xl overflow-hidden h-[140px] md:h-[262px]';
|
|
77
|
-
* @prop export let desktopBot: string = 'relative mx-auto bg-gray-900 dark:bg-gray-700 rounded-b-xl h-[24px] max-w-[301px] md:h-[42px] md:max-w-[512px]';
|
|
78
|
-
* @prop export let desktopBotUnder: string = 'relative mx-auto bg-gray-800 rounded-b-xl h-[55px] max-w-[83px] md:h-[95px] md:max-w-[142px]';
|
|
79
|
-
* @prop export let destopDiv: string = 'relative mx-auto border-gray-800 dark:border-gray-800 bg-gray-800 border-[16px] rounded-t-xl h-[172px] max-w-[301px] md:h-[294px] md:max-w-[512px]';
|
|
80
|
-
* @prop export let desktopSlot: string = 'rounded-xl overflow-hidden h-[140px] md:h-[262px]';
|
|
81
|
-
* @prop export let iosDiv: string = 'relative mx-auto border-gray-800 dark:border-gray-800 bg-gray-800 border-[14px] rounded-[2.5rem] h-[600px] w-[300px] shadow-xl';
|
|
82
|
-
* @prop export let iosSlot: string = 'rounded-[2rem] overflow-hidden w-[272px] h-[572px] bg-white dark:bg-gray-800';
|
|
83
|
-
* @prop export let iosTop: string = 'w-[148px] h-[18px] bg-gray-800 top-0 rounded-b-[1rem] left-1/2 -translate-x-1/2 absolute';
|
|
84
|
-
* @prop export let iosLeftTop: string = 'h-[46px] w-[3px] bg-gray-800 absolute -left-[17px] top-[124px] rounded-l-lg';
|
|
85
|
-
* @prop export let iosLeftBot: string = 'h-[46px] w-[3px] bg-gray-800 absolute -left-[17px] top-[178px] rounded-l-lg';
|
|
86
|
-
* @prop export let iosRight: string = 'h-[64px] w-[3px] bg-gray-800 absolute -right-[17px] top-[142px] rounded-r-lg';
|
|
87
|
-
* @prop export let laptopDiv: string = 'relative mx-auto border-gray-800 dark:border-gray-800 bg-gray-800 border-[8px] rounded-t-xl h-[172px] max-w-[301px] md:h-[294px] md:max-w-[512px]';
|
|
88
|
-
* @prop export let laptopSlot: string = 'rounded-lg overflow-hidden h-[156px] md:h-[278px] bg-white dark:bg-gray-800';
|
|
89
|
-
* @prop export let laptopInner: string = 'rounded-lg overflow-hidden h-[156px] md:h-[278px] bg-white dark:bg-gray-800';
|
|
90
|
-
* @prop export let laptopBot: string = 'relative mx-auto bg-gray-900 dark:bg-gray-700 rounded-b-xl rounded-t-sm h-[17px] max-w-[351px] md:h-[21px] md:max-w-[597px]';
|
|
91
|
-
* @prop export let laptopBotCen: string = 'absolute left-1/2 top-0 -translate-x-1/2 rounded-b-xl w-[56px] h-[5px] md:w-[96px] md:h-[8px] bg-gray-800';
|
|
92
|
-
* @prop export let smartwatchDiv: string = 'relative mx-auto bg-gray-800 dark:bg-gray-700 rounded-t-[2.5rem] h-[63px] max-w-[133px]';
|
|
93
|
-
* @prop export let smartwatchSlot: string = 'rounded-[2rem] overflow-hidden h-[193px] w-[188px]';
|
|
94
|
-
* @prop export let smartRightTop: string = 'h-[41px] w-[6px] bg-gray-800 dark:bg-gray-800 absolute -right-[16px] top-[40px] rounded-r-lg';
|
|
95
|
-
* @prop export let smartRightBot: string = 'h-[32px] w-[6px] bg-gray-800 dark:bg-gray-800 absolute -right-[16px] top-[88px] rounded-r-lg';
|
|
96
|
-
* @prop export let smartTop: string = 'relative mx-auto border-gray-900 dark:bg-gray-800 dark:border-gray-800 border-[10px] rounded-[2.5rem] h-[213px] w-[208px]';
|
|
97
|
-
* @prop export let smartBot: string = 'relative mx-auto bg-gray-800 dark:bg-gray-700 rounded-b-[2.5rem] h-[63px] max-w-[133px]';
|
|
98
|
-
* @prop export let smartwatchInner: string = 'rounded-[2rem] overflow-hidden h-[193px] w-[188px]';
|
|
99
|
-
* @prop export let tabletDiv: string = 'relative mx-auto border-gray-800 dark:border-gray-800 bg-gray-800 border-[14px] rounded-[2.5rem] h-[454px] max-w-[341px] md:h-[682px] md:max-w-[512px]';
|
|
100
|
-
* @prop export let tabletSlot: string = 'rounded-[2rem] overflow-hidden h-[426px] md:h-[654px] bg-white dark:bg-gray-800';
|
|
101
|
-
* @prop export let tabletLeftTop: string = 'h-[32px] w-[3px] bg-gray-800 dark:bg-gray-800 absolute -left-[17px] top-[72px] rounded-l-lg';
|
|
102
|
-
* @prop export let tabletLeftMid: string = 'h-[46px] w-[3px] bg-gray-800 dark:bg-gray-800 absolute -left-[17px] top-[124px] rounded-l-lg';
|
|
103
|
-
* @prop export let tabletLeftBot: string = 'h-[46px] w-[3px] bg-gray-800 dark:bg-gray-800 absolute -left-[17px] top-[178px] rounded-l-lg';
|
|
104
|
-
* @prop export let tabletRight: string = 'h-[64px] w-[3px] bg-gray-800 dark:bg-gray-800 absolute -right-[17px] top-[142px] rounded-r-lg';
|
|
105
20
|
*/
|
|
106
21
|
export default class DeviceMockup extends SvelteComponent<DeviceMockupProps, DeviceMockupEvents, DeviceMockupSlots> {
|
|
107
22
|
}
|
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"file":"DeviceMockup.svelte.d.ts","sourceRoot":"","sources":["../../../../src/lib/device-mockup/DeviceMockup.svelte"],"names":[],"mappings":"AAAA,OAAO,EAAE,eAAe,EAAE,MAAM,QAAQ,CAEvC;
|
|
1
|
+
{"version":3,"file":"DeviceMockup.svelte.d.ts","sourceRoot":"","sources":["../../../../src/lib/device-mockup/DeviceMockup.svelte"],"names":[],"mappings":"AAAA,OAAO,EAAE,eAAe,EAAE,MAAM,QAAQ,CAEvC;AA8CD,QAAA,MAAM,SAAS;;;;;;;;;;CAAwC,CAAC;AACxD,MAAM,MAAM,iBAAiB,GAAG,OAAO,SAAS,CAAC,KAAK,CAAC;AACvD,MAAM,MAAM,kBAAkB,GAAG,OAAO,SAAS,CAAC,MAAM,CAAC;AACzD,MAAM,MAAM,iBAAiB,GAAG,OAAO,SAAS,CAAC,KAAK,CAAC;AAEvD;;;;GAIG;AACH,MAAM,CAAC,OAAO,OAAO,YAAa,SAAQ,eAAe,CAAC,iBAAiB,EAAE,kBAAkB,EAAE,iBAAiB,CAAC;CAClH"}
|
|
@@ -1,20 +1,30 @@
|
|
|
1
|
-
<script>
|
|
2
|
-
export let
|
|
3
|
-
export let
|
|
4
|
-
export let
|
|
1
|
+
<script>import { twMerge } from 'tailwind-merge';
|
|
2
|
+
export let div = 'relative mx-auto border-gray-800 dark:border-gray-800 bg-gray-800 border-[14px] rounded-[2.5rem] h-[600px] w-[300px] shadow-xl';
|
|
3
|
+
export let slot = 'rounded-[2rem] overflow-hidden w-[272px] h-[572px] bg-white dark:bg-gray-800';
|
|
4
|
+
export let top = 'w-[148px] h-[18px] bg-gray-800 top-0 rounded-b-[1rem] left-1/2 -translate-x-1/2 absolute';
|
|
5
|
+
export let leftTop = 'h-[46px] w-[3px] bg-gray-800 absolute -left-[17px] top-[124px] rounded-l-lg';
|
|
6
|
+
export let leftBot = 'h-[46px] w-[3px] bg-gray-800 absolute -left-[17px] top-[178px] rounded-l-lg';
|
|
7
|
+
export let right = 'h-[64px] w-[3px] bg-gray-800 absolute -right-[17px] top-[142px] rounded-r-lg';
|
|
5
8
|
</script>
|
|
6
9
|
|
|
7
|
-
<div class={
|
|
8
|
-
<div class={
|
|
9
|
-
<div class={
|
|
10
|
-
<div class={
|
|
10
|
+
<div class={twMerge(div, $$props.class)}>
|
|
11
|
+
<div class={twMerge(top, $$props.classTop)} />
|
|
12
|
+
<div class={twMerge(leftTop, $$props.classLeftTop)} />
|
|
13
|
+
<div class={twMerge(leftBot, $$props.classLeftBot)} />
|
|
14
|
+
<div class={twMerge(right, $$props.classRight)} />
|
|
15
|
+
<div class={twMerge(slot, $$props.classSlot)}>
|
|
16
|
+
<slot />
|
|
17
|
+
</div>
|
|
18
|
+
</div>
|
|
11
19
|
|
|
12
20
|
<!--
|
|
13
21
|
@component
|
|
14
22
|
[Go to docs](https://flowbite-svelte.com/)
|
|
15
23
|
## Props
|
|
16
|
-
@prop export let
|
|
17
|
-
@prop export let
|
|
18
|
-
@prop export let
|
|
19
|
-
@prop export let
|
|
24
|
+
@prop export let div: string = 'relative mx-auto border-gray-800 dark:border-gray-800 bg-gray-800 border-[14px] rounded-[2.5rem] h-[600px] w-[300px] shadow-xl';
|
|
25
|
+
@prop export let slot: string = 'rounded-[2rem] overflow-hidden w-[272px] h-[572px] bg-white dark:bg-gray-800';
|
|
26
|
+
@prop export let top: string = 'w-[148px] h-[18px] bg-gray-800 top-0 rounded-b-[1rem] left-1/2 -translate-x-1/2 absolute';
|
|
27
|
+
@prop export let leftTop: string = 'h-[46px] w-[3px] bg-gray-800 absolute -left-[17px] top-[124px] rounded-l-lg';
|
|
28
|
+
@prop export let leftBot: string = 'h-[46px] w-[3px] bg-gray-800 absolute -left-[17px] top-[178px] rounded-l-lg';
|
|
29
|
+
@prop export let right: string = 'h-[64px] w-[3px] bg-gray-800 absolute -right-[17px] top-[142px] rounded-r-lg';
|
|
20
30
|
-->
|
|
@@ -1,15 +1,20 @@
|
|
|
1
1
|
import { SvelteComponent } from "svelte";
|
|
2
2
|
declare const __propDef: {
|
|
3
3
|
props: {
|
|
4
|
-
|
|
5
|
-
|
|
6
|
-
|
|
7
|
-
|
|
4
|
+
[x: string]: any;
|
|
5
|
+
div?: string | undefined;
|
|
6
|
+
slot?: string | undefined;
|
|
7
|
+
top?: string | undefined;
|
|
8
|
+
leftTop?: string | undefined;
|
|
9
|
+
leftBot?: string | undefined;
|
|
10
|
+
right?: string | undefined;
|
|
8
11
|
};
|
|
9
12
|
events: {
|
|
10
13
|
[evt: string]: CustomEvent<any>;
|
|
11
14
|
};
|
|
12
|
-
slots: {
|
|
15
|
+
slots: {
|
|
16
|
+
default: {};
|
|
17
|
+
};
|
|
13
18
|
};
|
|
14
19
|
export type IosProps = typeof __propDef.props;
|
|
15
20
|
export type IosEvents = typeof __propDef.events;
|
|
@@ -17,10 +22,12 @@ export type IosSlots = typeof __propDef.slots;
|
|
|
17
22
|
/**
|
|
18
23
|
* [Go to docs](https://flowbite-svelte.com/)
|
|
19
24
|
* ## Props
|
|
20
|
-
* @prop export let
|
|
21
|
-
* @prop export let
|
|
22
|
-
* @prop export let
|
|
23
|
-
* @prop export let
|
|
25
|
+
* @prop export let div: string = 'relative mx-auto border-gray-800 dark:border-gray-800 bg-gray-800 border-[14px] rounded-[2.5rem] h-[600px] w-[300px] shadow-xl';
|
|
26
|
+
* @prop export let slot: string = 'rounded-[2rem] overflow-hidden w-[272px] h-[572px] bg-white dark:bg-gray-800';
|
|
27
|
+
* @prop export let top: string = 'w-[148px] h-[18px] bg-gray-800 top-0 rounded-b-[1rem] left-1/2 -translate-x-1/2 absolute';
|
|
28
|
+
* @prop export let leftTop: string = 'h-[46px] w-[3px] bg-gray-800 absolute -left-[17px] top-[124px] rounded-l-lg';
|
|
29
|
+
* @prop export let leftBot: string = 'h-[46px] w-[3px] bg-gray-800 absolute -left-[17px] top-[178px] rounded-l-lg';
|
|
30
|
+
* @prop export let right: string = 'h-[64px] w-[3px] bg-gray-800 absolute -right-[17px] top-[142px] rounded-r-lg';
|
|
24
31
|
*/
|
|
25
32
|
export default class Ios extends SvelteComponent<IosProps, IosEvents, IosSlots> {
|
|
26
33
|
}
|
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"file":"Ios.svelte.d.ts","sourceRoot":"","sources":["../../../../src/lib/device-mockup/Ios.svelte"],"names":[],"mappings":"AAAA,OAAO,EAAE,eAAe,EAAE,MAAM,QAAQ,CAEvC;
|
|
1
|
+
{"version":3,"file":"Ios.svelte.d.ts","sourceRoot":"","sources":["../../../../src/lib/device-mockup/Ios.svelte"],"names":[],"mappings":"AAAA,OAAO,EAAE,eAAe,EAAE,MAAM,QAAQ,CAEvC;AA4BD,QAAA,MAAM,SAAS;;;;;;;;;;;;;;;;CAA+D,CAAC;AAC/E,MAAM,MAAM,QAAQ,GAAG,OAAO,SAAS,CAAC,KAAK,CAAC;AAC9C,MAAM,MAAM,SAAS,GAAG,OAAO,SAAS,CAAC,MAAM,CAAC;AAChD,MAAM,MAAM,QAAQ,GAAG,OAAO,SAAS,CAAC,KAAK,CAAC;AAE9C;;;;;;;;;GASG;AACH,MAAM,CAAC,OAAO,OAAO,GAAI,SAAQ,eAAe,CAAC,QAAQ,EAAE,SAAS,EAAE,QAAQ,CAAC;CAC9E"}
|
|
@@ -0,0 +1,26 @@
|
|
|
1
|
+
<script>import { twMerge } from 'tailwind-merge';
|
|
2
|
+
export let div = 'relative mx-auto border-gray-800 dark:border-gray-800 bg-gray-800 border-[8px] rounded-t-xl h-[172px] max-w-[301px] md:h-[294px] md:max-w-[512px]';
|
|
3
|
+
export let inner = 'rounded-lg overflow-hidden h-[156px] md:h-[278px] bg-white dark:bg-gray-800';
|
|
4
|
+
export let bot = 'relative mx-auto bg-gray-900 dark:bg-gray-700 rounded-b-xl rounded-t-sm h-[17px] max-w-[351px] md:h-[21px] md:max-w-[597px]';
|
|
5
|
+
export let botCen = 'absolute left-1/2 top-0 -translate-x-1/2 rounded-b-xl w-[56px] h-[5px] md:w-[96px] md:h-[8px] bg-gray-800';
|
|
6
|
+
</script>
|
|
7
|
+
|
|
8
|
+
<div class={twMerge(div, $$props.class)}>
|
|
9
|
+
<div class={twMerge(inner, $$props.classInner)}>
|
|
10
|
+
<slot />
|
|
11
|
+
</div>
|
|
12
|
+
</div>
|
|
13
|
+
|
|
14
|
+
<div class={twMerge(bot, $$props.classBot)}>
|
|
15
|
+
<div class={twMerge(botCen, $$props.classBotCen)} />
|
|
16
|
+
</div>
|
|
17
|
+
|
|
18
|
+
<!--
|
|
19
|
+
@component
|
|
20
|
+
[Go to docs](https://flowbite-svelte.com/)
|
|
21
|
+
## Props
|
|
22
|
+
@prop export let div: string = 'relative mx-auto border-gray-800 dark:border-gray-800 bg-gray-800 border-[8px] rounded-t-xl h-[172px] max-w-[301px] md:h-[294px] md:max-w-[512px]';
|
|
23
|
+
@prop export let inner: string = 'rounded-lg overflow-hidden h-[156px] md:h-[278px] bg-white dark:bg-gray-800';
|
|
24
|
+
@prop export let bot: string = 'relative mx-auto bg-gray-900 dark:bg-gray-700 rounded-b-xl rounded-t-sm h-[17px] max-w-[351px] md:h-[21px] md:max-w-[597px]';
|
|
25
|
+
@prop export let botCen: string = 'absolute left-1/2 top-0 -translate-x-1/2 rounded-b-xl w-[56px] h-[5px] md:w-[96px] md:h-[8px] bg-gray-800';
|
|
26
|
+
-->
|
|
@@ -0,0 +1,31 @@
|
|
|
1
|
+
import { SvelteComponent } from "svelte";
|
|
2
|
+
declare const __propDef: {
|
|
3
|
+
props: {
|
|
4
|
+
[x: string]: any;
|
|
5
|
+
div?: string | undefined;
|
|
6
|
+
inner?: string | undefined;
|
|
7
|
+
bot?: string | undefined;
|
|
8
|
+
botCen?: string | undefined;
|
|
9
|
+
};
|
|
10
|
+
events: {
|
|
11
|
+
[evt: string]: CustomEvent<any>;
|
|
12
|
+
};
|
|
13
|
+
slots: {
|
|
14
|
+
default: {};
|
|
15
|
+
};
|
|
16
|
+
};
|
|
17
|
+
export type LaptopProps = typeof __propDef.props;
|
|
18
|
+
export type LaptopEvents = typeof __propDef.events;
|
|
19
|
+
export type LaptopSlots = typeof __propDef.slots;
|
|
20
|
+
/**
|
|
21
|
+
* [Go to docs](https://flowbite-svelte.com/)
|
|
22
|
+
* ## Props
|
|
23
|
+
* @prop export let div: string = 'relative mx-auto border-gray-800 dark:border-gray-800 bg-gray-800 border-[8px] rounded-t-xl h-[172px] max-w-[301px] md:h-[294px] md:max-w-[512px]';
|
|
24
|
+
* @prop export let inner: string = 'rounded-lg overflow-hidden h-[156px] md:h-[278px] bg-white dark:bg-gray-800';
|
|
25
|
+
* @prop export let bot: string = 'relative mx-auto bg-gray-900 dark:bg-gray-700 rounded-b-xl rounded-t-sm h-[17px] max-w-[351px] md:h-[21px] md:max-w-[597px]';
|
|
26
|
+
* @prop export let botCen: string = 'absolute left-1/2 top-0 -translate-x-1/2 rounded-b-xl w-[56px] h-[5px] md:w-[96px] md:h-[8px] bg-gray-800';
|
|
27
|
+
*/
|
|
28
|
+
export default class Laptop extends SvelteComponent<LaptopProps, LaptopEvents, LaptopSlots> {
|
|
29
|
+
}
|
|
30
|
+
export {};
|
|
31
|
+
//# sourceMappingURL=Laptop.svelte.d.ts.map
|
|
@@ -0,0 +1 @@
|
|
|
1
|
+
{"version":3,"file":"Laptop.svelte.d.ts","sourceRoot":"","sources":["../../../../src/lib/device-mockup/Laptop.svelte"],"names":[],"mappings":"AAAA,OAAO,EAAE,eAAe,EAAE,MAAM,QAAQ,CAEvC;AA0BD,QAAA,MAAM,SAAS;;;;;;;;;;;;;;CAA+D,CAAC;AAC/E,MAAM,MAAM,WAAW,GAAG,OAAO,SAAS,CAAC,KAAK,CAAC;AACjD,MAAM,MAAM,YAAY,GAAG,OAAO,SAAS,CAAC,MAAM,CAAC;AACnD,MAAM,MAAM,WAAW,GAAG,OAAO,SAAS,CAAC,KAAK,CAAC;AAEjD;;;;;;;GAOG;AACH,MAAM,CAAC,OAAO,OAAO,MAAO,SAAQ,eAAe,CAAC,WAAW,EAAE,YAAY,EAAE,WAAW,CAAC;CAC1F"}
|
|
@@ -1,14 +1,30 @@
|
|
|
1
|
-
<script>
|
|
2
|
-
export let
|
|
1
|
+
<script>import { twMerge } from 'tailwind-merge';
|
|
2
|
+
export let div = 'relative mx-auto bg-gray-800 dark:bg-gray-700 rounded-t-[2.5rem] h-[63px] max-w-[133px]';
|
|
3
|
+
export let slot = 'rounded-[2rem] overflow-hidden h-[193px] w-[188px]';
|
|
4
|
+
export let rightTop = 'h-[41px] w-[6px] bg-gray-800 dark:bg-gray-800 absolute -right-[16px] top-[40px] rounded-r-lg';
|
|
5
|
+
export let rightBot = 'h-[32px] w-[6px] bg-gray-800 dark:bg-gray-800 absolute -right-[16px] top-[88px] rounded-r-lg';
|
|
6
|
+
export let top = 'relative mx-auto border-gray-900 dark:bg-gray-800 dark:border-gray-800 border-[10px] rounded-[2.5rem] h-[213px] w-[208px]';
|
|
7
|
+
export let bot = 'relative mx-auto bg-gray-800 dark:bg-gray-700 rounded-b-[2.5rem] h-[63px] max-w-[133px]';
|
|
3
8
|
</script>
|
|
4
9
|
|
|
5
|
-
<div class={
|
|
6
|
-
<div class={
|
|
10
|
+
<div class={twMerge(div, $$props.class)} />
|
|
11
|
+
<div class={twMerge(top, $$props.classTop)}>
|
|
12
|
+
<div class={twMerge(rightTop, $$props.classRightTop)} />
|
|
13
|
+
<div class={twMerge(rightBot, $$props.classRightBot)} />
|
|
14
|
+
<div class={twMerge(slot, $$props.classSlot)}>
|
|
15
|
+
<slot />
|
|
16
|
+
</div>
|
|
17
|
+
</div>
|
|
18
|
+
<div class={twMerge(bot, $$props.classBot)} />
|
|
7
19
|
|
|
8
20
|
<!--
|
|
9
21
|
@component
|
|
10
22
|
[Go to docs](https://flowbite-svelte.com/)
|
|
11
23
|
## Props
|
|
12
|
-
@prop export let
|
|
13
|
-
@prop export let
|
|
24
|
+
@prop export let div: string = 'relative mx-auto bg-gray-800 dark:bg-gray-700 rounded-t-[2.5rem] h-[63px] max-w-[133px]';
|
|
25
|
+
@prop export let slot: string = 'rounded-[2rem] overflow-hidden h-[193px] w-[188px]';
|
|
26
|
+
@prop export let rightTop: string = 'h-[41px] w-[6px] bg-gray-800 dark:bg-gray-800 absolute -right-[16px] top-[40px] rounded-r-lg';
|
|
27
|
+
@prop export let rightBot: string = 'h-[32px] w-[6px] bg-gray-800 dark:bg-gray-800 absolute -right-[16px] top-[88px] rounded-r-lg';
|
|
28
|
+
@prop export let top: string = 'relative mx-auto border-gray-900 dark:bg-gray-800 dark:border-gray-800 border-[10px] rounded-[2.5rem] h-[213px] w-[208px]';
|
|
29
|
+
@prop export let bot: string = 'relative mx-auto bg-gray-800 dark:bg-gray-700 rounded-b-[2.5rem] h-[63px] max-w-[133px]';
|
|
14
30
|
-->
|
|
@@ -1,13 +1,20 @@
|
|
|
1
1
|
import { SvelteComponent } from "svelte";
|
|
2
2
|
declare const __propDef: {
|
|
3
3
|
props: {
|
|
4
|
-
|
|
5
|
-
|
|
4
|
+
[x: string]: any;
|
|
5
|
+
div?: string | undefined;
|
|
6
|
+
slot?: string | undefined;
|
|
7
|
+
rightTop?: string | undefined;
|
|
8
|
+
rightBot?: string | undefined;
|
|
9
|
+
top?: string | undefined;
|
|
10
|
+
bot?: string | undefined;
|
|
6
11
|
};
|
|
7
12
|
events: {
|
|
8
13
|
[evt: string]: CustomEvent<any>;
|
|
9
14
|
};
|
|
10
|
-
slots: {
|
|
15
|
+
slots: {
|
|
16
|
+
default: {};
|
|
17
|
+
};
|
|
11
18
|
};
|
|
12
19
|
export type SmartwatchProps = typeof __propDef.props;
|
|
13
20
|
export type SmartwatchEvents = typeof __propDef.events;
|
|
@@ -15,8 +22,12 @@ export type SmartwatchSlots = typeof __propDef.slots;
|
|
|
15
22
|
/**
|
|
16
23
|
* [Go to docs](https://flowbite-svelte.com/)
|
|
17
24
|
* ## Props
|
|
18
|
-
* @prop export let
|
|
19
|
-
* @prop export let
|
|
25
|
+
* @prop export let div: string = 'relative mx-auto bg-gray-800 dark:bg-gray-700 rounded-t-[2.5rem] h-[63px] max-w-[133px]';
|
|
26
|
+
* @prop export let slot: string = 'rounded-[2rem] overflow-hidden h-[193px] w-[188px]';
|
|
27
|
+
* @prop export let rightTop: string = 'h-[41px] w-[6px] bg-gray-800 dark:bg-gray-800 absolute -right-[16px] top-[40px] rounded-r-lg';
|
|
28
|
+
* @prop export let rightBot: string = 'h-[32px] w-[6px] bg-gray-800 dark:bg-gray-800 absolute -right-[16px] top-[88px] rounded-r-lg';
|
|
29
|
+
* @prop export let top: string = 'relative mx-auto border-gray-900 dark:bg-gray-800 dark:border-gray-800 border-[10px] rounded-[2.5rem] h-[213px] w-[208px]';
|
|
30
|
+
* @prop export let bot: string = 'relative mx-auto bg-gray-800 dark:bg-gray-700 rounded-b-[2.5rem] h-[63px] max-w-[133px]';
|
|
20
31
|
*/
|
|
21
32
|
export default class Smartwatch extends SvelteComponent<SmartwatchProps, SmartwatchEvents, SmartwatchSlots> {
|
|
22
33
|
}
|
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"file":"Smartwatch.svelte.d.ts","sourceRoot":"","sources":["../../../../src/lib/device-mockup/Smartwatch.svelte"],"names":[],"mappings":"AAAA,OAAO,EAAE,eAAe,EAAE,MAAM,QAAQ,CAEvC;
|
|
1
|
+
{"version":3,"file":"Smartwatch.svelte.d.ts","sourceRoot":"","sources":["../../../../src/lib/device-mockup/Smartwatch.svelte"],"names":[],"mappings":"AAAA,OAAO,EAAE,eAAe,EAAE,MAAM,QAAQ,CAEvC;AA4BD,QAAA,MAAM,SAAS;;;;;;;;;;;;;;;;CAA+D,CAAC;AAC/E,MAAM,MAAM,eAAe,GAAG,OAAO,SAAS,CAAC,KAAK,CAAC;AACrD,MAAM,MAAM,gBAAgB,GAAG,OAAO,SAAS,CAAC,MAAM,CAAC;AACvD,MAAM,MAAM,eAAe,GAAG,OAAO,SAAS,CAAC,KAAK,CAAC;AAErD;;;;;;;;;GASG;AACH,MAAM,CAAC,OAAO,OAAO,UAAW,SAAQ,eAAe,CAAC,eAAe,EAAE,gBAAgB,EAAE,eAAe,CAAC;CAC1G"}
|
|
@@ -1,20 +1,30 @@
|
|
|
1
|
-
<script>
|
|
2
|
-
export let
|
|
3
|
-
export let
|
|
4
|
-
export let
|
|
1
|
+
<script>import { twMerge } from 'tailwind-merge';
|
|
2
|
+
export let div = 'relative mx-auto border-gray-800 dark:border-gray-800 bg-gray-800 border-[14px] rounded-[2.5rem] h-[454px] max-w-[341px] md:h-[682px] md:max-w-[512px]';
|
|
3
|
+
export let slot = 'rounded-[2rem] overflow-hidden h-[426px] md:h-[654px] bg-white dark:bg-gray-800';
|
|
4
|
+
export let leftTop = 'h-[32px] w-[3px] bg-gray-800 dark:bg-gray-800 absolute -left-[17px] top-[72px] rounded-l-lg';
|
|
5
|
+
export let leftMid = 'h-[46px] w-[3px] bg-gray-800 dark:bg-gray-800 absolute -left-[17px] top-[124px] rounded-l-lg';
|
|
6
|
+
export let leftBot = 'h-[46px] w-[3px] bg-gray-800 dark:bg-gray-800 absolute -left-[17px] top-[178px] rounded-l-lg';
|
|
7
|
+
export let right = 'h-[64px] w-[3px] bg-gray-800 dark:bg-gray-800 absolute -right-[17px] top-[142px] rounded-r-lg';
|
|
5
8
|
</script>
|
|
6
9
|
|
|
7
|
-
<div class={
|
|
8
|
-
<div class={
|
|
9
|
-
<div class={
|
|
10
|
-
<div class={
|
|
10
|
+
<div class={twMerge(div, $$props.class)}>
|
|
11
|
+
<div class={twMerge(leftTop, $$props.classLeftTop)} />
|
|
12
|
+
<div class={twMerge(leftMid, $$props.classLeftMid)} />
|
|
13
|
+
<div class={twMerge(leftBot, $$props.classLeftBot)} />
|
|
14
|
+
<div class={twMerge(right, $$props.classRight)} />
|
|
15
|
+
<div class={twMerge(slot, $$props.classSlot)}>
|
|
16
|
+
<slot />
|
|
17
|
+
</div>
|
|
18
|
+
</div>
|
|
11
19
|
|
|
12
20
|
<!--
|
|
13
21
|
@component
|
|
14
22
|
[Go to docs](https://flowbite-svelte.com/)
|
|
15
23
|
## Props
|
|
16
|
-
@prop export let
|
|
17
|
-
@prop export let
|
|
18
|
-
@prop export let
|
|
19
|
-
@prop export let
|
|
24
|
+
@prop export let div: string = 'relative mx-auto border-gray-800 dark:border-gray-800 bg-gray-800 border-[14px] rounded-[2.5rem] h-[454px] max-w-[341px] md:h-[682px] md:max-w-[512px]';
|
|
25
|
+
@prop export let slot: string = 'rounded-[2rem] overflow-hidden h-[426px] md:h-[654px] bg-white dark:bg-gray-800';
|
|
26
|
+
@prop export let leftTop: string = 'h-[32px] w-[3px] bg-gray-800 dark:bg-gray-800 absolute -left-[17px] top-[72px] rounded-l-lg';
|
|
27
|
+
@prop export let leftMid: string = 'h-[46px] w-[3px] bg-gray-800 dark:bg-gray-800 absolute -left-[17px] top-[124px] rounded-l-lg';
|
|
28
|
+
@prop export let leftBot: string = 'h-[46px] w-[3px] bg-gray-800 dark:bg-gray-800 absolute -left-[17px] top-[178px] rounded-l-lg';
|
|
29
|
+
@prop export let right: string = 'h-[64px] w-[3px] bg-gray-800 dark:bg-gray-800 absolute -right-[17px] top-[142px] rounded-r-lg';
|
|
20
30
|
-->
|
|
@@ -1,15 +1,20 @@
|
|
|
1
1
|
import { SvelteComponent } from "svelte";
|
|
2
2
|
declare const __propDef: {
|
|
3
3
|
props: {
|
|
4
|
-
|
|
5
|
-
|
|
6
|
-
|
|
7
|
-
|
|
4
|
+
[x: string]: any;
|
|
5
|
+
div?: string | undefined;
|
|
6
|
+
slot?: string | undefined;
|
|
7
|
+
leftTop?: string | undefined;
|
|
8
|
+
leftMid?: string | undefined;
|
|
9
|
+
leftBot?: string | undefined;
|
|
10
|
+
right?: string | undefined;
|
|
8
11
|
};
|
|
9
12
|
events: {
|
|
10
13
|
[evt: string]: CustomEvent<any>;
|
|
11
14
|
};
|
|
12
|
-
slots: {
|
|
15
|
+
slots: {
|
|
16
|
+
default: {};
|
|
17
|
+
};
|
|
13
18
|
};
|
|
14
19
|
export type TabletProps = typeof __propDef.props;
|
|
15
20
|
export type TabletEvents = typeof __propDef.events;
|
|
@@ -17,10 +22,12 @@ export type TabletSlots = typeof __propDef.slots;
|
|
|
17
22
|
/**
|
|
18
23
|
* [Go to docs](https://flowbite-svelte.com/)
|
|
19
24
|
* ## Props
|
|
20
|
-
* @prop export let
|
|
21
|
-
* @prop export let
|
|
22
|
-
* @prop export let
|
|
23
|
-
* @prop export let
|
|
25
|
+
* @prop export let div: string = 'relative mx-auto border-gray-800 dark:border-gray-800 bg-gray-800 border-[14px] rounded-[2.5rem] h-[454px] max-w-[341px] md:h-[682px] md:max-w-[512px]';
|
|
26
|
+
* @prop export let slot: string = 'rounded-[2rem] overflow-hidden h-[426px] md:h-[654px] bg-white dark:bg-gray-800';
|
|
27
|
+
* @prop export let leftTop: string = 'h-[32px] w-[3px] bg-gray-800 dark:bg-gray-800 absolute -left-[17px] top-[72px] rounded-l-lg';
|
|
28
|
+
* @prop export let leftMid: string = 'h-[46px] w-[3px] bg-gray-800 dark:bg-gray-800 absolute -left-[17px] top-[124px] rounded-l-lg';
|
|
29
|
+
* @prop export let leftBot: string = 'h-[46px] w-[3px] bg-gray-800 dark:bg-gray-800 absolute -left-[17px] top-[178px] rounded-l-lg';
|
|
30
|
+
* @prop export let right: string = 'h-[64px] w-[3px] bg-gray-800 dark:bg-gray-800 absolute -right-[17px] top-[142px] rounded-r-lg';
|
|
24
31
|
*/
|
|
25
32
|
export default class Tablet extends SvelteComponent<TabletProps, TabletEvents, TabletSlots> {
|
|
26
33
|
}
|
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"file":"Tablet.svelte.d.ts","sourceRoot":"","sources":["../../../../src/lib/device-mockup/Tablet.svelte"],"names":[],"mappings":"AAAA,OAAO,EAAE,eAAe,EAAE,MAAM,QAAQ,CAEvC;
|
|
1
|
+
{"version":3,"file":"Tablet.svelte.d.ts","sourceRoot":"","sources":["../../../../src/lib/device-mockup/Tablet.svelte"],"names":[],"mappings":"AAAA,OAAO,EAAE,eAAe,EAAE,MAAM,QAAQ,CAEvC;AA4BD,QAAA,MAAM,SAAS;;;;;;;;;;;;;;;;CAA+D,CAAC;AAC/E,MAAM,MAAM,WAAW,GAAG,OAAO,SAAS,CAAC,KAAK,CAAC;AACjD,MAAM,MAAM,YAAY,GAAG,OAAO,SAAS,CAAC,MAAM,CAAC;AACnD,MAAM,MAAM,WAAW,GAAG,OAAO,SAAS,CAAC,KAAK,CAAC;AAEjD;;;;;;;;;GASG;AACH,MAAM,CAAC,OAAO,OAAO,MAAO,SAAQ,eAAe,CAAC,WAAW,EAAE,YAAY,EAAE,WAAW,CAAC;CAC1F"}
|
package/dist/index.d.ts
CHANGED
|
@@ -41,14 +41,12 @@ export { default as InputAddon } from "./forms/InputAddon.svelte";
|
|
|
41
41
|
export { default as Label } from "./forms/Label.svelte";
|
|
42
42
|
export { default as MultiSelect } from "./forms/MultiSelect.svelte";
|
|
43
43
|
export { default as NumberInput } from "./forms/NumberInput.svelte";
|
|
44
|
-
export { default as RadioInline } from "./forms/RadioInline.svelte";
|
|
45
44
|
export { default as Radio } from "./forms/Radio.svelte";
|
|
46
45
|
export { default as Range } from "./forms/Range.svelte";
|
|
47
46
|
export { default as Search } from "./forms/Search.svelte";
|
|
48
47
|
export { default as Select } from "./forms/Select.svelte";
|
|
49
48
|
export { default as Textarea } from "./forms/Textarea.svelte";
|
|
50
49
|
export { default as Toggle } from "./forms/Toggle.svelte";
|
|
51
|
-
export { default as VoiceSearch } from "./forms/VoiceSearch.svelte";
|
|
52
50
|
export { default as Gallery } from "./gallery/Gallery.svelte";
|
|
53
51
|
export { default as Indicator } from "./indicators/Indicator.svelte";
|
|
54
52
|
export { default as Kbd } from "./kbd/Kbd.svelte";
|
|
@@ -58,6 +56,7 @@ export { default as ArrowKeyRight } from "./kbd/ArrowKeyRight.svelte";
|
|
|
58
56
|
export { default as ArrowKeyUp } from "./kbd/ArrowKeyUp.svelte";
|
|
59
57
|
export { default as Listgroup } from "./list-group/Listgroup.svelte";
|
|
60
58
|
export { default as ListgroupItem } from "./list-group/ListgroupItem.svelte";
|
|
59
|
+
export { default as Marquee } from "./marquee/Marquee.svelte";
|
|
61
60
|
export { default as Modal } from "./modals/Modal.svelte";
|
|
62
61
|
export { default as MegaMenu } from "./megamenu/MegaMenu.svelte";
|
|
63
62
|
export { default as Navbar } from "./navbar/Navbar.svelte";
|
package/dist/index.js
CHANGED
|
@@ -78,14 +78,12 @@ export { default as InputAddon } from './forms/InputAddon.svelte';
|
|
|
78
78
|
export { default as Label } from './forms/Label.svelte';
|
|
79
79
|
export { default as MultiSelect } from './forms/MultiSelect.svelte';
|
|
80
80
|
export { default as NumberInput } from './forms/NumberInput.svelte';
|
|
81
|
-
export { default as RadioInline } from './forms/RadioInline.svelte';
|
|
82
81
|
export { default as Radio } from './forms/Radio.svelte';
|
|
83
82
|
export { default as Range } from './forms/Range.svelte';
|
|
84
83
|
export { default as Search } from './forms/Search.svelte';
|
|
85
84
|
export { default as Select } from './forms/Select.svelte';
|
|
86
85
|
export { default as Textarea } from './forms/Textarea.svelte';
|
|
87
86
|
export { default as Toggle } from './forms/Toggle.svelte';
|
|
88
|
-
export { default as VoiceSearch } from './forms/VoiceSearch.svelte';
|
|
89
87
|
|
|
90
88
|
// Gallery
|
|
91
89
|
export { default as Gallery } from './gallery/Gallery.svelte';
|
|
@@ -104,6 +102,9 @@ export { default as ArrowKeyUp } from './kbd/ArrowKeyUp.svelte';
|
|
|
104
102
|
export { default as Listgroup } from './list-group/Listgroup.svelte';
|
|
105
103
|
export { default as ListgroupItem } from './list-group/ListgroupItem.svelte';
|
|
106
104
|
|
|
105
|
+
// Marquee
|
|
106
|
+
export { default as Marquee } from './marquee/Marquee.svelte';
|
|
107
|
+
|
|
107
108
|
// Modals
|
|
108
109
|
export { default as Modal } from './modals/Modal.svelte';
|
|
109
110
|
|
|
@@ -0,0 +1,55 @@
|
|
|
1
|
+
<script>import { onDestroy, onMount } from 'svelte';
|
|
2
|
+
import { twMerge } from 'tailwind-merge';
|
|
3
|
+
export let speed = 1;
|
|
4
|
+
export let hoverSpeed = 1;
|
|
5
|
+
export let shadow = false;
|
|
6
|
+
let offset = 0;
|
|
7
|
+
let isHovering = false;
|
|
8
|
+
let marquee;
|
|
9
|
+
let intervalId;
|
|
10
|
+
let shadowClass = `after:content-[''] after:absolute after:block after:z-10 after:h-full before:content-[''] before:absolute
|
|
11
|
+
before:block before:z-10 before:h-full before:right-0 after:shadow-[10px_0_50px_65px_rgba(256,256,256,1)]
|
|
12
|
+
before:shadow-[-10px_0_50px_65px_rgba(256,256,256,1)] dark:after:shadow-[10px_0_50px_65px_rgba(16,24,39,1)]
|
|
13
|
+
dark:before:shadow-[-10px_0_50px_65px_rgba(16,24,39,1)]`;
|
|
14
|
+
let divCls = twMerge("relative flex overflow-hidden w-[100%]", shadow ? shadowClass : '', $$props.class);
|
|
15
|
+
onMount(() => {
|
|
16
|
+
intervalId = setInterval(() => {
|
|
17
|
+
if (Math.abs(offset) >= marquee.offsetWidth) {
|
|
18
|
+
offset = 0;
|
|
19
|
+
}
|
|
20
|
+
else {
|
|
21
|
+
if (isHovering)
|
|
22
|
+
offset -= hoverSpeed;
|
|
23
|
+
else
|
|
24
|
+
offset -= speed;
|
|
25
|
+
}
|
|
26
|
+
}, 5);
|
|
27
|
+
});
|
|
28
|
+
onDestroy(() => intervalId);
|
|
29
|
+
</script>
|
|
30
|
+
|
|
31
|
+
<!-- svelte-ignore a11y-mouse-events-have-key-events -->
|
|
32
|
+
<div
|
|
33
|
+
class={divCls}
|
|
34
|
+
role="banner"
|
|
35
|
+
on:mouseover={() => (isHovering = true)}
|
|
36
|
+
on:mouseleave={() => (isHovering = false)}>
|
|
37
|
+
<div
|
|
38
|
+
class="flex justify-around items-center min-w-[100%]"
|
|
39
|
+
style="transform: {`translateX(${offset}px)`}"
|
|
40
|
+
bind:this={marquee}>
|
|
41
|
+
<slot />
|
|
42
|
+
</div>
|
|
43
|
+
<div class="flex justify-around items-center min-w-[100%]" style="transform: {`translateX(${offset}px)`}">
|
|
44
|
+
<slot />
|
|
45
|
+
</div>
|
|
46
|
+
</div>
|
|
47
|
+
|
|
48
|
+
<!--
|
|
49
|
+
@component
|
|
50
|
+
[Go to docs](https://flowbite-svelte.com/)
|
|
51
|
+
## Props
|
|
52
|
+
@prop export let speed: number = 1;
|
|
53
|
+
@prop export let hoverSpeed: number = 1;
|
|
54
|
+
@prop export let shadow: boolean = false;
|
|
55
|
+
-->
|
|
@@ -0,0 +1,29 @@
|
|
|
1
|
+
import { SvelteComponent } from "svelte";
|
|
2
|
+
declare const __propDef: {
|
|
3
|
+
props: {
|
|
4
|
+
[x: string]: any;
|
|
5
|
+
speed?: number | undefined;
|
|
6
|
+
hoverSpeed?: number | undefined;
|
|
7
|
+
shadow?: boolean | undefined;
|
|
8
|
+
};
|
|
9
|
+
events: {
|
|
10
|
+
[evt: string]: CustomEvent<any>;
|
|
11
|
+
};
|
|
12
|
+
slots: {
|
|
13
|
+
default: {};
|
|
14
|
+
};
|
|
15
|
+
};
|
|
16
|
+
export type MarqueeProps = typeof __propDef.props;
|
|
17
|
+
export type MarqueeEvents = typeof __propDef.events;
|
|
18
|
+
export type MarqueeSlots = typeof __propDef.slots;
|
|
19
|
+
/**
|
|
20
|
+
* [Go to docs](https://flowbite-svelte.com/)
|
|
21
|
+
* ## Props
|
|
22
|
+
* @prop export let speed: number = 1;
|
|
23
|
+
* @prop export let hoverSpeed: number = 1;
|
|
24
|
+
* @prop export let shadow: boolean = false;
|
|
25
|
+
*/
|
|
26
|
+
export default class Marquee extends SvelteComponent<MarqueeProps, MarqueeEvents, MarqueeSlots> {
|
|
27
|
+
}
|
|
28
|
+
export {};
|
|
29
|
+
//# sourceMappingURL=Marquee.svelte.d.ts.map
|
|
@@ -0,0 +1 @@
|
|
|
1
|
+
{"version":3,"file":"Marquee.svelte.d.ts","sourceRoot":"","sources":["../../../../src/lib/marquee/Marquee.svelte"],"names":[],"mappings":"AAAA,OAAO,EAAE,eAAe,EAAE,MAAM,QAAQ,CAEvC;AAmDD,QAAA,MAAM,SAAS;;;;;;;;;;;;;CAA+D,CAAC;AAC/E,MAAM,MAAM,YAAY,GAAG,OAAO,SAAS,CAAC,KAAK,CAAC;AAClD,MAAM,MAAM,aAAa,GAAG,OAAO,SAAS,CAAC,MAAM,CAAC;AACpD,MAAM,MAAM,YAAY,GAAG,OAAO,SAAS,CAAC,KAAK,CAAC;AAElD;;;;;;GAMG;AACH,MAAM,CAAC,OAAO,OAAO,OAAQ,SAAQ,eAAe,CAAC,YAAY,EAAE,aAAa,EAAE,YAAY,CAAC;CAC9F"}
|
package/dist/types.d.ts
CHANGED
|
@@ -1,7 +1,7 @@
|
|
|
1
1
|
import type { SvelteComponent } from 'svelte';
|
|
2
2
|
export type BlockQuoteType = 'xs' | 'sm' | 'base' | 'lg' | 'xl' | '2xl' | '3xl' | '4xl' | '5xl' | '6xl' | '7xl' | '8xl' | '9xl';
|
|
3
3
|
export type ButtonType = 'button' | 'submit' | 'reset';
|
|
4
|
-
export type ButtonColorType = 'alternative' | 'blue' | '
|
|
4
|
+
export type ButtonColorType = 'alternative' | 'blue' | 'dark' | 'green' | 'light' | 'primary' | 'purple' | 'red' | 'yellow' | 'none';
|
|
5
5
|
export type Colors = 'blue' | 'gray' | 'red' | 'yellow' | 'purple' | 'green' | 'indigo' | 'pink' | 'white' | 'custom' | 'primary' | 'secondary';
|
|
6
6
|
export type ImgType = {
|
|
7
7
|
src: string;
|
package/dist/types.d.ts.map
CHANGED
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"file":"types.d.ts","sourceRoot":"","sources":["../../../src/lib/types.ts"],"names":[],"mappings":"AAAA,OAAO,KAAK,EAAE,eAAe,EAAE,MAAM,QAAQ,CAAC;AAE9C,MAAM,MAAM,cAAc,GAAG,IAAI,GAAG,IAAI,GAAG,MAAM,GAAG,IAAI,GAAG,IAAI,GAAG,KAAK,GAAG,KAAK,GAAG,KAAK,GAAG,KAAK,GAAG,KAAK,GAAG,KAAK,GAAG,KAAK,GAAG,KAAK,CAAC;AAEhI,MAAM,MAAM,UAAU,GAAG,QAAQ,GAAG,QAAQ,GAAG,OAAO,CAAC;AAEvD,MAAM,MAAM,eAAe,GAAG,aAAa,GAAG,MAAM,GAAG,MAAM,GAAG,
|
|
1
|
+
{"version":3,"file":"types.d.ts","sourceRoot":"","sources":["../../../src/lib/types.ts"],"names":[],"mappings":"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"}
|