Skip to content

Commit f1ad686

Browse files
committed
- Modified palette method to use options argument.
- Modified findContrast method to use options argument. - Updated tests. - Updated README. - Updated NPM.
1 parent 892d473 commit f1ad686

11 files changed

Lines changed: 156 additions & 1435 deletions

File tree

README.md

Lines changed: 8 additions & 6 deletions
Original file line numberDiff line numberDiff line change
@@ -397,12 +397,13 @@ const colorTones = color.tones(tones);
397397

398398
Create a palette object with a specified number of shades, tints and tone variations.
399399

400-
- `shades` is a number indicating how many shades you wish to generate, and will default to *10*.
401-
- `tints` is a number indicating how many tints you wish to generate, and will default to *10*.
402-
- `tones` is a number indicating how many tones you wish to generate, and will default to *10*.
400+
- `options` is an object containing options for how the palette should be generated.
401+
- `shades` is a number indicating how many shades you wish to generate, and will default to *10*.
402+
- `tints` is a number indicating how many tints you wish to generate, and will default to *10*.
403+
- `tones` is a number indicating how many tones you wish to generate, and will default to *10*.
403404

404405
```javascript
405-
const colorPalette = color.palette(shades, tints, tones);
406+
const colorPalette = color.palette(options);
406407
```
407408

408409

@@ -436,8 +437,9 @@ Find an optimally contrasting color for another color.
436437

437438
- `color1` is a *Color* object.
438439
- `color2` is a *Color* object, and will default to *null*.
439-
- `minContrast` is a number between *1* and *21* indicating the minimum valid contrast, and will default to *4.5*.
440-
- `stepSize` is a number between *0* and *1* indicating the amount to darken/lighten the color on each iteration, and will default to *0.01*.
440+
- `options` is an object containing options for how the contrasting color should be found.
441+
- `minContrast` is a number between *1* and *21* indicating the minimum valid contrast, and will default to *4.5*.
442+
- `stepSize` is a number between *0* and *1* indicating the amount to darken/lighten the color on each iteration, and will default to *0.01*.
441443

442444
```javascript
443445
const contrastColor = Color.findContrast(color1, color2, minContrast, stepSize);

dist/frost-color.js

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

dist/frost-color.js.map

Lines changed: 1 addition & 1 deletion
Some generated files are not rendered by default. Learn more about customizing how changed files appear on GitHub.

dist/frost-color.min.js

Lines changed: 1 addition & 1 deletion
Some generated files are not rendered by default. Learn more about customizing how changed files appear on GitHub.

dist/frost-color.min.js.map

Lines changed: 1 addition & 1 deletion
Some generated files are not rendered by default. Learn more about customizing how changed files appear on GitHub.

package-lock.json

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

package.json

Lines changed: 4 additions & 4 deletions
Original file line numberDiff line numberDiff line change
@@ -1,6 +1,6 @@
11
{
22
"name": "@fr0st/color",
3-
"version": "4.0.2",
3+
"version": "4.1.0",
44
"description": "FrostColor is a free, open-source color manipulation library for JavaScript.",
55
"keywords": [
66
"color",
@@ -40,10 +40,10 @@
4040
"license": "MIT",
4141
"private": false,
4242
"devDependencies": {
43-
"eslint": "^8.31.0",
43+
"eslint": "^8.41.0",
4444
"eslint-config-google": "^0.14.0",
4545
"mocha": "^10.2.0",
46-
"rollup": "^3.9.1",
47-
"terser": "^5.16.1"
46+
"rollup": "^3.22.0",
47+
"terser": "^5.17.4"
4848
}
4949
}

src/prototype/palette.js

Lines changed: 5 additions & 4 deletions
Original file line numberDiff line numberDiff line change
@@ -4,12 +4,13 @@
44

55
/**
66
* Create a palette object with a specified number of shades, tints and tone variations.
7-
* @param {number} [shades=10] The number of shades to generate.
8-
* @param {number} [tints=10] The number of tints to generate.
9-
* @param {number} [tones=10] The number of tones to generate.
7+
* @param {object} [options] The options for generating a palette.
8+
* @param {number} [options.shades=10] The number of shades to generate.
9+
* @param {number} [options.tints=10] The number of tints to generate.
10+
* @param {number} [options.tones=10] The number of tones to generate.
1011
* @return {object} A palette object.
1112
*/
12-
export function palette(shades = 10, tints = 10, tones = 10) {
13+
export function palette({ shades = 10, tints = 10, tones = 10 } = {}) {
1314
return {
1415
shades: this.shades(shades),
1516
tints: this.tints(tints),

src/static/utility.js

Lines changed: 4 additions & 3 deletions
Original file line numberDiff line numberDiff line change
@@ -32,11 +32,12 @@ export const dist = (color1, color2) => {
3232
* Find an optimally contrasting color for another color.
3333
* @param {Color} color1 The first Color.
3434
* @param {Color} [color2] The second Color.
35-
* @param {number} [minContrast=4.5] The minimum contrast.
36-
* @param {number} [stepSize=.01] The step size.
35+
* @param {object} [options] The options for finding the contrasting color.
36+
* @param {number} [options.minContrast=4.5] The minimum contrast.
37+
* @param {number} [options.stepSize=.01] The step size.
3738
* @return {Color} The new Color.
3839
*/
39-
export const findContrast = (color1, color2 = null, minContrast = 4.5, stepSize = .01) => {
40+
export const findContrast = (color1, color2 = null, { minContrast = 4.5, stepSize = .01 } = {}) => {
4041
if (!color2) {
4142
color2 = color1;
4243
}

test/palette.js

Lines changed: 9 additions & 9 deletions
Original file line numberDiff line numberDiff line change
@@ -239,7 +239,7 @@ describe('Color Palette', function() {
239239

240240
it('works with shades argument', function() {
241241
const palette = Color.fromHSV(120, 50, 50)
242-
.palette(5, 0, 0);
242+
.palette({ shades: 5 });
243243

244244
assert.deepStrictEqual(
245245
palette.shades.map(
@@ -256,11 +256,11 @@ describe('Color Palette', function() {
256256

257257
assert.strictEqual(
258258
palette.tints.length,
259-
0
259+
10
260260
);
261261
assert.strictEqual(
262262
palette.tones.length,
263-
0
263+
10
264264
);
265265
assert.ok(
266266
palette.shades.every(
@@ -271,7 +271,7 @@ describe('Color Palette', function() {
271271

272272
it('works with tints argument', function() {
273273
const palette = Color.fromHSV(120, 50, 50)
274-
.palette(0, 5, 0);
274+
.palette({ tints: 5 });
275275

276276
assert.deepStrictEqual(
277277
palette.tints.map(
@@ -288,11 +288,11 @@ describe('Color Palette', function() {
288288

289289
assert.strictEqual(
290290
palette.shades.length,
291-
0
291+
10
292292
);
293293
assert.strictEqual(
294294
palette.tones.length,
295-
0
295+
10
296296
);
297297
assert.ok(
298298
palette.tints.every(
@@ -303,7 +303,7 @@ describe('Color Palette', function() {
303303

304304
it('works with tones argument', function() {
305305
const palette = Color.fromHSV(120, 50, 50)
306-
.palette(0, 0, 5);
306+
.palette({ tones: 5 });
307307

308308
assert.deepStrictEqual(
309309
palette.tones.map(
@@ -320,11 +320,11 @@ describe('Color Palette', function() {
320320

321321
assert.strictEqual(
322322
palette.shades.length,
323-
0
323+
10
324324
);
325325
assert.strictEqual(
326326
palette.tints.length,
327-
0
327+
10
328328
);
329329
assert.ok(
330330
palette.tones.every(

0 commit comments

Comments
 (0)