@graphysdk/theme-comic 0.0.0-stage → 0.1.0

package/LICENSE.md

@@ -0,0 +1,17 @@
+# License
+
+This software is available under any of the following licenses, at your option,
+depending on which one's conditions you meet:
+
+- **PolyForm Noncommercial 1.0.0** — for noncommercial use (personal,
+  charitable, educational, research, government).
+  See [licenses/PolyForm-NonCommercial-1.0.0.md](licenses/PolyForm-NonCommercial-1.0.0.md)
+
+- **PolyForm Small Business 1.0.0** — free commercial use for organizations
+  under the size thresholds defined in the license.
+  See [licenses/PolyForm-Small-Business-1.0.0.md](licenses/PolyForm-Small-Business-1.0.0.md)
+
+- **PolyForm Free Trial 1.0.0** — a 32-day evaluation for anyone else.
+  See [licenses/PolyForm-Free-Trial-1.0.0.md](licenses/PolyForm-Free-Trial-1.0.0.md)
+
+For commercial use beyond these terms, contact [hello@graphy.dev](mailto:hello@graphy.dev) or visit [https://graphy.dev](https://graphy.dev).

package/README.md

@@ -1,3 +1,60 @@
-# Temporary Holding Version
+# @graphysdk/theme-comic
 
-This version is a temporary placeholder for this package. An operational version to replace this has been submitted for review and is awaiting a staged release.
+> **Beta.** This theme is on a `0.x` version line: a minor release may change its look. Use a caret range (`^0.1.0`) to take only patches.
+
+A comic theme for the Graphy charting SDK: graphs drawn as a panel of a printed comic, with black outlines, flat primary colours under printed dots, and hard shadows.
+
+Learn more at [graphy.dev](https://graphy.dev).
+
+## Install
+
+```bash
+npm install @graphysdk/theme-comic @graphysdk/react
+```
+
+Requires React 19. Its only peer is `@graphysdk/react`.
+
+## Usage
+
+Pass the theme to `createGraphyKit` and import its fonts once. Every graph drawn through the kit's `GraphProvider` takes the theme; specs are written as usual.
+
+```tsx
+import { createGraphyKit, GraphRenderer } from '@graphysdk/react';
+import { comic } from '@graphysdk/theme-comic';
+import '@graphysdk/theme-comic/fonts.css';
+
+const kit = createGraphyKit({ theme: comic });
+
+const spec = kit.pipe(
+  kit.createSpec({ x: 'quarter', y: 'revenue', color: 'region' }),
+  kit.geom.bar({ position: 'dodge' }),
+  kit.scale.x(),
+  kit.scale.y()
+);
+
+export function Revenue({ data }) {
+  return (
+    <kit.GraphProvider spec={spec} data={data}>
+      <GraphRenderer />
+    </kit.GraphProvider>
+  );
+}
+```
+
+A spec's own `styles()`, scales and `config()` sit above the theme, so a graph can still change anything. The theme is drawn for a graph about 600 pixels wide; `style.graph({ textScale: 1.5 })` scales its type for a larger one.
+
+`fonts.css` loads Bangers for the title and Comic Neue for the rest from Google Fonts. To host the fonts yourself, leave the import out and load families named `Bangers` and `Comic Neue` before the first graph is drawn.
+
+## Docs
+
+- [Comic](https://docs.graphy.dev/sdk-next/themes/comic)
+
+## Feedback
+
+This theme is released early to hear what works. Tell us on [Discord](https://discord.gg/yGmYCjkSr).
+
+## Licence
+
+This package is available under PolyForm Noncommercial, Small Business, or a 32-day Free Trial. Free Trial is local or internal evaluation only — it does not cover a public page. See [what you can do under the trial](https://docs.graphy.dev/licence/evaluation).
+
+For a commercial licence, [talk to us](https://graphy.dev/license).

package/dist/comic.d.ts

@@ -0,0 +1,17 @@
+import { Theme } from '@graphysdk/react';
+/**
+ * Graphs as a panel of a printed comic, by way of the sound effects of the 1960s Batman show: a
+ * square black frame round newsprint with a patch of screen tone in its corner, the flat colours of a
+ * four-colour press under its dots, a black outline and a hard black shadow for every shape, thick
+ * round lines and a title in capitals. A pie or a donut is the burst a comic letters "POW!" in, each
+ * slice cut to its jagged edge at exactly its angles; a point is a little burst centred on its
+ * reading. A text annotation is lettered as a sound effect, red capitals on a yellow plate. Groups take
+ * vermillion, cyan, yellow, magenta, green and purple. Drawn for the light scheme only.
+ *
+ * The faces are Bangers for the title, the sound effects, the axis names and the key, and Comic Neue
+ * for the rest. Import `@graphysdk/theme-comic/fonts.css` once to load them.
+ *
+ * @example
+ *   const kit = createGraphyKit({ theme: comic });
+ */
+export declare const comic: Theme;

package/dist/halftone.d.ts

@@ -0,0 +1,5 @@
+/**
+ * The paper as a data URI, for the graph's `fill`: `paper` all over, with a tone of `ink` dots
+ * fading out of its top right corner, where a title set from the left leaves the paper bare.
+ */
+export declare const buildHalftonePaper: (paper: string, ink: string, inkOpacity: number) => string;

package/dist/index.cjs

@@ -0,0 +1 @@
+Object.defineProperty(exports,Symbol.toStringTag,{value:"Module"});let I=require("react"),e=require("@graphysdk/react"),g=require("react/jsx-runtime");var M=(t,r)=>{const o=(0,e.getX)(t),l=(0,e.getY)(t)??(0,e.getYMax)(t);return o===null||l===null?null:{x:(0,e.toViewBoxX)(o)*r.width,y:(0,e.toViewBoxY)(l)*r.height}},Y=(t,r)=>{const o=(0,e.getX)(t),l=(0,e.getY)(t)??(0,e.getRadiusExtent)(t).outerRadius;if(o===null||l===null)return null;const i=(0,e.polarToUnit)(o,l),n=Math.min(r.width,r.height)/2;return{x:r.width/2+i.x*n,y:r.height/2-i.y*n}},z=22,F=Math.PI*2,ke=F/(z*2),$=(t,r,o)=>({x:t.x+Math.sin(o.angle)*o.radius*r,y:t.y-Math.cos(o.angle)*o.radius*r}),E=2,X=({x:t,y:r})=>`${t.toFixed(E)},${r.toFixed(E)}`,_=8,j=.6,G=(t,r)=>{const o=r/2,l=F/(_*2);return`M${Array.from({length:_*2},(i,n)=>$(t,o,{angle:n*l,radius:n%2===0?1:j})).map(X).join(" L")} Z`},D=t=>{const r=(0,e.useGeomStyleReader)(t);return(o,l)=>{const i=r.get("shadow",o,l);return{color:(0,e.toPaintColor)(r.get("fill",o,l)),opacity:r.get("alpha",o,l),fillOpacity:r.get("fillAlpha",o,l),outline:r.get("stroke",o,l),outlineWidth:r.get("strokeWidth",o,l),shadow:i==="none"?null:{offsetX:i.offsetX,offsetY:i.offsetY,color:i.color}}}},U=1.35,K=4,V=1,R=({layer:t,observations:r,panel:o,project:l,state:i})=>{const n=(0,e.useGeomStyleReader)(t),f=D(t),u=(0,I.useMemo)(()=>(0,e.createStableKeyGenerator)(t.data,t.mapping,t.id),[t.data,t.mapping,t.id]),v=i==="hovered";return(0,g.jsx)("g",{"data-geom":"point",children:Array.from(r,p=>{const h=l(p,o);if(h===null)return null;const s=f(p,i),d=G(h,n.get("size",p,i)*U+(v?K:0));return(0,g.jsxs)("g",{opacity:s.opacity,children:[s.shadow!==null&&(0,g.jsx)("path",{d,transform:`translate(${s.shadow.offsetX} ${s.shadow.offsetY})`,fill:s.shadow.color}),(0,g.jsx)("path",{d,fill:s.color,fillOpacity:s.fillOpacity,stroke:s.outline,strokeWidth:s.outlineWidth+(v?V:0),strokeLinejoin:"round"})]},u(p))})})},N=(t,r)=>(0,e.defineGeomRenderer)("point",{coord:t,swatchShape:"circle",render:({layer:o,panelRect:l})=>(0,g.jsx)(R,{layer:o,observations:o.data,panel:l,project:r}),renderHover:({layer:o,primary:l,panelRect:i})=>(0,g.jsx)(R,{layer:o,observations:[l.observation],panel:i,project:r,state:"hovered"}),renderHoverCompanions:()=>null}),q=N("cartesian",M),J=N("polar",Y),Z=2,Q=2,ee=(t,r,o)=>[...t].flatMap(l=>{const{startAngle:i,endAngle:n}=(0,e.getAngleExtent)(l),{innerRadius:f,outerRadius:u}=(0,e.getRadiusExtent)(l);return i===null||n===null||f===null||u===null?[]:n<=i||u<=0?[]:[{key:`${o(l)}-${i}`,paint:r(l),startAngle:i,endAngle:n,innerRadius:f,outerRadius:u}]}),te=(t,r,o)=>(0,e.buildPolarBarArcPath)(t,{centerX:r.x,centerY:r.y,radius:o,digits:Q}),C=({layer:t,observations:r,panel:o,state:l})=>{const i=D(t),n=(0,I.useMemo)(()=>(0,e.createStableKeyGenerator)(t.data,t.mapping,t.id),[t.data,t.mapping,t.id]),f=Math.min(o.width,o.height)/2;if(f<=0)return null;const u={x:o.width/2,y:o.height/2},v=ee(r,h=>i(h,l),n).flatMap(h=>{const s=te(h,u,f);return s===void 0?[]:[{key:h.key,path:s,paint:h.paint}]}),p=l==="hovered";return(0,g.jsxs)("g",{"data-geom":"bar",children:[!p&&v.map(({key:h,path:s,paint:d})=>d.shadow===null?null:(0,g.jsx)("path",{d:s,transform:`translate(${d.shadow.offsetX} ${d.shadow.offsetY})`,fill:d.shadow.color,opacity:d.opacity},`${h}-shadow`)),v.map(({key:h,path:s,paint:d})=>(0,g.jsx)("path",{"data-comic-slice":"sector",d:s,fill:d.color,fillOpacity:d.fillOpacity,fillRule:"evenodd",stroke:d.outline,strokeWidth:d.outlineWidth+(p?Z:0),strokeLinejoin:"round",opacity:d.opacity},h))]})},oe=(0,e.defineGeomRenderer)("bar",{coord:"polar",guideMode:"band",swatchShape:"slice",render:({layer:t,panelRect:r})=>(0,g.jsx)(C,{layer:t,observations:t.data,panel:r}),renderHover:({layer:t,primary:r,panelRect:o})=>(0,g.jsx)(C,{layer:t,observations:[r.observation],panel:o,state:"hovered"}),renderHoverCompanions:()=>null}),re=[oe,q,J],k=10,ae=.42,P=220,le=.6,T=1,ie=()=>{const t=Math.ceil(P/k),r=[];for(let o=0;o<=t;o+=1){const l=o%2===0?0:k/2;for(let i=0;i<=23;i+=1){const n=-(i*k+l),f=o*k,u=k*ae*(1-Math.hypot(n,f)/P);u>=le&&r.push(`<circle cx="${n.toFixed(T)}" cy="${f.toFixed(T)}" r="${u.toFixed(T)}"/>`)}}return r.join("")},ne=(t,r,o)=>{const l=`<svg xmlns="http://www.w3.org/2000/svg" width="100%" height="100%"><rect width="100%" height="100%" fill="${t}"/><svg x="100%" y="0" width="1" height="1" overflow="visible"><g fill="${r}" fill-opacity="${o}">${ie()}</g></svg></svg>`;return`data:image/svg+xml,${encodeURIComponent(l)}`},a={paper:"#FBF3DF",bubble:"#FFFDF6",black:"#141414",secondary:"#4A4338",grid:"rgba(20, 20, 20, 0.2)"},w="'Bangers', 'Comic Neue', 'Comic Sans MS', cursive",se="'Comic Neue', 'Comic Sans MS', 'Chalkboard SE', cursive",c={vermillion:"#D9401F",cyan:"#0B85C8",yellow:"#FFD60A",magenta:"#D6247A",green:"#15964B",purple:"#7A3DC8"},de=[c.vermillion,c.cyan,c.yellow,c.magenta,c.green,c.purple],ce=["#FFE45C","#F58A1F","#C4161C"],A={offsetX:4,offsetY:4,blur:0,color:a.black},he={offsetX:6,offsetY:6,blur:0,color:a.black},S={offsetX:2,offsetY:2,blur:0,color:a.black},L={offsetX:4,offsetY:4,blur:0,color:a.black},ge={offsetX:6,offsetY:6,blur:0,color:a.black},fe={offsetX:2,offsetY:2,blur:0,color:c.yellow},ue={pattern:"dots",color:"rgba(20, 20, 20, 0.24)",size:7},pe={image:ne(a.paper,c.vermillion,.18),fit:"stretch",fallback:a.paper},ye={fontFamily:w,fontWeight:400,fontSize:22,lineHeight:1.05,letterSpacing:1.5,textTransform:"uppercase",textColor:a.black},B={fill:c.yellow,stroke:a.black,strokeWidth:3,cornerRadius:0,paddingInline:10,paddingBlock:5,shadow:{offsetX:5,offsetY:5,blur:0,color:c.vermillion}},x={fontFamily:w,fontWeight:400,fontSize:16,lineHeight:1.05,letterSpacing:1,textTransform:"uppercase",textColor:a.black},O={...B,strokeWidth:2.5,paddingInline:7,paddingBlock:3,shadow:{offsetX:3,offsetY:3,blur:0,color:c.vermillion}},W={fontFamily:w,fontWeight:400,letterSpacing:1,textTransform:"uppercase"},y={stroke:a.black,strokeAlpha:1},H={dashArray:[],lineCap:"round",lineJoin:"round"},m={textColor:a.black,fontWeight:700},b={textColor:a.secondary,fontWeight:700},me={tokens:{graphBackground:a.paper,graphBorder:a.black,geom:c.vermillion,geomBorder:a.black,textPrimary:a.black,textSecondary:a.secondary,ruleLine:a.black,gridLine:a.grid,hoverAffordance:a.black,hoverGuideFill:"rgba(20, 20, 20, 0.07)",hoverGuideLine:a.black,tooltipBackground:a.bubble,tooltipBorder:a.black,tooltipPrimaryRow:"rgba(255, 214, 10, 0.35)",annotationShape:c.yellow,annotationArrow:a.black,differenceLabelBackground:a.bubble},defaults:[e.style.graph({fill:pe,strokeWidth:4,cornerRadius:0,fontFamily:se,padding:22,shadow:ge}),e.style.geom({shadow:A,overlay:ue}),e.style.geom({shadow:A},{state:"hovered"}),e.style.geom.bar({...y,strokeWidth:2.5,cornerRadius:0}),e.style.geom.bar({...y,strokeWidth:2.5,shadow:he},{state:"hovered"}),e.style.geom.line({strokeWidth:3.5,...H,shadow:S,overlay:"none"}),e.style.geom.line({shadow:S},{state:"hovered"}),e.style.geom.area({...y,fillAlpha:1,strokeWidth:2.5,...H}),e.style.geom.point({...y,size:13,strokeWidth:2,shadow:S}),e.style.geom.point({...y,strokeWidth:2,shadow:"none"},{state:"hovered"}),e.style.geom.tile({...y,cornerRadius:2,strokeWidth:1.5,shadow:"none"}),e.style.geom.tile({...y,strokeWidth:3,shadow:"none"},{state:"hovered"}),e.style.geom.rule({strokeWidth:2.5,dashArray:[3,3],lineCap:"round",shadow:"none"}),e.style.geom.rule.label({...W,textColor:c.yellow,fontSize:15}),e.style.gridLine({dashArray:[1,5]}),e.style.gridLine.x({strokeWidth:0}),e.style.gridLine.y({strokeWidth:1.5}),e.style.panelBorder({strokeWidth:0}),e.style.panelBorder.bottom({stroke:a.black,strokeWidth:3,dashArray:[]}),e.style.tickLine({strokeWidth:0}),e.style.tickLabel({...b,fontSize:14,lineHeight:1}),e.style.axisLabel({...m,...W,fontSize:18,lineHeight:1}),e.style.heading({...m}),e.style.heading.h1({fontFamily:w,fontWeight:400,fontSize:36,lineHeight:1,letterSpacing:1,textTransform:"uppercase",textShadow:fe}),e.style.heading.h2({...b,fontSize:16,lineHeight:1.2}),e.style.header({margin:{bottom:18}}),e.style.caption({...b,fontWeight:400,fontSize:13}),e.style.source({...b,fontWeight:400,fontSize:13}),e.style.dataLabel({...m,fontSize:14,fill:"transparent"}),e.style.legendItem({...m,...W,fontSize:18,fill:"transparent",stroke:"transparent"}),e.style.legendItem.swatch({size:16}),e.style.directLabel({fontWeight:700,fontSize:14}),e.style.tooltip({strokeWidth:2.5,cornerRadius:10,paddingInline:12,paddingBlock:9,shadow:L}),e.style.tooltip.heading({...m,fontSize:15,lineHeight:1.3}),e.style.tooltip.label({...b,fontSize:14,lineHeight:1.3}),e.style.tooltip.value({...m,fontSize:14,lineHeight:1.3}),e.style.legend.popover({strokeWidth:2.5,cornerRadius:10,shadow:L}),e.style.annotation.text({...ye,...B}),e.style.annotation.shape({fillAlpha:.35,stroke:a.black,strokeWidth:2}),e.style.annotation.arrow({strokeWidth:3.5,dashArray:[]}),e.style.annotation.arrow.outline({stroke:a.paper,strokeWidth:2}),e.style.annotation.pinnedNumber({stroke:a.black,shadow:S}),e.style.annotation.pinnedNumber.label({...x,...O}),e.style.annotation.comment({stroke:a.black,shadow:S}),e.style.annotation.comment.label({...x,...O}),e.style.annotation.differenceArrow({stroke:a.black,strokeWidth:2.5}),e.style.annotation.differenceArrow.label({...x,...O,fontSize:18}),e.style.panelBorder.bottom({strokeWidth:0},{coord:"polar"}),e.style.tickLabel({...m,textOutlineColor:a.paper,textOutlineWidth:3.5},{coord:"polar"}),e.style.geom.area({fillAlpha:.5,shadow:"none"},{coord:"polar"}),e.style.geom.area({shadow:"none"},{coord:"polar",state:"hovered"}),e.style.geom.bar({strokeWidth:2.5,shadow:A},{coord:"polar"}),e.style.geom.bar({strokeWidth:2.5},{coord:"polar",state:"hovered"})]},ve={name:"comic",styles:me,palette:de,colormap:ce,colorScheme:"light",plugins:re};exports.comic=ve;

package/dist/index.d.ts

@@ -0,0 +1 @@
+export { comic } from './comic';

package/dist/index.mjs

@@ -0,0 +1,551 @@
+import { useMemo as I } from "react";
+import { buildPolarBarArcPath as j, createStableKeyGenerator as F, defineGeomRenderer as D, getAngleExtent as K, getRadiusExtent as N, getX as B, getY as M, getYMax as V, polarToUnit as J, style as e, toPaintColor as Z, toViewBoxX as q, toViewBoxY as Q, useGeomStyleReader as z } from "@graphysdk/react";
+import { jsx as p, jsxs as Y } from "react/jsx-runtime";
+var ee = (o, r) => {
+  const t = B(o), i = M(o) ?? V(o);
+  return t === null || i === null ? null : {
+    x: q(t) * r.width,
+    y: Q(i) * r.height
+  };
+}, oe = (o, r) => {
+  const t = B(o), i = M(o) ?? N(o).outerRadius;
+  if (t === null || i === null) return null;
+  const n = J(t, i), l = Math.min(r.width, r.height) / 2;
+  return {
+    x: r.width / 2 + n.x * l,
+    y: r.height / 2 - n.y * l
+  };
+}, te = 22, $ = Math.PI * 2, Ie = $ / (te * 2), re = (o, r, t) => ({
+  x: o.x + Math.sin(t.angle) * t.radius * r,
+  y: o.y - Math.cos(t.angle) * t.radius * r
+}), R = 2, ae = ({ x: o, y: r }) => `${o.toFixed(R)},${r.toFixed(R)}`, _ = 8, ie = 0.6, ne = (o, r) => {
+  const t = r / 2, i = $ / (_ * 2);
+  return `M${Array.from({ length: _ * 2 }, (n, l) => re(o, t, {
+    angle: l * i,
+    radius: l % 2 === 0 ? 1 : ie
+  })).map(ae).join(" L")} Z`;
+}, X = (o) => {
+  const r = z(o);
+  return (t, i) => {
+    const n = r.get("shadow", t, i);
+    return {
+      color: Z(r.get("fill", t, i)),
+      opacity: r.get("alpha", t, i),
+      fillOpacity: r.get("fillAlpha", t, i),
+      outline: r.get("stroke", t, i),
+      outlineWidth: r.get("strokeWidth", t, i),
+      shadow: n === "none" ? null : {
+        offsetX: n.offsetX,
+        offsetY: n.offsetY,
+        color: n.color
+      }
+    };
+  };
+}, le = 1.35, se = 4, de = 1, C = ({ layer: o, observations: r, panel: t, project: i, state: n }) => {
+  const l = z(o), f = X(o), g = I(() => F(o.data, o.mapping, o.id), [
+    o.data,
+    o.mapping,
+    o.id
+  ]), k = n === "hovered";
+  return /* @__PURE__ */ p("g", {
+    "data-geom": "point",
+    children: Array.from(r, (u) => {
+      const h = i(u, t);
+      if (h === null) return null;
+      const s = f(u, n), d = ne(h, l.get("size", u, n) * le + (k ? se : 0));
+      return /* @__PURE__ */ Y("g", {
+        opacity: s.opacity,
+        children: [s.shadow !== null && /* @__PURE__ */ p("path", {
+          d,
+          transform: `translate(${s.shadow.offsetX} ${s.shadow.offsetY})`,
+          fill: s.shadow.color
+        }), /* @__PURE__ */ p("path", {
+          d,
+          fill: s.color,
+          fillOpacity: s.fillOpacity,
+          stroke: s.outline,
+          strokeWidth: s.outlineWidth + (k ? de : 0),
+          strokeLinejoin: "round"
+        })]
+      }, g(u));
+    })
+  });
+}, G = (o, r) => D("point", {
+  coord: o,
+  swatchShape: "circle",
+  render: ({ layer: t, panelRect: i }) => /* @__PURE__ */ p(C, {
+    layer: t,
+    observations: t.data,
+    panel: i,
+    project: r
+  }),
+  renderHover: ({ layer: t, primary: i, panelRect: n }) => /* @__PURE__ */ p(C, {
+    layer: t,
+    observations: [i.observation],
+    panel: n,
+    project: r,
+    state: "hovered"
+  }),
+  renderHoverCompanions: () => null
+}), ce = G("cartesian", ee), he = G("polar", oe), fe = 2, ge = 2, pe = (o, r, t) => [...o].flatMap((i) => {
+  const { startAngle: n, endAngle: l } = K(i), { innerRadius: f, outerRadius: g } = N(i);
+  return n === null || l === null || f === null || g === null ? [] : l <= n || g <= 0 ? [] : [{
+    key: `${t(i)}-${n}`,
+    paint: r(i),
+    startAngle: n,
+    endAngle: l,
+    innerRadius: f,
+    outerRadius: g
+  }];
+}), ue = (o, r, t) => j(o, {
+  centerX: r.x,
+  centerY: r.y,
+  radius: t,
+  digits: ge
+}), x = ({ layer: o, observations: r, panel: t, state: i }) => {
+  const n = X(o), l = I(() => F(o.data, o.mapping, o.id), [
+    o.data,
+    o.mapping,
+    o.id
+  ]), f = Math.min(t.width, t.height) / 2;
+  if (f <= 0) return null;
+  const g = {
+    x: t.width / 2,
+    y: t.height / 2
+  }, k = pe(r, (h) => n(h, i), l).flatMap((h) => {
+    const s = ue(h, g, f);
+    return s === void 0 ? [] : [{
+      key: h.key,
+      path: s,
+      paint: h.paint
+    }];
+  }), u = i === "hovered";
+  return /* @__PURE__ */ Y("g", {
+    "data-geom": "bar",
+    children: [!u && k.map(({ key: h, path: s, paint: d }) => d.shadow === null ? null : /* @__PURE__ */ p("path", {
+      d: s,
+      transform: `translate(${d.shadow.offsetX} ${d.shadow.offsetY})`,
+      fill: d.shadow.color,
+      opacity: d.opacity
+    }, `${h}-shadow`)), k.map(({ key: h, path: s, paint: d }) => /* @__PURE__ */ p("path", {
+      "data-comic-slice": "sector",
+      d: s,
+      fill: d.color,
+      fillOpacity: d.fillOpacity,
+      fillRule: "evenodd",
+      stroke: d.outline,
+      strokeWidth: d.outlineWidth + (u ? fe : 0),
+      strokeLinejoin: "round",
+      opacity: d.opacity
+    }, h))]
+  });
+}, me = D("bar", {
+  coord: "polar",
+  guideMode: "band",
+  swatchShape: "slice",
+  render: ({ layer: o, panelRect: r }) => /* @__PURE__ */ p(x, {
+    layer: o,
+    observations: o.data,
+    panel: r
+  }),
+  renderHover: ({ layer: o, primary: r, panelRect: t }) => /* @__PURE__ */ p(x, {
+    layer: o,
+    observations: [r.observation],
+    panel: t,
+    state: "hovered"
+  }),
+  renderHoverCompanions: () => null
+}), ve = [
+  me,
+  ce,
+  he
+], b = 10, ke = 0.42, L = 220, be = 0.6, A = 1, Se = () => {
+  const o = Math.ceil(L / b), r = [];
+  for (let t = 0; t <= o; t += 1) {
+    const i = t % 2 === 0 ? 0 : b / 2;
+    for (let n = 0; n <= 23; n += 1) {
+      const l = -(n * b + i), f = t * b, g = b * ke * (1 - Math.hypot(l, f) / L);
+      g >= be && r.push(`<circle cx="${l.toFixed(A)}" cy="${f.toFixed(A)}" r="${g.toFixed(A)}"/>`);
+    }
+  }
+  return r.join("");
+}, we = (o, r, t) => {
+  const i = `<svg xmlns="http://www.w3.org/2000/svg" width="100%" height="100%"><rect width="100%" height="100%" fill="${o}"/><svg x="100%" y="0" width="1" height="1" overflow="visible"><g fill="${r}" fill-opacity="${t}">${Se()}</g></svg></svg>`;
+  return `data:image/svg+xml,${encodeURIComponent(i)}`;
+}, a = {
+  paper: "#FBF3DF",
+  bubble: "#FFFDF6",
+  black: "#141414",
+  secondary: "#4A4338",
+  grid: "rgba(20, 20, 20, 0.2)"
+}, T = "'Bangers', 'Comic Neue', 'Comic Sans MS', cursive", Te = "'Comic Neue', 'Comic Sans MS', 'Chalkboard SE', cursive", c = {
+  vermillion: "#D9401F",
+  cyan: "#0B85C8",
+  yellow: "#FFD60A",
+  magenta: "#D6247A",
+  green: "#15964B",
+  purple: "#7A3DC8"
+}, Ae = [
+  c.vermillion,
+  c.cyan,
+  c.yellow,
+  c.magenta,
+  c.green,
+  c.purple
+], ye = [
+  "#FFE45C",
+  "#F58A1F",
+  "#C4161C"
+], y = {
+  offsetX: 4,
+  offsetY: 4,
+  blur: 0,
+  color: a.black
+}, Oe = {
+  offsetX: 6,
+  offsetY: 6,
+  blur: 0,
+  color: a.black
+}, S = {
+  offsetX: 2,
+  offsetY: 2,
+  blur: 0,
+  color: a.black
+}, P = {
+  offsetX: 4,
+  offsetY: 4,
+  blur: 0,
+  color: a.black
+}, We = {
+  offsetX: 6,
+  offsetY: 6,
+  blur: 0,
+  color: a.black
+}, Ee = {
+  offsetX: 2,
+  offsetY: 2,
+  blur: 0,
+  color: c.yellow
+}, Re = {
+  pattern: "dots",
+  color: "rgba(20, 20, 20, 0.24)",
+  size: 7
+}, _e = {
+  image: we(a.paper, c.vermillion, 0.18),
+  fit: "stretch",
+  fallback: a.paper
+}, Ce = {
+  fontFamily: T,
+  fontWeight: 400,
+  fontSize: 22,
+  lineHeight: 1.05,
+  letterSpacing: 1.5,
+  textTransform: "uppercase",
+  textColor: a.black
+}, U = {
+  fill: c.yellow,
+  stroke: a.black,
+  strokeWidth: 3,
+  cornerRadius: 0,
+  paddingInline: 10,
+  paddingBlock: 5,
+  shadow: {
+    offsetX: 5,
+    offsetY: 5,
+    blur: 0,
+    color: c.vermillion
+  }
+}, O = {
+  fontFamily: T,
+  fontWeight: 400,
+  fontSize: 16,
+  lineHeight: 1.05,
+  letterSpacing: 1,
+  textTransform: "uppercase",
+  textColor: a.black
+}, W = {
+  ...U,
+  strokeWidth: 2.5,
+  paddingInline: 7,
+  paddingBlock: 3,
+  shadow: {
+    offsetX: 3,
+    offsetY: 3,
+    blur: 0,
+    color: c.vermillion
+  }
+}, E = {
+  fontFamily: T,
+  fontWeight: 400,
+  letterSpacing: 1,
+  textTransform: "uppercase"
+}, m = {
+  stroke: a.black,
+  strokeAlpha: 1
+}, H = {
+  dashArray: [],
+  lineCap: "round",
+  lineJoin: "round"
+}, v = {
+  textColor: a.black,
+  fontWeight: 700
+}, w = {
+  textColor: a.secondary,
+  fontWeight: 700
+}, xe = {
+  tokens: {
+    graphBackground: a.paper,
+    graphBorder: a.black,
+    geom: c.vermillion,
+    geomBorder: a.black,
+    textPrimary: a.black,
+    textSecondary: a.secondary,
+    ruleLine: a.black,
+    gridLine: a.grid,
+    hoverAffordance: a.black,
+    hoverGuideFill: "rgba(20, 20, 20, 0.07)",
+    hoverGuideLine: a.black,
+    tooltipBackground: a.bubble,
+    tooltipBorder: a.black,
+    tooltipPrimaryRow: "rgba(255, 214, 10, 0.35)",
+    annotationShape: c.yellow,
+    annotationArrow: a.black,
+    differenceLabelBackground: a.bubble
+  },
+  defaults: [
+    e.graph({
+      fill: _e,
+      strokeWidth: 4,
+      cornerRadius: 0,
+      fontFamily: Te,
+      padding: 22,
+      shadow: We
+    }),
+    e.geom({
+      shadow: y,
+      overlay: Re
+    }),
+    e.geom({ shadow: y }, { state: "hovered" }),
+    e.geom.bar({
+      ...m,
+      strokeWidth: 2.5,
+      cornerRadius: 0
+    }),
+    e.geom.bar({
+      ...m,
+      strokeWidth: 2.5,
+      shadow: Oe
+    }, { state: "hovered" }),
+    e.geom.line({
+      strokeWidth: 3.5,
+      ...H,
+      shadow: S,
+      overlay: "none"
+    }),
+    e.geom.line({ shadow: S }, { state: "hovered" }),
+    e.geom.area({
+      ...m,
+      fillAlpha: 1,
+      strokeWidth: 2.5,
+      ...H
+    }),
+    e.geom.point({
+      ...m,
+      size: 13,
+      strokeWidth: 2,
+      shadow: S
+    }),
+    e.geom.point({
+      ...m,
+      strokeWidth: 2,
+      shadow: "none"
+    }, { state: "hovered" }),
+    e.geom.tile({
+      ...m,
+      cornerRadius: 2,
+      strokeWidth: 1.5,
+      shadow: "none"
+    }),
+    e.geom.tile({
+      ...m,
+      strokeWidth: 3,
+      shadow: "none"
+    }, { state: "hovered" }),
+    e.geom.rule({
+      strokeWidth: 2.5,
+      dashArray: [3, 3],
+      lineCap: "round",
+      shadow: "none"
+    }),
+    e.geom.rule.label({
+      ...E,
+      textColor: c.yellow,
+      fontSize: 15
+    }),
+    e.gridLine({ dashArray: [1, 5] }),
+    e.gridLine.x({ strokeWidth: 0 }),
+    e.gridLine.y({ strokeWidth: 1.5 }),
+    e.panelBorder({ strokeWidth: 0 }),
+    e.panelBorder.bottom({
+      stroke: a.black,
+      strokeWidth: 3,
+      dashArray: []
+    }),
+    e.tickLine({ strokeWidth: 0 }),
+    e.tickLabel({
+      ...w,
+      fontSize: 14,
+      lineHeight: 1
+    }),
+    e.axisLabel({
+      ...v,
+      ...E,
+      fontSize: 18,
+      lineHeight: 1
+    }),
+    e.heading({ ...v }),
+    e.heading.h1({
+      fontFamily: T,
+      fontWeight: 400,
+      fontSize: 36,
+      lineHeight: 1,
+      letterSpacing: 1,
+      textTransform: "uppercase",
+      textShadow: Ee
+    }),
+    e.heading.h2({
+      ...w,
+      fontSize: 16,
+      lineHeight: 1.2
+    }),
+    e.header({ margin: { bottom: 18 } }),
+    e.caption({
+      ...w,
+      fontWeight: 400,
+      fontSize: 13
+    }),
+    e.source({
+      ...w,
+      fontWeight: 400,
+      fontSize: 13
+    }),
+    e.dataLabel({
+      ...v,
+      fontSize: 14,
+      fill: "transparent"
+    }),
+    e.legendItem({
+      ...v,
+      ...E,
+      fontSize: 18,
+      fill: "transparent",
+      stroke: "transparent"
+    }),
+    e.legendItem.swatch({ size: 16 }),
+    e.directLabel({
+      fontWeight: 700,
+      fontSize: 14
+    }),
+    e.tooltip({
+      strokeWidth: 2.5,
+      cornerRadius: 10,
+      paddingInline: 12,
+      paddingBlock: 9,
+      shadow: P
+    }),
+    e.tooltip.heading({
+      ...v,
+      fontSize: 15,
+      lineHeight: 1.3
+    }),
+    e.tooltip.label({
+      ...w,
+      fontSize: 14,
+      lineHeight: 1.3
+    }),
+    e.tooltip.value({
+      ...v,
+      fontSize: 14,
+      lineHeight: 1.3
+    }),
+    e.legend.popover({
+      strokeWidth: 2.5,
+      cornerRadius: 10,
+      shadow: P
+    }),
+    e.annotation.text({
+      ...Ce,
+      ...U
+    }),
+    e.annotation.shape({
+      fillAlpha: 0.35,
+      stroke: a.black,
+      strokeWidth: 2
+    }),
+    e.annotation.arrow({
+      strokeWidth: 3.5,
+      dashArray: []
+    }),
+    e.annotation.arrow.outline({
+      stroke: a.paper,
+      strokeWidth: 2
+    }),
+    e.annotation.pinnedNumber({
+      stroke: a.black,
+      shadow: S
+    }),
+    e.annotation.pinnedNumber.label({
+      ...O,
+      ...W
+    }),
+    e.annotation.comment({
+      stroke: a.black,
+      shadow: S
+    }),
+    e.annotation.comment.label({
+      ...O,
+      ...W
+    }),
+    e.annotation.differenceArrow({
+      stroke: a.black,
+      strokeWidth: 2.5
+    }),
+    e.annotation.differenceArrow.label({
+      ...O,
+      ...W,
+      fontSize: 18
+    }),
+    e.panelBorder.bottom({ strokeWidth: 0 }, { coord: "polar" }),
+    e.tickLabel({
+      ...v,
+      textOutlineColor: a.paper,
+      textOutlineWidth: 3.5
+    }, { coord: "polar" }),
+    e.geom.area({
+      fillAlpha: 0.5,
+      shadow: "none"
+    }, { coord: "polar" }),
+    e.geom.area({ shadow: "none" }, {
+      coord: "polar",
+      state: "hovered"
+    }),
+    e.geom.bar({
+      strokeWidth: 2.5,
+      shadow: y
+    }, { coord: "polar" }),
+    e.geom.bar({ strokeWidth: 2.5 }, {
+      coord: "polar",
+      state: "hovered"
+    })
+  ]
+}, Fe = {
+  name: "comic",
+  styles: xe,
+  palette: Ae,
+  colormap: ye,
+  colorScheme: "light",
+  plugins: ve
+};
+export {
+  Fe as comic
+};

package/dist/renderer/burst.d.ts

@@ -0,0 +1,24 @@
+import { XYPoint } from '@graphysdk/react';
+/** A point of the burst's edge in polar terms: the angle clockwise from twelve o'clock, and the radius as a share of the circle's. */
+export interface BurstCorner {
+    angle: number;
+    radius: number;
+}
+/**
+ * The burst's edge from `startAngle` to `endAngle`, clockwise: where it crosses the two angles, and
+ * every corner between. A slice of a pie drawn as a burst is its sector cut to this edge, so the
+ * slices of one pie tile the burst exactly, and each keeps its angle. Since the edge repeats every
+ * two spikes, a slice's share of the burst's area is its share of the turn to within one spike.
+ */
+export declare const traceBurstEdge: (startAngle: number, endAngle: number) => BurstCorner[];
+/** A polar point in the panel's pixels, about `centre`, for a circle of `radius` pixels. */
+export declare const toPanelPoint: (centre: XYPoint, radius: number, corner: BurstCorner) => XYPoint;
+/**
+ * One slice of a pie or a donut as a burst, in the panel's pixels: its sector, from `startAngle` to
+ * `endAngle`, cut to the burst's jagged edge outside and to the hole's circle inside. `radius` is the
+ * burst's in pixels, and `holeRadius` the hole's, 0 for a pie. A slice that is the whole turn is the
+ * whole burst, its hole cut out against the turn.
+ */
+export declare const buildBurstSlice: (centre: XYPoint, radius: number, holeRadius: number, startAngle: number, endAngle: number) => string;
+/** A point as a little burst of `size` pixels across, centred exactly on `centre`, with a tip at twelve o'clock. */
+export declare const buildPointBurst: (centre: XYPoint, size: number) => string;

package/dist/renderer/paint.d.ts

@@ -0,0 +1,18 @@
+import { Observation, SceneLayerFor, StyleState } from '@graphysdk/react';
+/** The hard black copy a comic prints under a shape, offset down and to the right; `null` when there is none. */
+export interface PrintedShadow {
+    offsetX: number;
+    offsetY: number;
+    color: string;
+}
+/** What a shape is inked with: flat colour inside a black outline, over a printed shadow. */
+export interface ShapePaint {
+    color: string;
+    opacity: number;
+    fillOpacity: number;
+    outline: string;
+    outlineWidth: number;
+    shadow: PrintedShadow | null;
+}
+export type ReadShapePaint = (observation: Observation, state?: StyleState) => ShapePaint;
+export declare const useShapePaint: (layer: SceneLayerFor<"bar" | "point">) => ReadShapePaint;

package/dist/renderer/plugins.d.ts

@@ -0,0 +1,8 @@
+import { ResolvedGeomRenderer } from '@graphysdk/react';
+/**
+ * The built-in geoms the theme redraws as bursts: pies, donuts and points. Bars, lines, areas and
+ * tiles are drawn by the built-in renderers, which the stylesheet already inks as a comic prints them.
+ * Positions, scales and axes come from the compiled layer unchanged, and colour, outline and shadow
+ * come from the stylesheet.
+ */
+export declare const comicPlugins: readonly ResolvedGeomRenderer[];

package/dist/renderer/point.d.ts

@@ -0,0 +1,8 @@
+import { ResolvedGeomRenderer } from '@graphysdk/react';
+/**
+ * Scatter and bubble: each point a little burst in its group's colour, as a comic marks a hit, with
+ * its centre exactly on the reading, outlined in black over a hard shadow. The hovered burst grows.
+ */
+export declare const comicPoint: ResolvedGeomRenderer;
+/** A radar's vertices as the same bursts. */
+export declare const comicRadarPoint: ResolvedGeomRenderer;

package/dist/renderer/slice.d.ts

@@ -0,0 +1,6 @@
+import { ResolvedGeomRenderer } from '@graphysdk/react';
+/**
+ * Pie, donut, rose and radial bar as plain sectors, each outlined in black over the one hard shadow of
+ * the whole shape, so every slice's size is exactly its share. The hovered slice is outlined more heavily.
+ */
+export declare const comicSlice: ResolvedGeomRenderer;

package/dist/renderer/utils/projections.d.ts

@@ -0,0 +1,9 @@
+import { Observation, XYPoint } from '@graphysdk/react';
+export interface PixelSize {
+    width: number;
+    height: number;
+}
+/** Where an observation is drawn in the panel, in pixels; `null` for one missing a position. */
+export type Projection = (observation: Observation, panel: PixelSize) => XYPoint | null;
+export declare const projectCartesian: Projection;
+export declare const projectPolar: Projection;

package/dist/styles.d.ts

@@ -0,0 +1,33 @@
+import { Stylesheet } from '@graphysdk/react';
+export declare const COMIC_COLORS: {
+    readonly paper: "#FBF3DF";
+    readonly bubble: "#FFFDF6";
+    readonly black: "#141414";
+    readonly secondary: "#4A4338";
+    readonly grid: "rgba(20, 20, 20, 0.2)";
+};
+/**
+ * The colours a four-colour press gives on newsprint: the red is a vermillion of magenta over yellow,
+ * the blue leans to the cyan it is printed with, and magenta stands on its own.
+ */
+export declare const COMIC_HUES: {
+    readonly vermillion: "#D9401F";
+    readonly cyan: "#0B85C8";
+    readonly yellow: "#FFD60A";
+    readonly magenta: "#D6247A";
+    readonly green: "#15964B";
+    readonly purple: "#7A3DC8";
+};
+/**
+ * The order groups take their colours in. Yellow is too pale to be told from the paper by itself, so
+ * it comes third and relies on the black outline and shadow every shape has.
+ */
+export declare const COMIC_PALETTE: readonly string[];
+/** For a colour that stands for a number: from yellow through orange to a deep red. */
+export declare const COMIC_COLORMAP: readonly string[];
+/**
+ * The comic look: newsprint framed in black like a panel, shapes in flat colour under printed dots
+ * with a black outline and a hard black shadow, thick round lines, a black baseline, and boxes
+ * drawn as speech bubbles.
+ */
+export declare const comicStyles: Stylesheet;

package/fonts.css

@@ -0,0 +1,2 @@
+/* Bangers for the title and Comic Neue for the rest, the faces the theme's stylesheet names. Import this once, before the first graph is measured. */
+@import url('https://fonts.googleapis.com/css2?family=Bangers&family=Comic+Neue:wght@400;700&display=swap');

package/licenses/PolyForm-Free-Trial-1.0.0.md

@@ -0,0 +1,93 @@
+# PolyForm Free Trial License 1.0.0
+
+<https://polyformproject.org/licenses/free-trial/1.0.0>
+
+## Acceptance
+
+In order to get any license under these terms, you must agree
+to them as both strict obligations and conditions to all
+your licenses.
+
+## Copyright License
+
+The licensor grants you a copyright license for the software
+to do everything you might do with the software that would
+otherwise infringe the licensor's copyright in it for any
+permitted purpose. However, you may only make changes or
+new works based on the software according to [Changes and New
+Works License](#changes-and-new-works-license), and you may
+not distribute copies of the software.
+
+## Changes and New Works License
+
+The licensor grants you an additional copyright license to
+make changes and new works based on the software for any
+permitted purpose.
+
+## Patent License
+
+The licensor grants you a patent license for the software that
+covers patent claims the licensor can license, or becomes able
+to license, that you would infringe by using the software.
+
+## Fair Use
+
+You may have "fair use" rights for the software under the
+law. These terms do not limit them.
+
+## Free Trial
+
+Use to evaluate whether the software suits a particular
+application for less than 32 consecutive calendar days, on
+behalf of you or your company, is use for a permitted purpose.
+
+## No Other Rights
+
+These terms do not allow you to sublicense or transfer any of
+your licenses to anyone else, or prevent the licensor from
+granting licenses to anyone else. These terms do not imply
+any other licenses.
+
+## Patent Defense
+
+If you make any written claim that the software infringes or
+contributes to infringement of any patent, your patent license
+for the software granted under these terms ends immediately. If
+your company makes such a claim, your patent license ends
+immediately for work on behalf of your company.
+
+## Violations
+
+If you violate any of these terms, or do anything with the
+software not covered by your licenses, all your licenses
+end immediately.
+
+## No Liability
+
+_**As far as the law allows, the software comes as is, without
+any warranty or condition, and the licensor will not be liable
+to you for any damages arising out of these terms or the use
+or nature of the software, under any kind of legal claim.**_
+
+## Definitions
+
+The **licensor** is the individual or entity offering these
+terms, and the **software** is the software the licensor makes
+available under these terms.
+
+**You** refers to the individual or entity agreeing to these
+terms.
+
+**Your company** is any legal entity, sole proprietorship,
+or other kind of organization that you work for, plus all
+organizations that have control over, are under the control of,
+or are under common control with that organization. **Control**
+means ownership of substantially all the assets of an entity,
+or the power to direct its management and policies by vote,
+contract, or otherwise. Control can be direct or indirect.
+
+**Your licenses** are all the licenses granted to you for the
+software under these terms.
+
+**Use** means anything you do with the software requiring one
+of your licenses.

package/licenses/PolyForm-NonCommercial-1.0.0.md

@@ -0,0 +1,131 @@
+# PolyForm Noncommercial License 1.0.0
+
+<https://polyformproject.org/licenses/noncommercial/1.0.0>
+
+## Acceptance
+
+In order to get any license under these terms, you must agree
+to them as both strict obligations and conditions to all
+your licenses.
+
+## Copyright License
+
+The licensor grants you a copyright license for the
+software to do everything you might do with the software
+that would otherwise infringe the licensor's copyright
+in it for any permitted purpose. However, you may
+only distribute the software according to [Distribution
+License](#distribution-license) and make changes or new works
+based on the software according to [Changes and New Works
+License](#changes-and-new-works-license).
+
+## Distribution License
+
+The licensor grants you an additional copyright license
+to distribute copies of the software. Your license
+to distribute covers distributing the software with
+changes and new works permitted by [Changes and New Works
+License](#changes-and-new-works-license).
+
+## Notices
+
+You must ensure that anyone who gets a copy of any part of
+the software from you also gets a copy of these terms or the
+URL for them above, as well as copies of any plain-text lines
+beginning with `Required Notice:` that the licensor provided
+with the software. For example:
+
+> Required Notice: Copyright Graphy Technologies Ltd. (https://graphy.dev)
+
+## Changes and New Works License
+
+The licensor grants you an additional copyright license to
+make changes and new works based on the software for any
+permitted purpose.
+
+## Patent License
+
+The licensor grants you a patent license for the software that
+covers patent claims the licensor can license, or becomes able
+to license, that you would infringe by using the software.
+
+## Noncommercial Purposes
+
+Any noncommercial purpose is a permitted purpose.
+
+## Personal Uses
+
+Personal use for research, experiment, and testing for
+the benefit of public knowledge, personal study, private
+entertainment, hobby projects, amateur pursuits, or religious
+observance, without any anticipated commercial application,
+is use for a permitted purpose.
+
+## Noncommercial Organizations
+
+Use by any charitable organization, educational institution,
+public research organization, public safety or health
+organization, environmental protection organization,
+or government institution is use for a permitted purpose
+regardless of the source of funding or obligations resulting
+from the funding.
+
+## Fair Use
+
+You may have "fair use" rights for the software under the
+law. These terms do not limit them.
+
+## No Other Rights
+
+These terms do not allow you to sublicense or transfer any of
+your licenses to anyone else, or prevent the licensor from
+granting licenses to anyone else. These terms do not imply
+any other licenses.
+
+## Patent Defense
+
+If you make any written claim that the software infringes or
+contributes to infringement of any patent, your patent license
+for the software granted under these terms ends immediately. If
+your company makes such a claim, your patent license ends
+immediately for work on behalf of your company.
+
+## Violations
+
+The first time you are notified in writing that you have
+violated any of these terms, or done anything with the software
+not covered by your licenses, your licenses can nonetheless
+continue if you come into full compliance with these terms,
+and take practical steps to correct past violations, within
+32 days of receiving notice. Otherwise, all your licenses
+end immediately.
+
+## No Liability
+
+_**As far as the law allows, the software comes as is, without
+any warranty or condition, and the licensor will not be liable
+to you for any damages arising out of these terms or the use
+or nature of the software, under any kind of legal claim.**_
+
+## Definitions
+
+The **licensor** is the individual or entity offering these
+terms, and the **software** is the software the licensor makes
+available under these terms.
+
+**You** refers to the individual or entity agreeing to these
+terms.
+
+**Your company** is any legal entity, sole proprietorship,
+or other kind of organization that you work for, plus all
+organizations that have control over, are under the control of,
+or are under common control with that organization. **Control**
+means ownership of substantially all the assets of an entity,
+or the power to direct its management and policies by vote,
+contract, or otherwise. Control can be direct or indirect.
+
+**Your licenses** are all the licenses granted to you for the
+software under these terms.
+
+**Use** means anything you do with the software requiring one
+of your licenses.

package/licenses/PolyForm-Small-Business-1.0.0.md

@@ -0,0 +1,121 @@
+# PolyForm Small Business License 1.0.0
+
+<https://polyformproject.org/licenses/small-business/1.0.0>
+
+## Acceptance
+
+In order to get any license under these terms, you must agree
+to them as both strict obligations and conditions to all
+your licenses.
+
+## Copyright License
+
+The licensor grants you a copyright license for the
+software to do everything you might do with the software
+that would otherwise infringe the licensor's copyright
+in it for any permitted purpose. However, you may
+only distribute the software according to [Distribution
+License](#distribution-license) and make changes or new works
+based on the software according to [Changes and New Works
+License](#changes-and-new-works-license).
+
+## Distribution License
+
+The licensor grants you an additional copyright license
+to distribute copies of the software. Your license
+to distribute covers distributing the software with
+changes and new works permitted by [Changes and New Works
+License](#changes-and-new-works-license).
+
+## Notices
+
+You must ensure that anyone who gets a copy of any part of
+the software from you also gets a copy of these terms or the
+URL for them above, as well as copies of any plain-text lines
+beginning with `Required Notice:` that the licensor provided
+with the software. For example:
+
+> Required Notice: Copyright Graphy Technologies Ltd. (https://graphy.dev)
+
+## Changes and New Works License
+
+The licensor grants you an additional copyright license to
+make changes and new works based on the software for any
+permitted purpose.
+
+## Patent License
+
+The licensor grants you a patent license for the software that
+covers patent claims the licensor can license, or becomes able
+to license, that you would infringe by using the software.
+
+## Fair Use
+
+You may have "fair use" rights for the software under the
+law. These terms do not limit them.
+
+## Small Business
+
+Use of the software for the benefit of your company is use for
+a permitted purpose if your company has fewer than 100 total
+individuals working as employees and independent contractors,
+and less than 1,000,000 USD (2019) total revenue in the prior
+tax year. Adjust this revenue threshold for inflation according
+to the United States Bureau of Labor Statistics' consumer price
+index for all urban consumers, U.S. city average, for all items,
+not seasonally adjusted, with 1982–1984=100 reference base.
+
+## No Other Rights
+
+These terms do not allow you to sublicense or transfer any of
+your licenses to anyone else, or prevent the licensor from
+granting licenses to anyone else. These terms do not imply
+any other licenses.
+
+## Patent Defense
+
+If you make any written claim that the software infringes or
+contributes to infringement of any patent, your patent license
+for the software granted under these terms ends immediately. If
+your company makes such a claim, your patent license ends
+immediately for work on behalf of your company.
+
+## Violations
+
+The first time you are notified in writing that you have
+violated any of these terms, or done anything with the software
+not covered by your licenses, your licenses can nonetheless
+continue if you come into full compliance with these terms,
+and take practical steps to correct past violations, within
+32 days of receiving notice. Otherwise, all your licenses
+end immediately.
+
+## No Liability
+
+_**As far as the law allows, the software comes as is, without
+any warranty or condition, and the licensor will not be liable
+to you for any damages arising out of these terms or the use
+or nature of the software, under any kind of legal claim.**_
+
+## Definitions
+
+The **licensor** is the individual or entity offering these
+terms, and the **software** is the software the licensor makes
+available under these terms.
+
+**You** refers to the individual or entity agreeing to these
+terms.
+
+**Your company** is any legal entity, sole proprietorship,
+or other kind of organization that you work for, plus all
+organizations that have control over, are under the control of,
+or are under common control with that organization. **Control**
+means ownership of substantially all the assets of an entity,
+or the power to direct its management and policies by vote,
+contract, or otherwise. Control can be direct or indirect.
+
+**Your licenses** are all the licenses granted to you for the
+software under these terms.
+
+**Use** means anything you do with the software requiring one
+of your licenses.

package/package.json

@@ -1,6 +1,82 @@
 {
   "name": "@graphysdk/theme-comic",
-  "version": "0.0.0-stage",
-  "stub": true,
-  "description": "Temporary package placeholder for staged publishing"
+  "author": "Graphy",
+  "description": "Comic theme for the Graphy charting SDK (beta)",
+  "homepage": "https://docs.graphy.dev/sdk-next/themes/comic",
+  "license": "SEE LICENSE IN LICENSE.md",
+  "keywords": [
+    "graphy",
+    "chart",
+    "react",
+    "visualization",
+    "grammar-of-graphics",
+    "theme",
+    "comic"
+  ],
+  "version": "0.1.0",
+  "type": "module",
+  "sideEffects": [
+    "*.css"
+  ],
+  "types": "./dist/index.d.ts",
+  "files": [
+    "dist",
+    "fonts.css",
+    "src/fonts.css.d.ts",
+    "LICENSE.md",
+    "licenses",
+    "README.md"
+  ],
+  "exports": {
+    ".": {
+      "types": "./dist/index.d.ts",
+      "import": "./dist/index.mjs",
+      "require": "./dist/index.cjs"
+    },
+    "./fonts.css": {
+      "types": "./src/fonts.css.d.ts",
+      "default": "./fonts.css"
+    }
+  },
+  "peerDependencies": {
+    "react": "^19.0.0",
+    "@graphysdk/react": "^1.9.0-beta.1791447671234"
+  },
+  "devDependencies": {
+    "@testing-library/react": "^16.3.1",
+    "@types/react": "^19.2.14",
+    "@types/react-dom": "^19.2.3",
+    "react": "^19.2.4",
+    "react-dom": "^19.2.4",
+    "rollup-plugin-node-externals": "^8.1.1",
+    "vite": "^8.1.5",
+    "vite-plugin-dts": "^4.5.4",
+    "vitest": "^4.1.11",
+    "@graphysdk/react": "1.9.0-beta.1791447671234",
+    "@graphysdk/viz-engine": "1.8.0",
+    "@graphytools/eslint-config": "0.0.1",
+    "@graphytools/typescript-config": "0.0.1",
+    "@graphytools/vitest-config": "1.0.0"
+  },
+  "publishConfig": {
+    "access": "public"
+  },
+  "lint-staged": {
+    "*.{ts,tsx,js,jsx,json,css,md}": [
+      "prettier --write"
+    ],
+    "*.{ts,tsx}": [
+      "eslint --max-warnings=0 --fix"
+    ]
+  },
+  "scripts": {
+    "build": "vite build",
+    "test": "vitest run",
+    "test:watch": "TZ=utc vitest",
+    "lint": "eslint . --max-warnings 0",
+    "lint:fix": "eslint . --fix",
+    "format": "prettier --write .",
+    "format:check": "prettier --check .",
+    "typecheck": "tsc --noEmit"
+  }
 }

package/src/fonts.css.d.ts

@@ -0,0 +1,2 @@
+// Loads the fonts when imported; it exports nothing.
+export {};