asciify-engine 4.27.0 → 4.28.0
This diff represents the content of publicly available package versions that have been released to one of the supported registries. The information contained in this diff is provided for informational purposes only and reflects changes between package versions as they appear in their respective public registries.
- package/CHANGELOG.md +8 -0
- package/dist/kit/chunk-2MLFWO4U.js +1 -0
- package/dist/kit/{chunk-JELJEEJO.js → chunk-3YSK7V26.js} +1 -1
- package/dist/kit/{chunk-VIUEAEBX.js → chunk-4NV5APSJ.js} +1 -1
- package/dist/kit/{chunk-MJJSZS23.js → chunk-4U72YE65.js} +1 -1
- package/dist/kit/{chunk-7NVKRDKE.js → chunk-G4ZSMTFN.js} +1 -1
- package/dist/kit/{chunk-IBNDCKEX.js → chunk-HYVTFKWX.js} +1 -1
- package/dist/kit/{chunk-DCLJHSWM.js → chunk-OZFSNW5N.js} +1 -1
- package/dist/kit/chunk-PB5E3D4E.js +1 -0
- package/dist/kit/{chunk-VX2AD3M7.js → chunk-PGFBIU7R.js} +1 -1
- package/dist/kit/{chunk-MZFK765W.js → chunk-YSN7EHSH.js} +1 -1
- package/dist/kit.cjs +1 -1
- package/dist/kit.d.cts +29 -1
- package/dist/kit.d.ts +29 -1
- package/dist/kit.js +1 -1
- package/package.json +1 -1
- package/skills/asciify-engine/SKILL.md +2 -2
- package/skills/asciify-engine/references/applying-asciify.md +1 -0
- package/skills/asciify-engine/references/kit.md +13 -2
- package/skills/asciify-engine/references/scenario-prompts.md +4 -0
- package/dist/kit/chunk-LE53AVKR.js +0 -1
package/dist/kit.d.cts
CHANGED
|
@@ -665,6 +665,34 @@ interface PageDissolveHandle extends KitHandle<PageDissolveOptions> {
|
|
|
665
665
|
/** A page or panel transition: one wave of characters from where the user clicked carries the old view out and the next one in. */
|
|
666
666
|
declare function pageDissolve(container: HTMLElement, options?: PageDissolveOptions): PageDissolveHandle;
|
|
667
667
|
|
|
668
|
+
type CursorTrailStyle = 'trail' | 'wake' | 'water' | 'sparkle';
|
|
669
|
+
interface CursorTrailOptions extends KitOptions {
|
|
670
|
+
/** `trail` a fine tail along the pointer's path, `wake` a softer, wider band, `water` rings that spread from the path, `sparkle` glints scattered along it. Default `trail`. */
|
|
671
|
+
style?: CursorTrailStyle;
|
|
672
|
+
/** Characters from empty to dense; the head of the trail takes the last one. Default ` .:-=+*#%@`. */
|
|
673
|
+
charset?: string;
|
|
674
|
+
/** Cell width in CSS pixels. Default 9. */
|
|
675
|
+
cellSize?: number;
|
|
676
|
+
/** Ms a point of the path takes to fade out. Default 800 (`water` 950). */
|
|
677
|
+
life?: number;
|
|
678
|
+
/** Stacking order of the layer. Keep it under your dialogs and sticky header. Default 1000. */
|
|
679
|
+
zIndex?: number;
|
|
680
|
+
/** More elements to stay quiet over, as a selector, on top of inputs, dialogs and `[data-ascii-cursor-skip]`. */
|
|
681
|
+
skip?: string;
|
|
682
|
+
}
|
|
683
|
+
interface CursorTrailHandle extends KitHandle<CursorTrailOptions> {
|
|
684
|
+
/** True while something is fading on screen. */
|
|
685
|
+
readonly active: boolean;
|
|
686
|
+
/** Drops everything on screen at once. */
|
|
687
|
+
clear(): void;
|
|
688
|
+
}
|
|
689
|
+
/**
|
|
690
|
+
* Characters that follow the pointer across the whole page: one fixed, click-through layer drawn by the shared GPU context. Nothing
|
|
691
|
+
* is mounted until the pointer first moves, and nothing draws once the last character has faded, so a still pointer costs nothing.
|
|
692
|
+
* Off on touch-only devices, under reduced motion and while the tab is hidden; quiet over inputs, dialogs and `[data-ascii-cursor-skip]`.
|
|
693
|
+
*/
|
|
694
|
+
declare function cursorTrail(options?: CursorTrailOptions): CursorTrailHandle;
|
|
695
|
+
|
|
668
696
|
interface SwipeDeckOptions extends KitOptions {
|
|
669
697
|
/** The cards, in order. Each card's first `img` is drawn in characters. Default `[data-card]`. */
|
|
670
698
|
cards?: string;
|
|
@@ -1387,4 +1415,4 @@ declare function subscribeGlobalLook(listener: (look: GlobalLook | null) => void
|
|
|
1387
1415
|
declare function setFieldBudget(n: number): void;
|
|
1388
1416
|
declare const getFieldBudget: () => number;
|
|
1389
1417
|
|
|
1390
|
-
export { type AccordionHandle, type AccordionImage, type AccordionOptions, type ArtPanelHandle, type ArtPanelOptions, type AsciiVideoHandle, type AsciiVideoOptions, BEAM_PALETTES, type BackgroundCharset, type BackgroundContext, type BackgroundCursor, type BackgroundHandle, type BackgroundMark, type BackgroundOptions, type BackgroundPreset, type BackgroundRun, type BackgroundSettings, type BeamHandle, type BeamMode, type BeamOptions, type BeamPalette, type BlockChartHandle, type BlockChartOptions, type Box, type ButtonLoadingHandle, type ButtonLoadingOptions, type ButtonState, type CodeInputHandle, type CodeInputOptions, type CodeState, type CommandPaletteHandle, type CommandPaletteOptions, type CompareHandle, type CompareOptions, type DecodeHandle, type DecodeOptions, type DisintegrateOptions, type DropState, type DroppedImage, type DropzoneHandle, type DropzoneOptions, type FieldBackgroundHandle, type FieldBackgroundOptions, type FieldPreset, type GenerateState, type GlobalLook, type ImageGenerateHandle, type ImageGenerateOptions, type ImageStream, type ImageUpdate, KIT_STYLES, type KitHandle, type KitOptions, type KitStyle, type LikeBurstHandle, type LikeBurstOptions, type LikeMark, type OdometerHandle, type OdometerOptions, type OrbState, PILL_TONES, type PageDissolveHandle, type PageDissolveOptions, type PaintFrame, type PillHandle, type PillOptions, type PillTone, type PricingGlowHandle, type PricingGlowOptions, type PullRefreshHandle, type PullRefreshOptions, type PullState, type SkeletonBlock, type SkeletonHandle, type SkeletonOptions, type SlideToConfirmHandle, type SlideToConfirmOptions, type StatusOrbHandle, type StatusOrbOptions, type StreamState, type StreamTextHandle, type StreamTextOptions, type Surface, type SurfaceConfig, type SwipeDeckHandle, type SwipeDeckOptions, type TabsHandle, type TabsOptions, type TemplateDraw, type TemplateFrame, type ThinkingHandle, type ThinkingOptions, type ThinkingState, type Toast, type ToastStackHandle, type ToastStackOptions, VOICE_PALETTES, type VoiceOrbHandle, type VoiceOrbOptions, type VoicePalette, type VoiceState, type WordmarkHandle, type WordmarkOptions, accordion, artPanel, asciiVideo, aurora, background, backgroundCharset, beam, beamPalette, blockChart, buttonLoading, cascade, caustics, circuit, codeInput, commandPalette, compare, constellation, contour, decode, disintegrate, dna, drift, dropzone, dune, etch, facet, fieldBackground, fire, fluid, getFieldBudget, getGlobalLook, grid, halftone, halo, imageGenerate, interference, likeBurst, mesh, moire, morph, mountCanvas, mountSurface, noise, odometer, pageDissolve, pill, pricingGlow, pullRefresh, pulse, rain, resolveColor, ripple, setFieldBudget, setGlobalLook, silk, skeleton, slideToConfirm, stars, statusOrb, streamText, subscribeGlobalLook, swell, swipeDeck, tabs, terrain, thinking, toastStack, veil, voiceOrb, voidWell, wave, weave, wordField, wordmark };
|
|
1418
|
+
export { type AccordionHandle, type AccordionImage, type AccordionOptions, type ArtPanelHandle, type ArtPanelOptions, type AsciiVideoHandle, type AsciiVideoOptions, BEAM_PALETTES, type BackgroundCharset, type BackgroundContext, type BackgroundCursor, type BackgroundHandle, type BackgroundMark, type BackgroundOptions, type BackgroundPreset, type BackgroundRun, type BackgroundSettings, type BeamHandle, type BeamMode, type BeamOptions, type BeamPalette, type BlockChartHandle, type BlockChartOptions, type Box, type ButtonLoadingHandle, type ButtonLoadingOptions, type ButtonState, type CodeInputHandle, type CodeInputOptions, type CodeState, type CommandPaletteHandle, type CommandPaletteOptions, type CompareHandle, type CompareOptions, type CursorTrailHandle, type CursorTrailOptions, type CursorTrailStyle, type DecodeHandle, type DecodeOptions, type DisintegrateOptions, type DropState, type DroppedImage, type DropzoneHandle, type DropzoneOptions, type FieldBackgroundHandle, type FieldBackgroundOptions, type FieldPreset, type GenerateState, type GlobalLook, type ImageGenerateHandle, type ImageGenerateOptions, type ImageStream, type ImageUpdate, KIT_STYLES, type KitHandle, type KitOptions, type KitStyle, type LikeBurstHandle, type LikeBurstOptions, type LikeMark, type OdometerHandle, type OdometerOptions, type OrbState, PILL_TONES, type PageDissolveHandle, type PageDissolveOptions, type PaintFrame, type PillHandle, type PillOptions, type PillTone, type PricingGlowHandle, type PricingGlowOptions, type PullRefreshHandle, type PullRefreshOptions, type PullState, type SkeletonBlock, type SkeletonHandle, type SkeletonOptions, type SlideToConfirmHandle, type SlideToConfirmOptions, type StatusOrbHandle, type StatusOrbOptions, type StreamState, type StreamTextHandle, type StreamTextOptions, type Surface, type SurfaceConfig, type SwipeDeckHandle, type SwipeDeckOptions, type TabsHandle, type TabsOptions, type TemplateDraw, type TemplateFrame, type ThinkingHandle, type ThinkingOptions, type ThinkingState, type Toast, type ToastStackHandle, type ToastStackOptions, VOICE_PALETTES, type VoiceOrbHandle, type VoiceOrbOptions, type VoicePalette, type VoiceState, type WordmarkHandle, type WordmarkOptions, accordion, artPanel, asciiVideo, aurora, background, backgroundCharset, beam, beamPalette, blockChart, buttonLoading, cascade, caustics, circuit, codeInput, commandPalette, compare, constellation, contour, cursorTrail, decode, disintegrate, dna, drift, dropzone, dune, etch, facet, fieldBackground, fire, fluid, getFieldBudget, getGlobalLook, grid, halftone, halo, imageGenerate, interference, likeBurst, mesh, moire, morph, mountCanvas, mountSurface, noise, odometer, pageDissolve, pill, pricingGlow, pullRefresh, pulse, rain, resolveColor, ripple, setFieldBudget, setGlobalLook, silk, skeleton, slideToConfirm, stars, statusOrb, streamText, subscribeGlobalLook, swell, swipeDeck, tabs, terrain, thinking, toastStack, veil, voiceOrb, voidWell, wave, weave, wordField, wordmark };
|
package/dist/kit.d.ts
CHANGED
|
@@ -665,6 +665,34 @@ interface PageDissolveHandle extends KitHandle<PageDissolveOptions> {
|
|
|
665
665
|
/** A page or panel transition: one wave of characters from where the user clicked carries the old view out and the next one in. */
|
|
666
666
|
declare function pageDissolve(container: HTMLElement, options?: PageDissolveOptions): PageDissolveHandle;
|
|
667
667
|
|
|
668
|
+
type CursorTrailStyle = 'trail' | 'wake' | 'water' | 'sparkle';
|
|
669
|
+
interface CursorTrailOptions extends KitOptions {
|
|
670
|
+
/** `trail` a fine tail along the pointer's path, `wake` a softer, wider band, `water` rings that spread from the path, `sparkle` glints scattered along it. Default `trail`. */
|
|
671
|
+
style?: CursorTrailStyle;
|
|
672
|
+
/** Characters from empty to dense; the head of the trail takes the last one. Default ` .:-=+*#%@`. */
|
|
673
|
+
charset?: string;
|
|
674
|
+
/** Cell width in CSS pixels. Default 9. */
|
|
675
|
+
cellSize?: number;
|
|
676
|
+
/** Ms a point of the path takes to fade out. Default 800 (`water` 950). */
|
|
677
|
+
life?: number;
|
|
678
|
+
/** Stacking order of the layer. Keep it under your dialogs and sticky header. Default 1000. */
|
|
679
|
+
zIndex?: number;
|
|
680
|
+
/** More elements to stay quiet over, as a selector, on top of inputs, dialogs and `[data-ascii-cursor-skip]`. */
|
|
681
|
+
skip?: string;
|
|
682
|
+
}
|
|
683
|
+
interface CursorTrailHandle extends KitHandle<CursorTrailOptions> {
|
|
684
|
+
/** True while something is fading on screen. */
|
|
685
|
+
readonly active: boolean;
|
|
686
|
+
/** Drops everything on screen at once. */
|
|
687
|
+
clear(): void;
|
|
688
|
+
}
|
|
689
|
+
/**
|
|
690
|
+
* Characters that follow the pointer across the whole page: one fixed, click-through layer drawn by the shared GPU context. Nothing
|
|
691
|
+
* is mounted until the pointer first moves, and nothing draws once the last character has faded, so a still pointer costs nothing.
|
|
692
|
+
* Off on touch-only devices, under reduced motion and while the tab is hidden; quiet over inputs, dialogs and `[data-ascii-cursor-skip]`.
|
|
693
|
+
*/
|
|
694
|
+
declare function cursorTrail(options?: CursorTrailOptions): CursorTrailHandle;
|
|
695
|
+
|
|
668
696
|
interface SwipeDeckOptions extends KitOptions {
|
|
669
697
|
/** The cards, in order. Each card's first `img` is drawn in characters. Default `[data-card]`. */
|
|
670
698
|
cards?: string;
|
|
@@ -1387,4 +1415,4 @@ declare function subscribeGlobalLook(listener: (look: GlobalLook | null) => void
|
|
|
1387
1415
|
declare function setFieldBudget(n: number): void;
|
|
1388
1416
|
declare const getFieldBudget: () => number;
|
|
1389
1417
|
|
|
1390
|
-
export { type AccordionHandle, type AccordionImage, type AccordionOptions, type ArtPanelHandle, type ArtPanelOptions, type AsciiVideoHandle, type AsciiVideoOptions, BEAM_PALETTES, type BackgroundCharset, type BackgroundContext, type BackgroundCursor, type BackgroundHandle, type BackgroundMark, type BackgroundOptions, type BackgroundPreset, type BackgroundRun, type BackgroundSettings, type BeamHandle, type BeamMode, type BeamOptions, type BeamPalette, type BlockChartHandle, type BlockChartOptions, type Box, type ButtonLoadingHandle, type ButtonLoadingOptions, type ButtonState, type CodeInputHandle, type CodeInputOptions, type CodeState, type CommandPaletteHandle, type CommandPaletteOptions, type CompareHandle, type CompareOptions, type DecodeHandle, type DecodeOptions, type DisintegrateOptions, type DropState, type DroppedImage, type DropzoneHandle, type DropzoneOptions, type FieldBackgroundHandle, type FieldBackgroundOptions, type FieldPreset, type GenerateState, type GlobalLook, type ImageGenerateHandle, type ImageGenerateOptions, type ImageStream, type ImageUpdate, KIT_STYLES, type KitHandle, type KitOptions, type KitStyle, type LikeBurstHandle, type LikeBurstOptions, type LikeMark, type OdometerHandle, type OdometerOptions, type OrbState, PILL_TONES, type PageDissolveHandle, type PageDissolveOptions, type PaintFrame, type PillHandle, type PillOptions, type PillTone, type PricingGlowHandle, type PricingGlowOptions, type PullRefreshHandle, type PullRefreshOptions, type PullState, type SkeletonBlock, type SkeletonHandle, type SkeletonOptions, type SlideToConfirmHandle, type SlideToConfirmOptions, type StatusOrbHandle, type StatusOrbOptions, type StreamState, type StreamTextHandle, type StreamTextOptions, type Surface, type SurfaceConfig, type SwipeDeckHandle, type SwipeDeckOptions, type TabsHandle, type TabsOptions, type TemplateDraw, type TemplateFrame, type ThinkingHandle, type ThinkingOptions, type ThinkingState, type Toast, type ToastStackHandle, type ToastStackOptions, VOICE_PALETTES, type VoiceOrbHandle, type VoiceOrbOptions, type VoicePalette, type VoiceState, type WordmarkHandle, type WordmarkOptions, accordion, artPanel, asciiVideo, aurora, background, backgroundCharset, beam, beamPalette, blockChart, buttonLoading, cascade, caustics, circuit, codeInput, commandPalette, compare, constellation, contour, decode, disintegrate, dna, drift, dropzone, dune, etch, facet, fieldBackground, fire, fluid, getFieldBudget, getGlobalLook, grid, halftone, halo, imageGenerate, interference, likeBurst, mesh, moire, morph, mountCanvas, mountSurface, noise, odometer, pageDissolve, pill, pricingGlow, pullRefresh, pulse, rain, resolveColor, ripple, setFieldBudget, setGlobalLook, silk, skeleton, slideToConfirm, stars, statusOrb, streamText, subscribeGlobalLook, swell, swipeDeck, tabs, terrain, thinking, toastStack, veil, voiceOrb, voidWell, wave, weave, wordField, wordmark };
|
|
1418
|
+
export { type AccordionHandle, type AccordionImage, type AccordionOptions, type ArtPanelHandle, type ArtPanelOptions, type AsciiVideoHandle, type AsciiVideoOptions, BEAM_PALETTES, type BackgroundCharset, type BackgroundContext, type BackgroundCursor, type BackgroundHandle, type BackgroundMark, type BackgroundOptions, type BackgroundPreset, type BackgroundRun, type BackgroundSettings, type BeamHandle, type BeamMode, type BeamOptions, type BeamPalette, type BlockChartHandle, type BlockChartOptions, type Box, type ButtonLoadingHandle, type ButtonLoadingOptions, type ButtonState, type CodeInputHandle, type CodeInputOptions, type CodeState, type CommandPaletteHandle, type CommandPaletteOptions, type CompareHandle, type CompareOptions, type CursorTrailHandle, type CursorTrailOptions, type CursorTrailStyle, type DecodeHandle, type DecodeOptions, type DisintegrateOptions, type DropState, type DroppedImage, type DropzoneHandle, type DropzoneOptions, type FieldBackgroundHandle, type FieldBackgroundOptions, type FieldPreset, type GenerateState, type GlobalLook, type ImageGenerateHandle, type ImageGenerateOptions, type ImageStream, type ImageUpdate, KIT_STYLES, type KitHandle, type KitOptions, type KitStyle, type LikeBurstHandle, type LikeBurstOptions, type LikeMark, type OdometerHandle, type OdometerOptions, type OrbState, PILL_TONES, type PageDissolveHandle, type PageDissolveOptions, type PaintFrame, type PillHandle, type PillOptions, type PillTone, type PricingGlowHandle, type PricingGlowOptions, type PullRefreshHandle, type PullRefreshOptions, type PullState, type SkeletonBlock, type SkeletonHandle, type SkeletonOptions, type SlideToConfirmHandle, type SlideToConfirmOptions, type StatusOrbHandle, type StatusOrbOptions, type StreamState, type StreamTextHandle, type StreamTextOptions, type Surface, type SurfaceConfig, type SwipeDeckHandle, type SwipeDeckOptions, type TabsHandle, type TabsOptions, type TemplateDraw, type TemplateFrame, type ThinkingHandle, type ThinkingOptions, type ThinkingState, type Toast, type ToastStackHandle, type ToastStackOptions, VOICE_PALETTES, type VoiceOrbHandle, type VoiceOrbOptions, type VoicePalette, type VoiceState, type WordmarkHandle, type WordmarkOptions, accordion, artPanel, asciiVideo, aurora, background, backgroundCharset, beam, beamPalette, blockChart, buttonLoading, cascade, caustics, circuit, codeInput, commandPalette, compare, constellation, contour, cursorTrail, decode, disintegrate, dna, drift, dropzone, dune, etch, facet, fieldBackground, fire, fluid, getFieldBudget, getGlobalLook, grid, halftone, halo, imageGenerate, interference, likeBurst, mesh, moire, morph, mountCanvas, mountSurface, noise, odometer, pageDissolve, pill, pricingGlow, pullRefresh, pulse, rain, resolveColor, ripple, setFieldBudget, setGlobalLook, silk, skeleton, slideToConfirm, stars, statusOrb, streamText, subscribeGlobalLook, swell, swipeDeck, tabs, terrain, thinking, toastStack, veil, voiceOrb, voidWell, wave, weave, wordField, wordmark };
|
package/dist/kit.js
CHANGED
|
@@ -1 +1 @@
|
|
|
1
|
-
export{wave}from"./kit/chunk-2GAV4OAK.js";export{weave}from"./kit/chunk-W4U5CK6L.js";export{noise}from"./kit/chunk-M5VVLYI2.js";export{pulse}from"./kit/chunk-KEE55QSD.js";export{rain}from"./kit/chunk-BFBG3VHI.js";export{silk}from"./kit/chunk-3LJ5C3U3.js";export{stars}from"./kit/chunk-ORSI57T2.js";export{terrain}from"./kit/chunk-QSTDYL35.js";export{veil}from"./kit/chunk-CGSWUO67.js";export{
|
|
1
|
+
export{voidWell}from"./kit/chunk-7M2FFUZ3.js";export{wave}from"./kit/chunk-2GAV4OAK.js";export{weave}from"./kit/chunk-W4U5CK6L.js";export{morph}from"./kit/chunk-GKR3ROYR.js";export{noise}from"./kit/chunk-M5VVLYI2.js";export{pulse}from"./kit/chunk-KEE55QSD.js";export{rain}from"./kit/chunk-BFBG3VHI.js";export{silk}from"./kit/chunk-3LJ5C3U3.js";export{stars}from"./kit/chunk-ORSI57T2.js";export{terrain}from"./kit/chunk-QSTDYL35.js";export{veil}from"./kit/chunk-CGSWUO67.js";export{circuit}from"./kit/chunk-E3FPFANJ.js";export{dna}from"./kit/chunk-AIGAJMNN.js";export{dune}from"./kit/chunk-ZCXNGJGB.js";export{etch}from"./kit/chunk-CG6SGQMY.js";export{facet}from"./kit/chunk-6WU247CB.js";export{fire}from"./kit/chunk-UVLKCAKH.js";export{grid}from"./kit/chunk-WI2AF2KE.js";export{moire}from"./kit/chunk-B3TY6UXJ.js";import"./kit/chunk-XPXMCXYI.js";import"./kit/chunk-ZCHGV2CV.js";export{mountCanvas}from"./kit/chunk-3OD5BMF5.js";export{ripple}from"./kit/chunk-Z3KD6CLE.js";export{halo}from"./kit/chunk-6G5MPND3.js";export{interference}from"./kit/chunk-EKYEA7Z4.js";export{mesh}from"./kit/chunk-776H2BJ7.js";export{cascade}from"./kit/chunk-TRDA73HN.js";export{constellation}from"./kit/chunk-3MHEDZLZ.js";export{aurora}from"./kit/chunk-FHN3PPSI.js";export{halftone}from"./kit/chunk-DMRPBFLW.js";export{pullRefresh}from"./kit/chunk-4U72YE65.js";export{background,backgroundCharset}from"./kit/chunk-NW4U2YRE.js";export{swell}from"./kit/chunk-KY5KCIZE.js";export{drift}from"./kit/chunk-GBNV3GXG.js";export{wordField}from"./kit/chunk-RXOPJJC4.js";export{fluid}from"./kit/chunk-UOYBFLGJ.js";export{caustics}from"./kit/chunk-F6F2C3RH.js";export{contour}from"./kit/chunk-FPCCX4FM.js";import"./kit/chunk-3VEMKDBW.js";export{codeInput}from"./kit/chunk-KFXMLIVF.js";export{toastStack}from"./kit/chunk-OZFSNW5N.js";export{thinking}from"./kit/chunk-ZWZZMU5P.js";export{streamText}from"./kit/chunk-4NV5APSJ.js";export{compare}from"./kit/chunk-YSN7EHSH.js";export{accordion}from"./kit/chunk-G4ZSMTFN.js";export{dropzone}from"./kit/chunk-HYVTFKWX.js";export{disintegrate}from"./kit/chunk-3YSK7V26.js";export{VOICE_PALETTES,voiceOrb}from"./kit/chunk-KXI3T72F.js";export{commandPalette}from"./kit/chunk-PGFBIU7R.js";import"./kit/chunk-PB5E3D4E.js";export{likeBurst}from"./kit/chunk-NF4WVWAC.js";export{blockChart}from"./kit/chunk-VBWG7HQA.js";export{pageDissolve}from"./kit/chunk-LVCGC3SO.js";import"./kit/chunk-Z2FRNFMB.js";export{cursorTrail}from"./kit/chunk-2MLFWO4U.js";export{swipeDeck}from"./kit/chunk-FWODCYYJ.js";export{slideToConfirm}from"./kit/chunk-K6JX64AS.js";export{tabs}from"./kit/chunk-KLRF3S7O.js";export{imageGenerate}from"./kit/chunk-KDROJANO.js";export{fieldBackground}from"./kit/chunk-ILXVBO7M.js";export{wordmark}from"./kit/chunk-I5R2347P.js";export{asciiVideo}from"./kit/chunk-2LBQ7QJT.js";export{artPanel}from"./kit/chunk-XUCYFWC3.js";export{pricingGlow}from"./kit/chunk-42KMN727.js";import"./kit/chunk-7DXSG526.js";export{BEAM_PALETTES,beam,beamPalette}from"./kit/chunk-SDSW7422.js";export{decode}from"./kit/chunk-VV2KP7ZW.js";export{odometer}from"./kit/chunk-2FH6GGV6.js";export{buttonLoading}from"./kit/chunk-QVICL57J.js";export{statusOrb}from"./kit/chunk-KCEYRIU4.js";export{skeleton}from"./kit/chunk-H5KHXZWR.js";export{PILL_TONES,pill}from"./kit/chunk-WDS7VM2E.js";export{mountSurface,resolveColor}from"./kit/chunk-GF72XM4C.js";export{KIT_STYLES,getFieldBudget,getGlobalLook,setFieldBudget,setGlobalLook,subscribeGlobalLook}from"./kit/chunk-FEAFQY7O.js";//# sourceMappingURL=kit.js.map
|
package/package.json
CHANGED
|
@@ -1,6 +1,6 @@
|
|
|
1
1
|
{
|
|
2
2
|
"name": "asciify-engine",
|
|
3
|
-
"version": "4.
|
|
3
|
+
"version": "4.28.0",
|
|
4
4
|
"description": "Framework-agnostic ASCII art engine. Convert images, videos, and GIFs into ASCII art rendered on canvas, or run full-bleed GPU character fields with a fluid cursor wake.",
|
|
5
5
|
"type": "module",
|
|
6
6
|
"main": "./dist/index.cjs",
|
|
@@ -2,13 +2,13 @@
|
|
|
2
2
|
name: asciify-engine
|
|
3
3
|
description: Apply Asciify the way asciify.org does - ASCII components and backgrounds that belong in a real interface, inked from the theme, clear around text, inside the page's radii and motion. Use for UI components in characters (loading, status, toasts, tabs, AI states, charts, transitions, pages), animated ASCII backgrounds, and also photo, video and GIF conversion, GPU character fields, artwork looks for wallpapers, posters and prints, art styles and export, hover and motion, layered typography and rendering performance.
|
|
4
4
|
metadata:
|
|
5
|
-
tested-engine: "4.
|
|
5
|
+
tested-engine: "4.28.0"
|
|
6
6
|
updated: "2026-10-17"
|
|
7
7
|
---
|
|
8
8
|
|
|
9
9
|
# Asciify Engine
|
|
10
10
|
|
|
11
|
-
Use the published `asciify-engine` npm package. Tested against **4.
|
|
11
|
+
Use the published `asciify-engine` npm package. Tested against **4.28.0**. Check the application's installed version and its public types before using newer options; a local checkout can contain unpublished changes.
|
|
12
12
|
|
|
13
13
|
- Agent entry: https://asciify.org/skill (redirects to this Markdown document).
|
|
14
14
|
- Components: https://asciify.org/components · Looks: https://asciify.org/looks · Backgrounds: https://asciify.org/backgrounds
|
|
@@ -15,6 +15,7 @@ Pick by what the field does for the person, not by how it looks.
|
|
|
15
15
|
| Show a value changing | `odometer`, `pill` counts, `blockChart` |
|
|
16
16
|
| Move between states or views | `tabs`, `pageDissolve`, `commandPalette`, `toastStack`, `disintegrate` |
|
|
17
17
|
| Answer a gesture | `likeBurst`, `swipeDeck`, `compare`, `accordion`, `dropzone` |
|
|
18
|
+
| Follow the pointer across the page | `cursorTrail` (one per page, off on touch and under reduced motion) |
|
|
18
19
|
| Carry a brand moment or media | `decode`, `wordmark`, `asciiVideo`, `artPanel`, `pricingGlow`, `fieldBackground` `notFound` |
|
|
19
20
|
| Set the page's one ground | `fieldBackground` `hero`, or `background()` with a preset (section 9) |
|
|
20
21
|
|
|
@@ -203,7 +203,7 @@ For your own `mountSurface` or `mountPageField` component, pass the options box
|
|
|
203
203
|
Whole-element fields that draw their own scene or source: page backgrounds, a wordmark, a video, the sign-in art panel and the pricing card's glow. Each lays one canvas over or under the element (inset 0, following its border radius), inks it from the theme, honours reduced motion and restores the element on `destroy()`. Without WebGL2 they return inert handles and leave the HTML alone.
|
|
204
204
|
|
|
205
205
|
```ts
|
|
206
|
-
import { fieldBackground, wordmark, asciiVideo, artPanel, pricingGlow } from 'asciify-engine/kit';
|
|
206
|
+
import { fieldBackground, wordmark, asciiVideo, artPanel, pricingGlow, cursorTrail } from 'asciify-engine/kit';
|
|
207
207
|
```
|
|
208
208
|
|
|
209
209
|
### fieldBackground
|
|
@@ -231,7 +231,18 @@ input.oninput = () => mark.setText(input.value);
|
|
|
231
231
|
|
|
232
232
|
Options: `text`, `font` (default `Georgia, "Times New Roman", serif`), `fontWeight` (default 600), `artHeight` (height of the 1800 px wide canvas the word is set on, default 520; a shorter one sets the word larger in a wide element), `label` (the canvas's accessible name when the word is not the element's own text; default the word). Methods: `setText(text)`; getter `text`.
|
|
233
233
|
|
|
234
|
-
The
|
|
234
|
+
The site footer closes on `wordmark(box, { text: 'asciify', font: '"Fraunces", Georgia, serif', fontWeight: 600, label: 'Asciify', look: { cellSize } })`, with `cellSize` the box width / 190 held between 4 and 8 and the box capped at 1320px wide, and its hero is `fieldBackground(section, { preset: 'hero', ripple: false, palette: { light: '#7d7b75', dark: '#77756f' }, look: { scale: 1.25, cellSize: 12, brightness: 0.24, contrast: 1, charset: ' .:+*#', cellAspect: 0.62, glyphScale: 0.86, clear: { element: copy, padding: -24, feather: 0.6, shape: 'ellipse' } } })` (`scale` 1.6 under 760px).
|
|
235
|
+
|
|
236
|
+
### cursorTrail
|
|
237
|
+
|
|
238
|
+
Characters that follow the pointer across the whole page, in one line. It lays a fixed, full-viewport, click-through layer on the page's shared GPU context and draws the pointer's recent path into it: densest at the cursor and stepping down the charset along a tail that thins and fades over about 0.8s. Nothing mounts until the pointer first moves, and nothing draws once the last character has faded, so a still pointer costs nothing. It takes no element.
|
|
239
|
+
|
|
240
|
+
```ts
|
|
241
|
+
const cursor = cursorTrail({ style: 'trail', ink: '--ink', charset: ' .:-=+*#%@', cellSize: 9 });
|
|
242
|
+
picker.onchange = () => (picker.value === 'off' ? cursor.destroy() : cursor.update({ style: picker.value }));
|
|
243
|
+
```
|
|
244
|
+
|
|
245
|
+
Options: `style` (`'trail'` a fine tapered tail, `'wake'` a softer, wider band, `'water'` rings that spread from the path, `'sparkle'` glints scattered along it; default `trail`), `charset` (default ` .:-=+*#%@`), `cellSize` (CSS px, default 9), `life` (ms a point takes to fade, default 800, `water` 950), `zIndex` (default 1000; keep it under your dialogs and sticky header), `skip` (a selector to stay quiet over, on top of inputs, textareas, selects, `[contenteditable]`, dialogs and `[data-ascii-cursor-skip]`), plus the shared `ink` (default `--ascii-ink`, then the body's text colour), `look`, `reducedMotion` and `globalLook` (default `false`: the trail keeps its own ramp when `setGlobalLook` re-skins the page). Methods: `update`, `clear()`, `pause()`, `play()`, `destroy()`; getter `active` (something is fading). It is off on touch-only devices (`hover: none` and `pointer: coarse`) and for touch pointers, under reduced motion and while the tab is hidden. Mount it once per page (in React, in the app shell's effect); skip pages that have their own pointer work, such as an editor, and mark heroes with their own hover `data-ascii-cursor-skip`.
|
|
235
246
|
|
|
236
247
|
### asciiVideo
|
|
237
248
|
|
|
@@ -81,3 +81,7 @@ The website uses the published renderer's native Trail. A chain-shaped tonal ove
|
|
|
81
81
|
## 18. Accessible interaction
|
|
82
82
|
|
|
83
83
|
“Audit this Asciify component for keyboard access, touch scrolling, contrast, reduced motion and error states. Keep decorative canvases out of the reading order, provide text alternatives for meaningful artwork, and keep every CTA usable when rendering fails.”
|
|
84
|
+
|
|
85
|
+
## 19. Page-wide cursor trail
|
|
86
|
+
|
|
87
|
+
“Add an Asciify cursor trail to [our site] with `cursorTrail` from `asciify-engine/kit`: one call in the app shell, style [trail/wake/water/sparkle], inked from [our text token], fine cells. Keep it off on touch and under reduced motion, quiet over inputs, dialogs and [our heroes or editors] (`data-ascii-cursor-skip` or `skip`), under our header and dialogs (`zIndex`), and destroy it on unmount. If we offer a picker, store the choice per visitor and call `update({ style })` or `destroy()` live.”
|
|
@@ -1 +0,0 @@
|
|
|
1
|
-
import{clamp as t,hash as e}from"./chunk-GF72XM4C.js";function n(t){const e=()=>({image:t,width:t.naturalWidth,height:t.naturalHeight});return t.complete&&t.naturalWidth?Promise.resolve(e()):new Promise((n,o)=>{const a=()=>{r(),n(e())},i=()=>{r(),o(new Error(`Could not load ${t.src}`))},r=()=>{t.removeEventListener("load",a),t.removeEventListener("error",i)};t.addEventListener("load",a),t.addEventListener("error",i)})}function o(t,e=document.createElement("img")){return(t=>{try{return"undefined"!=typeof location&&new URL(t,location.href).origin!==location.origin}catch{return!1}})(t)&&!e.crossOrigin&&(e.crossOrigin="anonymous"),e.decoding="async",e.src=t,e}function a(t,e,n,o,a,i,r=.5,h=.5){if(a<=0||i<=0||!e.width||!e.height)return;const l=Math.max(a/e.width,i/e.height),c=a/l,d=i/l;t.drawImage(e.image,(e.width-c)*r,(e.height-d)*h,c,d,n,o,a,i)}function i(e,n,o=.08){const a=Math.min(1,420/Math.max(1,e.width,e.height)),i=document.createElement("canvas");i.width=Math.max(1,Math.round(e.width*a)),i.height=Math.max(1,Math.round(e.height*a));const r=i.getContext("2d",{willReadFrequently:!0});if(!r)return e;let h;r.drawImage(e.image,0,0,i.width,i.height);try{h=r.getImageData(0,0,i.width,i.height)}catch{return e}const l=h.data,c=new Uint32Array(256),d=l.length/4,s=t=>.2126*l[t]+.7152*l[t+1]+.0722*l[t+2];for(let t=0;t<l.length;t+=4)c[Math.round(s(t))]++;let u=0,f=255,g=0;for(let t=0;t<256;t++)if(g+=c[t],g>=.02*d){u=t;break}g=0;for(let t=255;t>=0;t--)if(g+=c[t],g>=.02*d){f=t;break}const m=Math.max(1,f-u);for(let e=0;e<l.length;e+=4){let a=t((s(e)-u)/m);n&&(a=1-a),l[e]=l[e+1]=l[e+2]=Math.round(255*(o+(1-o)*a)),l[e+3]=255}return r.putImageData(h,0,0),{image:i,width:i.width,height:i.height}}var r={strong:1,text:.82,meta:.55,tile:.42,icon:.62},h=new Set(["IMG","SVG","svg","VIDEO","PICTURE"]),l=t=>[...t.children].flatMap(t=>h.has(t.tagName)?[t]:[t,...l(t)]);function c(e,n,o,a){const i=document.createElement("canvas");i.width=Math.max(2,Math.round(2*n)),i.height=Math.max(2,Math.round(2*o));const c=[],d=i.getContext("2d");if(!d)return{canvas:i,rects:c};d.scale(2,2),d.fillStyle="#000",d.fillRect(0,0,n,o);const s=a(e),u=e.getBoundingClientRect(),f=u.width/(e.offsetWidth||u.width||1)||1,g=t=>{for(let n=t;n&&n!==e.parentElement;n=n.parentElement){const t=n.dataset?.paint;if(t&&void 0!==r[t])return r[t]}return parseFloat(t?getComputedStyle(t).fontWeight:"400")>=500?1:.7},m=e=>{const n=Math.round(255*t(e));return`rgb(${n} ${n} ${n})`},w=l(e),p=[e,...w].filter(t=>{const e=t.dataset?.paint;return"tile"===e||"icon"===e||!e&&h.has(t.tagName)&&!t.closest("[data-paint]")});for(const t of p){const e=a(t);if(e.w<=0||e.h<=0)continue;const n=t.dataset?.paint;d.fillStyle=m("icon"===n?r.icon:r.tile),d.beginPath(),"icon"===n||"svg"===t.tagName.toLowerCase()?d.arc(e.x+e.w/2,e.y+e.h/2,.4*Math.min(e.w,e.h),0,2*Math.PI):d.roundRect(e.x,e.y,e.w,e.h,Math.min(parseFloat(getComputedStyle(t).borderTopLeftRadius)||0,e.h/2)),d.fill(),c.push(e)}const y=document.createTreeWalker(e,4),x=document.createRange();d.textBaseline="middle";for(let t=y.nextNode();t;t=y.nextNode()){const e=t.parentElement;if(!e||e.closest('[data-paint="none"]'))continue;const n=getComputedStyle(e);d.font=`${n.fontStyle} ${n.fontWeight} ${n.fontSize} ${n.fontFamily}`,d.fillStyle=m(g(e)),d.shadowColor=d.fillStyle,d.shadowBlur=4;for(const e of t.data.matchAll(/\S+/g)){x.setStart(t,e.index),x.setEnd(t,e.index+e[0].length);const n=x.getClientRects()[0];if(!n)continue;const o={x:s.x+(n.left-u.left)/f,y:s.y+(n.top-u.top)/f,w:n.width/f,h:n.height/f};d.fillText(e[0],o.x,o.y+o.h/2),c.push(o)}}return d.shadowBlur=0,x.detach?.(),{canvas:i,rects:c}}function d(t){const n=new Set,o=[];for(const a of t)for(let t=6*Math.floor((a.y-2)/6);t<a.y+a.h+2;t+=6)for(let i=4*Math.floor((a.x-2)/4);i<a.x+a.w+2;i+=4){const a=`${i},${t}`;n.has(a)||(n.add(a),o.push({x:i,y:t,seed:e(i,t)}))}return o}function s(t,e,n,o,a,i,r=1,h=.32){for(let l=0;l<n.length;l++){const c=n[l],d=(a-o[l]*(1-h))/h;if(d<=0)continue;const s=d>=1?0:1-d;let u=c.x,f=c.y;if(s>0){const[t,e]=i(c,s);u+=t,f+=e}t.globalAlpha=r*(1-s*s),t.drawImage(e,2*c.x,2*c.y,8,12,u,f,4,6)}t.globalAlpha=1}function u(t,e){if("undefined"==typeof document||document.getElementById(t))return;const n=document.createElement("style");n.setAttribute("id",t),n.textContent=e,(document.head??document.documentElement).appendChild(n)}export{d as blocksOf,s as drawBlocks,a as drawCover,o as imageFor,n as imageReady,u as injectStyle,c as snapshot,i as toneOf};//# sourceMappingURL=chunk-LE53AVKR.js.map
|