Skip to content

Releases: catmaitachi/kittens

v2.0.0

Choose a tag to compare

@github-actions github-actions released this 26 Sep 01:11

This release changes how a coat is described. In 1.x a coat was a handful of flat colors plus a
pattern rule that only the built-in coats could use. In 2.0 a coat is a grid of pixels, like a
Minecraft skin: every fur pixel of every pose reads its color from one cell of that grid, so you
can paint your own cat and hand it to the library as plain data. The landing page now opens with
a customizer that does exactly that. Cats also got a patience bar, and a cat shaken too hard
stays grumpy for a while.

Added

  • Coats are a 35×27 grid of characters (skin) plus a colors map from each character to a
    #rrggbb color. The head and the tail have one area each and look the same in every pose.
    The body, paws included, has its own area for each kind of pose (sitting, standing and
    walking, curled up, stretching, held), mapped pixel for pixel, so painting the sitting cat
    leaves the walking one alone. A cell holds the exact color you see, shadows included.
  • The outline, the soft outline, the nose and each eye (eyes.left, eyes.right) are separate
    colors on the coat, so a cat can have one blue eye and one green.
  • KittenCoat is the interface for a coat. COATS holds the five built-in ones,
    registerCoat() makes yours available by name (coat="my-cat"), and resolveCoat() fills in
    whatever a partial coat leaves out, using calico.
  • For editors and custom renderers: skinCellAt(frame, x, y) says which grid cell a pixel of a
    pose uses, eyeAt(frame, x, y) says whether a pixel is the left or the right eye,
    renderFrame(coat, frame) paints a single pose, and coatToCode(coat) returns a
    registerCoat({...}) call ready to paste. SKIN_W and SKIN_H give the grid size.
  • Patience, a bar from 0 to 100. Holding a cat costs nothing. Each hard shake (a sharp change of
    direction at speed) takes 35, and the next shake only counts a second later, so it takes some
    insistence. At zero the cat wriggles free and gets grumpy: a patience bar shows up over its
    head, it huffs every so often, won't be picked up and runs from the cursor. The bar refills in
    about 12 seconds; once it's full the cat calms down and the bar goes away. Read it with the
    patience and angry getters, or listen for the angry and calm events (kitten:angry and
    kitten:calm on the layer).
  • npm run check makes sure every fur pixel of every frame lands on a valid cell and that each
    built-in coat has a color there.

Changed

  • coat takes a coat name or a KittenCoat object (a partial one is fine).
  • The orange, siamese and gray coats were redrawn on the grid. Orange has even stripes with a
    white chest and white socks, the siamese has a cream forehead and a dark mask centered on the
    muzzle, and gray is one tone with soft stripes. Calico and black look the same as before.
  • The landing page opens with the coat customizer. Pick a coat and a pose, click the pencil to
    paint any pixel (with an eyedropper, recent colors and undo), then copy the coat code or a
    prompt that asks your AI agent to adopt that exact cat. The other demos were rearranged: cats
    exploring a living room, cats you call with a double click on a notebook page, and a box full
    of cats.

Removed

  • PALETTES, Palette, PaletteKey and PaletteName. See "Migrating from 1.x" below.

Migrating from 1.x

A 1.x coat was a Palette: flat colors for eight regions (k outline, s soft outline, w
fur, g fur shadow, d dark patch, o light patch, a eye, p nose), plus an optional
pattern function baked into PALETTES/PATTERNS that only the built-in coats could use. A
2.0 coat is a KittenCoat: the pattern lives directly in the skin grid, so there's no
separate pattern function, and the outline, soft outline, nose and each eye are colors on the
coat object itself rather than palette entries.

If you passed a coat name (coat: 'siamese', coat="black"), nothing changes.

If you passed a custom palette object, rebuild it as a KittenCoat. There's no automatic
converter, since a flat palette has no patches or stripes to place on the grid. The fastest
path is to start from a built-in coat and edit its skin and colors:

// 1.x
const cat = new Kitten(el, { coat: { w: '#e8e8ea', a: '#d8b25a', p: '#e59aa8' } });

// 2.0
import { COATS } from '@catmaitachi/kittens';
const cat = new Kitten(el, {
  coat: { ...COATS.calico, name: 'my-coat', colors: { ...COATS.calico.colors, a: '#e8e8ea' } },
});

To paint a coat from scratch instead of adapting one, use the
customizer on the landing page and copy the registerCoat({...})
call it generates.

v1.0.2

Choose a tag to compare

@github-actions github-actions released this 15 Sep 19:41

Full Changelog: v1.0.1...v1.0.2

v1.0.1

Choose a tag to compare

@github-actions github-actions released this 15 Sep 19:21

Full Changelog: v1.0.0...v1.0.1

v1.0.0

Choose a tag to compare

@github-actions github-actions released this 15 Sep 18:46