Skip to content

Commit a3a6efe

Browse files
rinturajrinturaj
committed
completed funtionality 👩🏻‍💻
1 parent cf7c426 commit a3a6efe

38 files changed

+1009
-105
lines changed

‎package.json

Lines changed: 4 additions & 1 deletion
Original file line numberDiff line numberDiff line change
@@ -19,6 +19,7 @@
1919
"autoprefixer": "^10.4.20",
2020
"bits-ui": "^0.21.16",
2121
"clsx": "^2.1.1",
22+
"lucide-svelte": "^0.468.0",
2223
"prettier": "^3.3.2",
2324
"prettier-plugin-svelte": "^3.2.6",
2425
"prettier-plugin-tailwindcss": "^0.6.5",
@@ -33,6 +34,8 @@
3334
},
3435
"dependencies": {
3536
"@tailwindcss/typography": "^0.5.15",
36-
"monaco-editor": "^0.52.2"
37+
"mode-watcher": "^0.5.0",
38+
"monaco-editor": "^0.52.2",
39+
"svelte-sonner": "^0.3.28"
3740
}
3841
}

‎pnpm-lock.yaml

Lines changed: 36 additions & 0 deletions
Some generated files are not rendered by default. Learn more about customizing how changed files appear on GitHub.

‎src/lib/components/ui/card/card-content.svelte

Lines changed: 13 additions & 0 deletions
Original file line numberDiff line numberDiff line change
@@ -0,0 +1,13 @@
1+
<script lang="ts">
2+
import type { HTMLAttributes } from "svelte/elements";
3+
import { cn } from "$lib/utils.js";
4+
5+
type $$Props = HTMLAttributes<HTMLDivElement>;
6+
7+
let className: $$Props["class"] = undefined;
8+
export { className as class };
9+
</script>
10+
11+
<div class={cn("p-6", className)} {...$$restProps}>
12+
<slot />
13+
</div>

‎src/lib/components/ui/card/card-description.svelte

Lines changed: 13 additions & 0 deletions
Original file line numberDiff line numberDiff line change
@@ -0,0 +1,13 @@
1+
<script lang="ts">
2+
import type { HTMLAttributes } from "svelte/elements";
3+
import { cn } from "$lib/utils.js";
4+
5+
type $$Props = HTMLAttributes<HTMLParagraphElement>;
6+
7+
let className: $$Props["class"] = undefined;
8+
export { className as class };
9+
</script>
10+
11+
<p class={cn("text-muted-foreground text-sm", className)} {...$$restProps}>
12+
<slot />
13+
</p>

‎src/lib/components/ui/card/card-footer.svelte

Lines changed: 13 additions & 0 deletions
Original file line numberDiff line numberDiff line change
@@ -0,0 +1,13 @@
1+
<script lang="ts">
2+
import type { HTMLAttributes } from "svelte/elements";
3+
import { cn } from "$lib/utils.js";
4+
5+
type $$Props = HTMLAttributes<HTMLDivElement>;
6+
7+
let className: $$Props["class"] = undefined;
8+
export { className as class };
9+
</script>
10+
11+
<div class={cn("flex items-center p-6 pt-0", className)} {...$$restProps}>
12+
<slot />
13+
</div>

‎src/lib/components/ui/card/card-header.svelte

Lines changed: 13 additions & 0 deletions
Original file line numberDiff line numberDiff line change
@@ -0,0 +1,13 @@
1+
<script lang="ts">
2+
import type { HTMLAttributes } from "svelte/elements";
3+
import { cn } from "$lib/utils.js";
4+
5+
type $$Props = HTMLAttributes<HTMLDivElement>;
6+
7+
let className: $$Props["class"] = undefined;
8+
export { className as class };
9+
</script>
10+
11+
<div class={cn("flex flex-col space-y-1.5 p-6 pb-0", className)} {...$$restProps}>
12+
<slot />
13+
</div>

‎src/lib/components/ui/card/card-title.svelte

Lines changed: 21 additions & 0 deletions
Original file line numberDiff line numberDiff line change
@@ -0,0 +1,21 @@
1+
<script lang="ts">
2+
import type { HTMLAttributes } from "svelte/elements";
3+
import type { HeadingLevel } from "./index.js";
4+
import { cn } from "$lib/utils.js";
5+
6+
type $$Props = HTMLAttributes<HTMLHeadingElement> & {
7+
tag?: HeadingLevel;
8+
};
9+
10+
let className: $$Props["class"] = undefined;
11+
export let tag: $$Props["tag"] = "h3";
12+
export { className as class };
13+
</script>
14+
15+
<svelte:element
16+
this={tag}
17+
class={cn("text-lg font-semibold leading-none tracking-tight", className)}
18+
{...$$restProps}
19+
>
20+
<slot />
21+
</svelte:element>

‎src/lib/components/ui/card/card.svelte

Lines changed: 16 additions & 0 deletions
Original file line numberDiff line numberDiff line change
@@ -0,0 +1,16 @@
1+
<script lang="ts">
2+
import type { HTMLAttributes } from "svelte/elements";
3+
import { cn } from "$lib/utils.js";
4+
5+
type $$Props = HTMLAttributes<HTMLDivElement>;
6+
7+
let className: $$Props["class"] = undefined;
8+
export { className as class };
9+
</script>
10+
11+
<div
12+
class={cn("bg-card text-card-foreground rounded-lg border shadow-sm", className)}
13+
{...$$restProps}
14+
>
15+
<slot />
16+
</div>

‎src/lib/components/ui/card/index.ts

Lines changed: 24 additions & 0 deletions
Original file line numberDiff line numberDiff line change
@@ -0,0 +1,24 @@
1+
import Root from "./card.svelte";
2+
import Content from "./card-content.svelte";
3+
import Description from "./card-description.svelte";
4+
import Footer from "./card-footer.svelte";
5+
import Header from "./card-header.svelte";
6+
import Title from "./card-title.svelte";
7+
8+
export {
9+
Root,
10+
Content,
11+
Description,
12+
Footer,
13+
Header,
14+
Title,
15+
//
16+
Root as Card,
17+
Content as CardContent,
18+
Description as CardDescription,
19+
Footer as CardFooter,
20+
Header as CardHeader,
21+
Title as CardTitle,
22+
};
23+
24+
export type HeadingLevel = "h1" | "h2" | "h3" | "h4" | "h5" | "h6";

‎src/lib/components/ui/checkbox/checkbox.svelte

Lines changed: 35 additions & 0 deletions
Original file line numberDiff line numberDiff line change
@@ -0,0 +1,35 @@
1+
<script lang="ts">
2+
import { Checkbox as CheckboxPrimitive } from "bits-ui";
3+
import Check from "lucide-svelte/icons/check";
4+
import Minus from "lucide-svelte/icons/minus";
5+
import { cn } from "$lib/utils.js";
6+
7+
type $$Props = CheckboxPrimitive.Props;
8+
type $$Events = CheckboxPrimitive.Events;
9+
10+
let className: $$Props["class"] = undefined;
11+
export let checked: $$Props["checked"] = false;
12+
export { className as class };
13+
</script>
14+
15+
<CheckboxPrimitive.Root
16+
class={cn(
17+
"border-primary ring-offset-background focus-visible:ring-ring data-[state=checked]:bg-primary data-[state=checked]:text-primary-foreground peer box-content h-4 w-4 shrink-0 rounded-sm border focus-visible:outline-none focus-visible:ring-2 focus-visible:ring-offset-2 disabled:cursor-not-allowed disabled:opacity-50 data-[disabled=true]:cursor-not-allowed data-[disabled=true]:opacity-50",
18+
className
19+
)}
20+
bind:checked
21+
{...$$restProps}
22+
on:click
23+
>
24+
<CheckboxPrimitive.Indicator
25+
class={cn("flex h-4 w-4 items-center justify-center text-current")}
26+
let:isChecked
27+
let:isIndeterminate
28+
>
29+
{#if isChecked}
30+
<Check class="h-3.5 w-3.5" />
31+
{:else if isIndeterminate}
32+
<Minus class="h-3.5 w-3.5" />
33+
{/if}
34+
</CheckboxPrimitive.Indicator>
35+
</CheckboxPrimitive.Root>

‎src/lib/components/ui/checkbox/index.ts

Lines changed: 6 additions & 0 deletions
Original file line numberDiff line numberDiff line change
@@ -0,0 +1,6 @@
1+
import Root from "./checkbox.svelte";
2+
export {
3+
Root,
4+
//
5+
Root as Checkbox,
6+
};

‎src/lib/components/ui/dropdown-menu/dropdown-menu-checkbox-item.svelte

Lines changed: 35 additions & 0 deletions
Original file line numberDiff line numberDiff line change
@@ -0,0 +1,35 @@
1+
<script lang="ts">
2+
import { DropdownMenu as DropdownMenuPrimitive } from "bits-ui";
3+
import Check from "lucide-svelte/icons/check";
4+
import { cn } from "$lib/utils.js";
5+
6+
type $$Props = DropdownMenuPrimitive.CheckboxItemProps;
7+
type $$Events = DropdownMenuPrimitive.CheckboxItemEvents;
8+
9+
let className: $$Props["class"] = undefined;
10+
export let checked: $$Props["checked"] = undefined;
11+
export { className as class };
12+
</script>
13+
14+
<DropdownMenuPrimitive.CheckboxItem
15+
bind:checked
16+
class={cn(
17+
"data-[highlighted]:bg-accent data-[highlighted]:text-accent-foreground relative flex cursor-default select-none items-center rounded-sm py-1.5 pl-8 pr-2 text-sm outline-none data-[disabled]:pointer-events-none data-[disabled]:opacity-50",
18+
className
19+
)}
20+
{...$$restProps}
21+
on:click
22+
on:keydown
23+
on:focusin
24+
on:focusout
25+
on:pointerdown
26+
on:pointerleave
27+
on:pointermove
28+
>
29+
<span class="absolute left-2 flex h-3.5 w-3.5 items-center justify-center">
30+
<DropdownMenuPrimitive.CheckboxIndicator>
31+
<Check class="h-4 w-4" />
32+
</DropdownMenuPrimitive.CheckboxIndicator>
33+
</span>
34+
<slot />
35+
</DropdownMenuPrimitive.CheckboxItem>

‎src/lib/components/ui/dropdown-menu/dropdown-menu-content.svelte

Lines changed: 27 additions & 0 deletions
Original file line numberDiff line numberDiff line change
@@ -0,0 +1,27 @@
1+
<script lang="ts">
2+
import { DropdownMenu as DropdownMenuPrimitive } from "bits-ui";
3+
import { cn, flyAndScale } from "$lib/utils.js";
4+
5+
type $$Props = DropdownMenuPrimitive.ContentProps;
6+
type $$Events = DropdownMenuPrimitive.ContentEvents;
7+
8+
let className: $$Props["class"] = undefined;
9+
export let sideOffset: $$Props["sideOffset"] = 4;
10+
export let transition: $$Props["transition"] = flyAndScale;
11+
export let transitionConfig: $$Props["transitionConfig"] = undefined;
12+
export { className as class };
13+
</script>
14+
15+
<DropdownMenuPrimitive.Content
16+
{transition}
17+
{transitionConfig}
18+
{sideOffset}
19+
class={cn(
20+
"bg-popover text-popover-foreground z-50 min-w-[8rem] rounded-md border p-1 shadow-md focus:outline-none",
21+
className
22+
)}
23+
{...$$restProps}
24+
on:keydown
25+
>
26+
<slot />
27+
</DropdownMenuPrimitive.Content>

‎src/lib/components/ui/dropdown-menu/dropdown-menu-item.svelte

Lines changed: 31 additions & 0 deletions
Original file line numberDiff line numberDiff line change
@@ -0,0 +1,31 @@
1+
<script lang="ts">
2+
import { DropdownMenu as DropdownMenuPrimitive } from "bits-ui";
3+
import { cn } from "$lib/utils.js";
4+
5+
type $$Props = DropdownMenuPrimitive.ItemProps & {
6+
inset?: boolean;
7+
};
8+
type $$Events = DropdownMenuPrimitive.ItemEvents;
9+
10+
let className: $$Props["class"] = undefined;
11+
export let inset: $$Props["inset"] = undefined;
12+
export { className as class };
13+
</script>
14+
15+
<DropdownMenuPrimitive.Item
16+
class={cn(
17+
"data-[highlighted]:bg-accent data-[highlighted]:text-accent-foreground relative flex cursor-default select-none items-center rounded-sm px-2 py-1.5 text-sm outline-none data-[disabled]:pointer-events-none data-[disabled]:opacity-50",
18+
inset && "pl-8",
19+
className
20+
)}
21+
{...$$restProps}
22+
on:click
23+
on:keydown
24+
on:focusin
25+
on:focusout
26+
on:pointerdown
27+
on:pointerleave
28+
on:pointermove
29+
>
30+
<slot />
31+
</DropdownMenuPrimitive.Item>

‎src/lib/components/ui/dropdown-menu/dropdown-menu-label.svelte

Lines changed: 19 additions & 0 deletions
Original file line numberDiff line numberDiff line change
@@ -0,0 +1,19 @@
1+
<script lang="ts">
2+
import { DropdownMenu as DropdownMenuPrimitive } from "bits-ui";
3+
import { cn } from "$lib/utils.js";
4+
5+
type $$Props = DropdownMenuPrimitive.LabelProps & {
6+
inset?: boolean;
7+
};
8+
9+
let className: $$Props["class"] = undefined;
10+
export let inset: $$Props["inset"] = undefined;
11+
export { className as class };
12+
</script>
13+
14+
<DropdownMenuPrimitive.Label
15+
class={cn("px-2 py-1.5 text-sm font-semibold", inset && "pl-8", className)}
16+
{...$$restProps}
17+
>
18+
<slot />
19+
</DropdownMenuPrimitive.Label>

0 commit comments

Comments
 (0)