commit d5aff726c388ce00ed67cd88e6b44b00dbec7afe Author: Ava Gaiety W Date: Tue Sep 16 21:26:19 2025 -0600 color pallete class, converter, tests diff --git a/.gitignore b/.gitignore new file mode 100644 index 0000000..9b1ee42 --- /dev/null +++ b/.gitignore @@ -0,0 +1,175 @@ +# Based on https://raw.githubusercontent.com/github/gitignore/main/Node.gitignore + +# Logs + +logs +_.log +npm-debug.log_ +yarn-debug.log* +yarn-error.log* +lerna-debug.log* +.pnpm-debug.log* + +# Caches + +.cache + +# Diagnostic reports (https://nodejs.org/api/report.html) + +report.[0-9]_.[0-9]_.[0-9]_.[0-9]_.json + +# Runtime data + +pids +_.pid +_.seed +*.pid.lock + +# Directory for instrumented libs generated by jscoverage/JSCover + +lib-cov + +# Coverage directory used by tools like istanbul + +coverage +*.lcov + +# nyc test coverage + +.nyc_output + +# Grunt intermediate storage (https://gruntjs.com/creating-plugins#storing-task-files) + +.grunt + +# Bower dependency directory (https://bower.io/) + +bower_components + +# node-waf configuration + +.lock-wscript + +# Compiled binary addons (https://nodejs.org/api/addons.html) + +build/Release + +# Dependency directories + +node_modules/ +jspm_packages/ + +# Snowpack dependency directory (https://snowpack.dev/) + +web_modules/ + +# TypeScript cache + +*.tsbuildinfo + +# Optional npm cache directory + +.npm + +# Optional eslint cache + +.eslintcache + +# Optional stylelint cache + +.stylelintcache + +# Microbundle cache + +.rpt2_cache/ +.rts2_cache_cjs/ +.rts2_cache_es/ +.rts2_cache_umd/ + +# Optional REPL history + +.node_repl_history + +# Output of 'npm pack' + +*.tgz + +# Yarn Integrity file + +.yarn-integrity + +# dotenv environment variable files + +.env +.env.development.local +.env.test.local +.env.production.local +.env.local + +# parcel-bundler cache (https://parceljs.org/) + +.parcel-cache + +# Next.js build output + +.next +out + +# Nuxt.js build / generate output + +.nuxt +dist + +# Gatsby files + +# Comment in the public line in if your project uses Gatsby and not Next.js + +# https://nextjs.org/blog/next-9-1#public-directory-support + +# public + +# vuepress build output + +.vuepress/dist + +# vuepress v2.x temp and cache directory + +.temp + +# Docusaurus cache and generated files + +.docusaurus + +# Serverless directories + +.serverless/ + +# FuseBox cache + +.fusebox/ + +# DynamoDB Local files + +.dynamodb/ + +# TernJS port file + +.tern-port + +# Stores VSCode versions used for testing VSCode extensions + +.vscode-test + +# yarn v2 + +.yarn/cache +.yarn/unplugged +.yarn/build-state.yml +.yarn/install-state.gz +.pnp.* + +# IntelliJ based IDEs +.idea + +# Finder (MacOS) folder config +.DS_Store diff --git a/.mise.toml b/.mise.toml new file mode 100644 index 0000000..a94d1ed --- /dev/null +++ b/.mise.toml @@ -0,0 +1,2 @@ +[tools] +bun = "latest" diff --git a/README.md b/README.md new file mode 100644 index 0000000..70da4f4 --- /dev/null +++ b/README.md @@ -0,0 +1,15 @@ +# verdigris + +To install dependencies: + +```bash +bun install +``` + +To run: + +```bash +bun run index.js +``` + +This project was created using `bun init` in bun v1.1.13. [Bun](https://bun.sh) is a fast all-in-one JavaScript runtime. diff --git a/bun.lockb b/bun.lockb new file mode 100755 index 0000000..a98e11a Binary files /dev/null and b/bun.lockb differ diff --git a/index.ts b/index.ts new file mode 100644 index 0000000..109c932 --- /dev/null +++ b/index.ts @@ -0,0 +1,13 @@ +import { Chalk } from 'chalk' +import colors from './src/palette' +import Color from './src/helpers/color' + +const chalk = new Chalk({ level: 3 }) + +function log(color: Color) { + console.log( + chalk.hex(color.toHex()).underline('Hello, world!') + ) +} + +colors.forEach(log) diff --git a/jsconfig.json b/jsconfig.json new file mode 100644 index 0000000..238655f --- /dev/null +++ b/jsconfig.json @@ -0,0 +1,27 @@ +{ + "compilerOptions": { + // Enable latest features + "lib": ["ESNext", "DOM"], + "target": "ESNext", + "module": "ESNext", + "moduleDetection": "force", + "jsx": "react-jsx", + "allowJs": true, + + // Bundler mode + "moduleResolution": "bundler", + "allowImportingTsExtensions": true, + "verbatimModuleSyntax": true, + "noEmit": true, + + // Best practices + "strict": true, + "skipLibCheck": true, + "noFallthroughCasesInSwitch": true, + + // Some stricter flags (disabled by default) + "noUnusedLocals": false, + "noUnusedParameters": false, + "noPropertyAccessFromIndexSignature": false + } +} diff --git a/package.json b/package.json new file mode 100644 index 0000000..7d0bf0c --- /dev/null +++ b/package.json @@ -0,0 +1,13 @@ +{ + "name": "verdigris", + "module": "index.js", + "type": "module", + "devDependencies": { + "@types/bun": "latest", + "chalk": "^5.6.2", + "color-convert": "^3.1.2" + }, + "peerDependencies": { + "typescript": "^5.0.0" + } +} diff --git a/src/helpers/color.ts b/src/helpers/color.ts new file mode 100644 index 0000000..3dacea5 --- /dev/null +++ b/src/helpers/color.ts @@ -0,0 +1,75 @@ +import convert from 'color-convert' + +export interface OklchInterface { + l: number, + c: number, + h: number, +} + +export default class { + constructor(name: string, { l, c, h }: OklchInterface) { + name = name.trim() + + if (this._isNameValid(name)) this.#name = name + if (this._isLValid(l)) this.#l = l + if (this._isCValid(c)) this.#c = c + if (this._isHValid(h)) this.#h = h + } + + #name: string = '' + #l: number = 0 + #c: number = 0 + #h: number = 0 + + get name() { return this.#name } + set name(value: string) { + value = value.trim(); + if (this._isNameValid(value)) this.#name = value + } + _isNameValid(value: string): boolean { + if (value === '') throw 'name may not be empty' + return true + } + + get l() { return this.#l } + set l(value: number) { + if (this._isLValid(value)) this.#l = value + } + _isLValid(value: number): boolean { + if (value < 0) throw 'l must be above 0' + if (value > 100) throw 'l may not be over 100' + return true + } + + get c() { return this.#c } + set c(value: number) { + if (this._isCValid(value)) this.#c = value + } + _isCValid(value: number): boolean { + if (value < 0) throw 'c must be above 0' + if (value > 32) throw 'c may not be over 32' + return true + } + + get h() { return this.#h } + set h(value: number) { + if (this._isHValid(value)) this.#h = value + } + _isHValid(value: number): boolean { + if (value < 0) throw 'h must be above 0' + if (value > 360) throw 'h may not be over 360' + return true + } + + asOklch(): OklchInterface { + return { + l: this.#l, + c: this.#c, + h: this.#h + } + } + + toHex(): string { + return `#${convert.oklch.hex(this.#l, this.#c, this.#h)}` + } +} diff --git a/src/palette.toml b/src/palette.toml new file mode 100644 index 0000000..37963db --- /dev/null +++ b/src/palette.toml @@ -0,0 +1,13 @@ +name = "verdigris" +version = "0.0.1" + +[author] +name = "Gaiety" +email = "ava+verdigris@gaiety.me" + +[colors] + +[colors.bg] +l = 0.2 +c = 0.02 +h = diff --git a/src/palette.ts b/src/palette.ts new file mode 100644 index 0000000..7b6536a --- /dev/null +++ b/src/palette.ts @@ -0,0 +1,32 @@ +import Color from './helpers/color' + +const bg = new Color('Background', { + l: 0.2, + c: 0.02, + h: 300, +}) + +const fg = new Color('Foreground', { + l: 0.3, + c: 0.02, + h: 300, +}) + +const darkRed = new Color('Dark Red', { + l: 0.8, + c: 0.1, + h: 0, +}) + +const lightRed = new Color('Light Red', { + l: 0.9, + c: 0.1, + h: 0, +}) + +export default [ + bg, + fg, + darkRed, + lightRed +] diff --git a/tests/helpers/color.test.ts b/tests/helpers/color.test.ts new file mode 100644 index 0000000..7d7d952 --- /dev/null +++ b/tests/helpers/color.test.ts @@ -0,0 +1,86 @@ +import { expect, test } from 'bun:test' +import Color from '../../src/helpers/color' + +test('throws if given an empty name', () => { + expect( + () => new Color('', { l: 0, c: 0, h: 0 })) + .toThrow( + new Error('name may not be empty') + ) +}) + +test('can get name', () => { + const color = new Color('foo', { l: 0, c: 0, h: 0 }) + expect(color.name).toBe('foo') +}) + +test('can get Oklch values', () => { + const color = new Color('foo', { l: 1, c: 2, h: 3 }) + expect(color.l).toBe(1) + expect(color.c).toBe(2) + expect(color.h).toBe(3) +}) + +test('throws if l under range', () => { + expect( + () => new Color('foo', { l: -1, c: 0, h: 0 })) + .toThrow( + new Error('l must be above 0') + ) +}) + +test('throws if l above range', () => { + expect( + () => new Color('foo', { l: 101, c: 0, h: 0 })) + .toThrow( + new Error('l may not be over 100') + ) +}) + +test('throws if c under range', () => { + expect( + () => new Color('foo', { l: 0, c: -1, h: 0 })) + .toThrow( + new Error('c must be above 0') + ) +}) + +test('throws if c above range', () => { + expect( + () => new Color('foo', { l: 0, c: 33, h: 0 })) + .toThrow( + new Error('c may not be over 32') + ) +}) + +test('throws if h under range', () => { + expect( + () => new Color('foo', { l: 0, c: 0, h: -1 })) + .toThrow( + new Error('h must be above 0') + ) +}) + +test('throws if h above range', () => { + expect( + () => new Color('foo', { l: 0, c: 0, h: 361 })) + .toThrow( + new Error('h may not be over 360') + ) +}) + +test('can get Oklch object with values', () => { + const color = new Color('foo', { l: 0, c: 0, h: 0 }) + expect(color.asOklch()).toEqual({ l: 0, c: 0, h: 0 }) +}) + +test('can convert to expected hex values', () => { + const black = new Color('foo', { l: 0, c: 0, h: 0 }) + expect(black.toHex()).toBe('#000000') + + const yellow = new Color('foo', { l: 100, c: 32, h: 110 }) + expect(yellow.toHex()).toBe('#FFFF00') + + const white = new Color('foo', { l: 100, c: 0, h: 0 }) + expect(white.toHex()).toBe('#FFFFFF') +})