Initial commit

This commit is contained in:
Sawyer 2025-03-08 15:44:09 -06:00
commit 40182703e4
17 changed files with 1993 additions and 0 deletions

23
.gitignore vendored Normal file
View file

@ -0,0 +1,23 @@
node_modules
# Output
.output
.vercel
.netlify
.wrangler
/.svelte-kit
/build
# OS
.DS_Store
Thumbs.db
# Env
.env
.env.*
!.env.example
!.env.test
# Vite
vite.config.js.timestamp-*
vite.config.ts.timestamp-*

1
.npmrc Normal file
View file

@ -0,0 +1 @@
engine-strict=true

4
.prettierignore Normal file
View file

@ -0,0 +1,4 @@
# Package Managers
package-lock.json
pnpm-lock.yaml
yarn.lock

15
.prettierrc Normal file
View file

@ -0,0 +1,15 @@
{
"useTabs": true,
"singleQuote": true,
"trailingComma": "none",
"printWidth": 100,
"plugins": ["prettier-plugin-svelte"],
"overrides": [
{
"files": "*.svelte",
"options": {
"parser": "svelte"
}
}
]
}

21
README.md Normal file
View file

@ -0,0 +1,21 @@
# word-counter
A simple svelte word counter
## Developing
```bash
# should work fine with normal npm too
pnpm install
pnpm run dev -- --open
```
## Building
To create a production version:
```bash
pnpm run build
```
You can preview the production build with `pnpm run preview`.

34
eslint.config.js Normal file
View file

@ -0,0 +1,34 @@
import prettier from 'eslint-config-prettier';
import js from '@eslint/js';
import { includeIgnoreFile } from '@eslint/compat';
import svelte from 'eslint-plugin-svelte';
import globals from 'globals';
import { fileURLToPath } from 'node:url';
import svelteConfig from './svelte.config.js';
const gitignorePath = fileURLToPath(new URL('./.gitignore', import.meta.url));
/** @type {import('eslint').Linter.Config[]} */
export default [
includeIgnoreFile(gitignorePath),
js.configs.recommended,
...svelte.configs.recommended,
prettier,
...svelte.configs.prettier,
{
languageOptions: {
globals: {
...globals.browser,
...globals.node
}
}
},
{
files: ['**/*.svelte', '**/*.svelte.js'],
languageOptions: {
parserOptions: {
svelteConfig
}
}
}
];

13
jsconfig.json Normal file
View file

@ -0,0 +1,13 @@
{
"extends": "./.svelte-kit/tsconfig.json",
"compilerOptions": {
"allowJs": true,
"checkJs": false,
"moduleResolution": "bundler"
}
// Path aliases are handled by https://svelte.dev/docs/kit/configuration#alias
// except $lib which is handled by https://svelte.dev/docs/kit/configuration#files
//
// If you want to overwrite includes/excludes, make sure to copy over the relevant includes/excludes
// from the referenced tsconfig.json - TypeScript does not merge them in
}

37
package.json Normal file
View file

@ -0,0 +1,37 @@
{
"name": "word-counter",
"private": true,
"version": "0.0.1",
"type": "module",
"scripts": {
"dev": "vite dev",
"build": "vite build",
"preview": "vite preview",
"prepare": "svelte-kit sync || echo ''",
"format": "prettier --write .",
"lint": "prettier --check . && eslint ."
},
"devDependencies": {
"@eslint/compat": "^1.2.5",
"@eslint/js": "^9.18.0",
"@sveltejs/adapter-auto": "^4.0.0",
"@sveltejs/kit": "^2.16.0",
"@sveltejs/vite-plugin-svelte": "^5.0.0",
"eslint": "^9.18.0",
"eslint-config-prettier": "^10.0.1",
"eslint-plugin-svelte": "^3.0.0",
"globals": "^16.0.0",
"prettier": "^3.4.2",
"prettier-plugin-svelte": "^3.3.3",
"svelte": "^5.0.0",
"vite": "^6.0.0"
},
"pnpm": {
"onlyBuiltDependencies": [
"esbuild"
]
},
"dependencies": {
"alfaaz": "^1.1.0"
}
}

1727
pnpm-lock.yaml generated Normal file

File diff suppressed because it is too large Load diff

13
src/app.html Normal file
View file

@ -0,0 +1,13 @@
<!DOCTYPE html>
<html lang="en">
<head>
<meta charset="utf-8">
<link rel="stylesheet" href="/style.css">
<link rel="icon" href="%sveltekit.assets%/favicon.png">
<meta name="viewport" content="width=device-width, initial-scale=1">
%sveltekit.head%
</head>
<body data-sveltekit-preload-data="hover">
<div style="display: contents">%sveltekit.body%</div>
</body>
</html>

1
src/lib/index.js Normal file
View file

@ -0,0 +1 @@
// place files you want to import through the `$lib` alias in this folder.

46
src/routes/+page.svelte Normal file
View file

@ -0,0 +1,46 @@
<script>
import { browser } from '$app/environment';
import { onMount } from 'svelte';
import { countWords } from 'alfaaz';
let text;
function wordCount(text) {
if (text == undefined) {
return '0';
} else {
return countWords(text);
}
}
function characterCount(text) {
if (text == undefined) {
return '0';
} else {
return text.length;
}
}
onMount(() => {
if (browser) {
const savedText = localStorage.getItem('text');
if (savedText !== null) {
text = savedText; // Ensure reactivity
}
}
});
$: if (browser && text !== undefined) {
localStorage.setItem('text', text);
}
</script>
<svelte:head>
<title>Word Counter</title>
</svelte:head>
<main>
<p class="word-count center">{wordCount(text)} words, {characterCount(text)} characters</p>
<!-- svelte-ignore a11y_autofocus -->
<textarea class="center" autofocus bind:value={text}></textarea>
</main>

BIN
static/Inter-Regular.woff2 Normal file

Binary file not shown.

BIN
static/favicon.png Normal file

Binary file not shown.

After

Width:  |  Height:  |  Size: 1.5 KiB

39
static/style.css Normal file
View file

@ -0,0 +1,39 @@
/* TODO: mobile media queries */
@font-face {
font-family: "Inter";
font-style: normal;
font-weight: 400;
font-display: swap;
src: url("Inter-Regular.woff2") format("woff2");
}
html {
font-family: Inter;
background-color: #171717;
}
textarea {
background-color: transparent;
color: #d4d4d8;
font: inherit;
border: none;
outline: none;
resize: none;
width: 75%;
height: 90vh;
}
main {
height: 100%;
display: flex;
align-items: center;
justify-content: center;
flex-wrap: wrap;
flex-direction: column;
height: 100%;
}
.word-count {
color: #858585;
font-weight: 500;
}

13
svelte.config.js Normal file
View file

@ -0,0 +1,13 @@
import adapter from '@sveltejs/adapter-auto';
/** @type {import('@sveltejs/kit').Config} */
const config = {
kit: {
// adapter-auto only supports some environments, see https://svelte.dev/docs/kit/adapter-auto for a list.
// If your environment is not supported, or you settled on a specific environment, switch out the adapter.
// See https://svelte.dev/docs/kit/adapters for more information about adapters.
adapter: adapter()
}
};
export default config;

6
vite.config.js Normal file
View file

@ -0,0 +1,6 @@
import { sveltekit } from '@sveltejs/kit/vite';
import { defineConfig } from 'vite';
export default defineConfig({
plugins: [sveltekit()]
});