Skip to content

Commit

Permalink
chore(lint): tsc svelte module export errors suppressed only for linting
Browse files Browse the repository at this point in the history
- Add new icons: Minus, Circle, ChevronRight, and Search
- Exclude certain files from tsconfig.json
- Remove preventScroll property from Dialog.Root in FindDialog.svelte
- Update icon import paths in command-input.svelte, menubar-radio-item.svelte, menubar-sub-trigger.svelte, context-menu-radio-item.svelte, menubar-checkbox-item.svelte, context-menu-checkbox-item.svelte, dialog-content.svelte
- Adjust styling in AboutDialog.svelte and EditorTitle.svelte
  • Loading branch information
Muhammed-Rahif committed Dec 1, 2024
1 parent 29b0797 commit d91c1e8
Show file tree
Hide file tree
Showing 24 changed files with 111 additions and 272 deletions.
2 changes: 1 addition & 1 deletion package.json
Original file line number Diff line number Diff line change
Expand Up @@ -10,7 +10,7 @@
"check": "svelte-check --tsconfig ./tsconfig.json",
"predeploy": "npm run build",
"deploy": "gh-pages -d www -m 'chore(gh-pages): updates' -f --nojekyll",
"lint": "prettier --check . && eslint . && npx tsc --noEmit",
"lint": "prettier --check . && eslint . && npx tsc --noEmit --project tsconfig.check.json",
"format": "prettier --write .",
"tauri": "tauri"
},
Expand Down
4 changes: 3 additions & 1 deletion src/app.json
Original file line number Diff line number Diff line change
@@ -1 +1,3 @@
{}
{
"version": "1.0.0-3"
}
2 changes: 1 addition & 1 deletion src/lib/components/AboutDialog.svelte
Original file line number Diff line number Diff line change
Expand Up @@ -46,7 +46,7 @@
<Dialog.Title>About Notpad</Dialog.Title>
</Dialog.Header>

<div class="max-h-[60vh] overflow-y-auto pr-3 text-base">
<div class="max-h-[60vh] overflow-y-auto pr-2 text-base">
<div class="mb-3 flex flex-row items-center justify-start gap-4 text-left">
<img class="w-20" alt="icon" src={$mode == 'dark' ? appIconDark : appIconLight} />

Expand Down
2 changes: 1 addition & 1 deletion src/lib/components/EditorTitle.svelte
Original file line number Diff line number Diff line change
Expand Up @@ -91,7 +91,7 @@
class={cn('h-6 w-6 p-0', {
'pointer-events-none opacity-0 group-hover:pointer-events-auto group-hover:opacity-100':
$activeTabId !== editor.id,
'ml-1.5 mr-1': $activeTabId === editor.id
'ml-1 mr-1': $activeTabId === editor.id
})}
variant={$activeTabId === editor.id ? 'secondary' : 'link'}
>
Expand Down
2 changes: 1 addition & 1 deletion src/lib/components/FindDialog.svelte
Original file line number Diff line number Diff line change
Expand Up @@ -40,7 +40,7 @@
});
</script>

<Dialog.Root open={$open} onOpenChange={open.set} preventScroll={false}>
<Dialog.Root open={$open} onOpenChange={open.set}>
<Dialog.Content class="top-14 translate-y-0">
<Dialog.Header>
<Dialog.Title>Find And Replace</Dialog.Title>
Expand Down
2 changes: 1 addition & 1 deletion src/lib/components/MenuBar.svelte
Original file line number Diff line number Diff line change
Expand Up @@ -147,7 +147,7 @@
<Menubar.Menu>
<Menubar.Trigger>Help</Menubar.Trigger>
<Menubar.Content>
<Menubar.Item class="flex items-center gap-2" on:click={openShortcutsDialog}>
<Menubar.Item class="flex items-center gap-2" onclick={openShortcutsDialog}>
<KeyboardIcon class="text-xl" />
Shortcuts
</Menubar.Item>
Expand Down
2 changes: 1 addition & 1 deletion src/lib/components/font-dialog/FontDialog.svelte
Original file line number Diff line number Diff line change
Expand Up @@ -47,7 +47,7 @@
</Dialog.Description>
</Dialog.Header>

<div class="flex max-h-[50vh] w-full flex-col gap-6 overflow-y-auto pb-1 pr-3">
<div class="flex max-h-[50vh] w-full flex-col gap-6 overflow-y-auto pb-1 pr-2">
<div class="flex gap-3 max-[464px]:flex-col">
<FontFamilyCombobox bind:value={fontFamily} />
<FontSizeCombobox bind:value={fontSize} />
Expand Down
89 changes: 40 additions & 49 deletions src/lib/components/font-dialog/FontSizeCombobox.svelte
Original file line number Diff line number Diff line change
Expand Up @@ -11,37 +11,30 @@
import { get } from 'svelte/store';
import { FontSize } from '@/types/SettingsTypes';
let open = $state(false);
interface Props {
value: FontSize;
}
let triggerRef = $state<HTMLButtonElement>(null!);
let open = $state(false);
let { value = $bindable() }: Props = $props();
let selectedValue = $derived(
Object.values(FontSize).find((f) => f === value) ?? $settings.fontSize
);
// We want to refocus the trigger button when the user selects
// an item from the list so users can continue navigating the
// rest of the form with the keyboard.
function closeAndFocusTrigger(triggerId: string) {
function closeAndFocusTrigger() {
open = false;
tick().then(() => {
document.getElementById(triggerId)?.focus();
triggerRef.focus();
});
}
const onSelect = (
currentValue: FontSize | string,
ids: {
content: string;
trigger: string;
}
) => {
const onSelect = (currentValue: FontSize | string) => {
value = currentValue as FontSize;
closeAndFocusTrigger(ids.trigger);
closeAndFocusTrigger();
};
onMount(() => () => {
Expand All @@ -50,40 +43,38 @@
</script>

<Popover.Root bind:open>
{#snippet children({ ids })}
<Popover.Trigger asChild>
{#snippet children({ builder })}
<div>
<Label for="font-size-command-button">Font Size</Label>
<br />
<Button
builders={[builder]}
variant="outline"
role="combobox"
aria-expanded={open}
class="w-full justify-between min-[464px]:w-[200px]"
id="font-size-command-button"
>
{selectedValue == FontSize.Size16 ? `${selectedValue} (Default)` : selectedValue}
<ChevronsUpDownIcon class="ml-2 shrink-0 text-base opacity-50" />
</Button>
</div>
{/snippet}
</Popover.Trigger>
<Popover.Content class="w-[200px] p-0">
<Command.Root>
<Command.Input placeholder="Search font size" />
<Command.Empty>No font size found.</Command.Empty>
<Command.Group class="max-h-56 overflow-y-auto">
{#each Object.values(FontSize).filter((s) => !isNaN(Number(s))) as fontSize}
{@const fSize = fontSize.toString()}
<Command.Item value={fSize} onSelect={() => onSelect(fontSize, ids)}>
<CheckIcon class={cn('mr-2 text-lg', value !== fontSize && 'text-transparent')} />
{fontSize == FontSize.Size16 ? `${fontSize} (Default)` : fontSize}
</Command.Item>
{/each}
</Command.Group>
</Command.Root>
</Popover.Content>
{/snippet}
<Popover.Trigger bind:ref={triggerRef}>
{#snippet child({ props })}
<div>
<Label for="font-size-command-button">Font Size</Label>
<br />
<Button
variant="outline"
class="w-full justify-between min-[464px]:w-[200px]"
id="font-size-command-button"
{...props}
role="combobox"
aria-expanded={open}
>
{selectedValue == FontSize.Size16 ? `${selectedValue} (Default)` : selectedValue}
<ChevronsUpDownIcon class="ml-2 shrink-0 text-base opacity-50" />
</Button>
</div>
{/snippet}
</Popover.Trigger>
<Popover.Content class="w-[200px] p-0">
<Command.Root>
<Command.Input placeholder="Search font size" />
<Command.Empty>No font size found.</Command.Empty>
<Command.Group class="max-h-56 overflow-y-auto">
{#each Object.values(FontSize).filter((s) => !isNaN(Number(s))) as fontSize}
{@const fSize = fontSize.toString()}
<Command.Item value={fSize} onSelect={() => onSelect(fontSize)}>
<CheckIcon class={cn('mr-2 text-lg', value !== fontSize && 'text-transparent')} />
{fontSize == FontSize.Size16 ? `${fontSize} (Default)` : fontSize}
</Command.Item>
{/each}
</Command.Group>
</Command.Root>
</Popover.Content>
</Popover.Root>
10 changes: 10 additions & 0 deletions src/lib/components/icons/ChevronRight.svelte
Original file line number Diff line number Diff line change
@@ -0,0 +1,10 @@
<svg xmlns="http://www.w3.org/2000/svg" width="1em" height="1em" viewBox="0 0 24 24" {...$$props}
><path
fill="none"
stroke="currentColor"
stroke-linecap="round"
stroke-linejoin="round"
stroke-width="2"
d="m9 18l6-6l-6-6"
/></svg
>
12 changes: 12 additions & 0 deletions src/lib/components/icons/Circle.svelte
Original file line number Diff line number Diff line change
@@ -0,0 +1,12 @@
<svg xmlns="http://www.w3.org/2000/svg" width="1em" height="1em" viewBox="0 0 24 24" {...$$props}
><circle
cx="12"
cy="12"
r="10"
fill="none"
stroke="currentColor"
stroke-linecap="round"
stroke-linejoin="round"
stroke-width="2"
/></svg
>
10 changes: 10 additions & 0 deletions src/lib/components/icons/Minus.svelte
Original file line number Diff line number Diff line change
@@ -0,0 +1,10 @@
<svg xmlns="http://www.w3.org/2000/svg" width="1em" height="1em" viewBox="0 0 24 24" {...$$props}
><path
fill="none"
stroke="currentColor"
stroke-linecap="round"
stroke-linejoin="round"
stroke-width="2"
d="M5 12h14"
/></svg
>
9 changes: 9 additions & 0 deletions src/lib/components/icons/Search.svelte
Original file line number Diff line number Diff line change
@@ -0,0 +1,9 @@
<svg xmlns="http://www.w3.org/2000/svg" width="1em" height="1em" viewBox="0 0 24 24" {...$$props}
><g
fill="none"
stroke="currentColor"
stroke-linecap="round"
stroke-linejoin="round"
stroke-width="2"><circle cx="11" cy="11" r="8" /><path d="m21 21l-4.3-4.3" /></g
></svg
>
4 changes: 2 additions & 2 deletions src/lib/components/ui/checkbox/checkbox.svelte
Original file line number Diff line number Diff line change
@@ -1,8 +1,8 @@
<script lang="ts">
import { Checkbox as CheckboxPrimitive, type WithoutChildrenOrChild } from 'bits-ui';
import Check from 'lucide-svelte/icons/check';
import Minus from 'lucide-svelte/icons/minus';
import { cn } from '@/utils.js';
import Check from '@/components/icons/Check.svelte';
import Minus from '../../icons/Minus.svelte';
let {
ref = $bindable(null),
Expand Down
2 changes: 1 addition & 1 deletion src/lib/components/ui/command/command-input.svelte
Original file line number Diff line number Diff line change
@@ -1,6 +1,6 @@
<script lang="ts">
import { Command as CommandPrimitive } from 'bits-ui';
import Search from 'lucide-svelte/icons/search';
import Search from '@/components/icons/Search.svelte';
import { cn } from '@/utils.js';
let {
Expand Down
Original file line number Diff line number Diff line change
@@ -1,7 +1,7 @@
<script lang="ts">
import { ContextMenu as ContextMenuPrimitive, type WithoutChildrenOrChild } from 'bits-ui';
import Check from 'lucide-svelte/icons/check';
import Minus from 'lucide-svelte/icons/minus';
import Check from '@/components/icons/Check.svelte';
import Minus from '@/components/icons/Minus.svelte';
import type { Snippet } from 'svelte';
import { cn } from '@/utils.js';
Expand Down
Original file line number Diff line number Diff line change
@@ -1,6 +1,6 @@
<script lang="ts">
import { ContextMenu as ContextMenuPrimitive, type WithoutChild } from 'bits-ui';
import Circle from 'lucide-svelte/icons/circle';
import Circle from '@/components/icons/Circle.svelte';
import { cn } from '@/utils.js';
let {
Expand Down
Original file line number Diff line number Diff line change
@@ -1,6 +1,6 @@
<script lang="ts">
import { ContextMenu as ContextMenuPrimitive, type WithoutChild } from 'bits-ui';
import ChevronRight from 'lucide-svelte/icons/chevron-right';
import ChevronRight from '@/components/icons/ChevronRight.svelte';
import { cn } from '@/utils.js';
let {
Expand Down
6 changes: 3 additions & 3 deletions src/lib/components/ui/dialog/dialog-content.svelte
Original file line number Diff line number Diff line change
@@ -1,9 +1,9 @@
<script lang="ts">
import { Dialog as DialogPrimitive, type WithoutChildrenOrChild } from 'bits-ui';
import X from 'lucide-svelte/icons/x';
import type { Snippet } from 'svelte';
import * as Dialog from './index.js';
import { cn } from '@/utils.js';
import Close from '@/components/icons/Close.svelte';
let {
ref = $bindable(null),
Expand All @@ -29,9 +29,9 @@
>
{@render children?.()}
<DialogPrimitive.Close
class="absolute right-4 top-4 rounded-sm opacity-70 ring-offset-background transition-opacity data-[state=open]:bg-accent data-[state=open]:text-muted-foreground hover:opacity-100 focus:outline-none focus:ring-2 focus:ring-ring focus:ring-offset-2 disabled:pointer-events-none"
class="absolute right-5 top-5 rounded-sm opacity-70 ring-offset-background transition-opacity data-[state=open]:bg-accent data-[state=open]:text-muted-foreground hover:opacity-100 focus:outline-none focus:ring-2 focus:ring-ring focus:ring-offset-2 disabled:pointer-events-none"
>
<X class="size-4" />
<Close class="size-4" />
<span class="sr-only">Close</span>
</DialogPrimitive.Close>
</DialogPrimitive.Content>
Expand Down
4 changes: 2 additions & 2 deletions src/lib/components/ui/menubar/menubar-checkbox-item.svelte
Original file line number Diff line number Diff line change
@@ -1,7 +1,7 @@
<script lang="ts">
import { Menubar as MenubarPrimitive, type WithoutChildrenOrChild } from 'bits-ui';
import Check from 'lucide-svelte/icons/check';
import Minus from 'lucide-svelte/icons/minus';
import Check from '@/components/icons/Check.svelte';
import Minus from '@/components/icons/Minus.svelte';
import { cn } from '@/utils.js';
import type { Snippet } from 'svelte';
Expand Down
2 changes: 1 addition & 1 deletion src/lib/components/ui/menubar/menubar-radio-item.svelte
Original file line number Diff line number Diff line change
@@ -1,6 +1,6 @@
<script lang="ts">
import { Menubar as MenubarPrimitive, type WithoutChild } from 'bits-ui';
import Circle from 'lucide-svelte/icons/circle';
import Circle from '@/components/icons/Circle.svelte';
import { cn } from '@/utils.js';
let {
Expand Down
2 changes: 1 addition & 1 deletion src/lib/components/ui/menubar/menubar-sub-trigger.svelte
Original file line number Diff line number Diff line change
@@ -1,7 +1,7 @@
<script lang="ts">
import { Menubar as MenubarPrimitive } from 'bits-ui';
import ChevronRight from 'lucide-svelte/icons/chevron-right';
import { cn } from '@/utils.js';
import ChevronRight from '@/components/icons/ChevronRight.svelte';
let {
ref = $bindable(null),
Expand Down
7 changes: 7 additions & 0 deletions tsconfig.check.json
Original file line number Diff line number Diff line change
@@ -0,0 +1,7 @@
{
"extends": "./tsconfig.json",

// https://github.com/sveltejs/svelte/issues/5817
// https://github.com/sveltejs/svelte/issues/7304
"exclude": ["src/lib/components/ui/**/index.ts"]
}
Loading

0 comments on commit d91c1e8

Please sign in to comment.