@techfides/ui-library-design 0.3.1 → 0.7.0

package/dist/recipes/sky.js.map

@@ -1 +1 @@
-{"version":3,"file":"sky.js","names":[],"sources":["../../src/recipes/sky.ts"],"sourcesContent":["import { cva } from 'class-variance-authority'\n\nconst DIM = 1\nconst MID = 2\nconst BRIGHT = 3\n\nconst FAINT = 28\nconst DUSKY = 40\nconst STEADY = 55\nconst CLEAR = 70\nconst KEEN = 95\n\nconst STAR_PX = [DIM, DIM, MID, MID, BRIGHT] as const\nconst STAR_GLOW = [FAINT, DUSKY, STEADY, CLEAR, KEEN] as const\n\nconst SEED_BASE = 7\nconst SEED_STEP = 131\nconst LEHMER_MULTIPLIER = 16_807\nconst LEHMER_MODULUS = 2_147_483_647\n\nconst FIRST = 0\nconst ORIGIN = 0\nconst ONE = 1\nconst EDGE = 4\nconst FIELD = 92\nconst CLOUD_SHIFT = 26\nconst HALF = 0.5\n\nconst LAYERS = 4\n\nconst HALO_AT = CLEAR\n\nconst HALO_SCALE = 5\n\nconst HALO_GLOW = 7\n\nconst CORE_EDGE = 99\n\ninterface Speck {\n  across: number\n  down: number\n  glow: number\n  px: number\n}\n\ninterface StarLayer {\n  delay: string\n  image: string\n  position: string\n  size: string\n}\n\ninterface Cloud {\n  delay: string\n  shift: string\n}\n\nconst skyRecipe = cva([\n  'relative isolate overflow-hidden',\n  'rounded-tf-card bg-tf-bg',\n  'font-tf-body text-tf-fg',\n])\n\nconst driftRecipe = cva([\n  'pointer-events-none absolute -inset-1/4',\n  '[rotate:var(--tf-sweep)] tf-turning',\n  '[animation-duration:calc(var(--tf-sweep-duration)*45)]',\n])\n\nconst starRecipe = cva('pointer-events-none absolute inset-0 tf-twinkling bg-no-repeat')\n\nconst contentRecipe = cva('relative')\n\nconst hashOf = (seed: string): number => {\n  let value = SEED_BASE\n\n  for (const letter of seed) {\n    value = (value * SEED_STEP + (letter.codePointAt(FIRST) ?? ORIGIN)) % LEHMER_MODULUS\n  }\n  return value + ONE\n}\n\nconst streamFrom = (seed: string): (() => number) => {\n  let state = hashOf(seed)\n\n  return () => {\n    state = (state * LEHMER_MULTIPLIER) % LEHMER_MODULUS\n    return state / LEHMER_MODULUS\n  }\n}\n\nconst pick = <Value>(choices: readonly Value[], roll: number, fallback: Value): Value =>\n  choices[Math.floor(roll * choices.length)] ?? fallback\n\nconst glowOf = (strength: number): string =>\n  `color-mix(in oklab, var(--color-tf-fg) ${String(strength)}%, transparent)`\n\nconst circleOf = (strength: number): string => {\n  const ink = glowOf(strength)\n\n  return `radial-gradient(circle closest-side, ${ink} 0, ${ink} ${String(CORE_EDGE)}%, transparent 100%)`\n}\n\nconst haloOf = (strength: number): string => {\n  const ink = glowOf(strength)\n\n  return `radial-gradient(circle closest-side, ${ink} 0, transparent 100%)`\n}\n\nconst speckFrom = (roll: () => number): Speck => {\n  const step = roll()\n\n  return {\n    across: EDGE + roll() * FIELD,\n    down: EDGE + roll() * FIELD,\n    glow: pick(STAR_GLOW, step, FAINT),\n    px: pick(STAR_PX, step, DIM),\n  }\n}\n\nconst spotOf = (speck: Speck): string => `${String(speck.across)}% ${String(speck.down)}%`\n\nconst sizeOf = (across: number): string => `${String(across)}px ${String(across)}px`\n\ninterface Drawing {\n  images: string[]\n  positions: string[]\n  sizes: string[]\n}\n\nconst draw = (sheet: Drawing, speck: Speck): void => {\n  if (speck.glow >= HALO_AT) {\n    sheet.images.push(haloOf(HALO_GLOW))\n    sheet.positions.push(spotOf(speck))\n    sheet.sizes.push(sizeOf(speck.px * HALO_SCALE))\n  }\n  sheet.images.push(circleOf(speck.glow))\n  sheet.positions.push(spotOf(speck))\n  sheet.sizes.push(sizeOf(speck.px))\n}\n\nconst starLayers = (count: number, seed: string): StarLayer[] => {\n  const roll = streamFrom(seed)\n  const sheets: Drawing[] = Array.from({ length: LAYERS }, () => ({\n    images: [],\n    positions: [],\n    sizes: [],\n  }))\n\n  for (let drawn = ORIGIN; drawn < count; drawn += ONE) {\n    const speck = speckFrom(roll)\n    const sheet = sheets[Math.floor(roll() * LAYERS)] ?? sheets[FIRST]\n\n    if (sheet) {\n      draw(sheet, speck)\n    }\n  }\n  return sheets.map((sheet, index) => ({\n    delay: `calc(var(--tf-twinkle-duration) * -${String(index / LAYERS)})`,\n    image: sheet.images.join(', '),\n    position: sheet.positions.join(', '),\n    size: sheet.sizes.join(', '),\n  }))\n}\n\nconst cloudDrift = (seed: string): Cloud => {\n  const roll = streamFrom(`cloud:${seed}`)\n  const turn = roll()\n  const across = (roll() - HALF) * CLOUD_SHIFT\n  const down = (roll() - HALF) * CLOUD_SHIFT\n\n  return {\n    delay: `calc(var(--tf-sweep-duration) * -${String(turn)})`,\n    shift: `${String(across)}% ${String(down)}%`,\n  }\n}\n\nexport {\n  type Cloud,\n  type StarLayer,\n  cloudDrift,\n  contentRecipe,\n  driftRecipe,\n  skyRecipe,\n  starLayers,\n  starRecipe,\n}\n"],"mappings":"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"}
+{"version":3,"file":"sky.js","names":[],"sources":["../../src/recipes/sky.ts"],"sourcesContent":["import { cva } from 'class-variance-authority'\n\nimport { anatomy } from '#anatomy'\n\nimport { nebulaRecipe } from './nebula'\n\nconst DIM = 1\nconst MID = 2\nconst BRIGHT = 3\n\nconst FAINT = 28\nconst DUSKY = 40\nconst STEADY = 55\nconst CLEAR = 70\nconst KEEN = 95\n\nconst STAR_PX = [DIM, DIM, MID, MID, BRIGHT] as const\nconst STAR_GLOW = [FAINT, DUSKY, STEADY, CLEAR, KEEN] as const\n\nconst SEED_BASE = 7\nconst SEED_STEP = 131\nconst LEHMER_MULTIPLIER = 16_807\nconst LEHMER_MODULUS = 2_147_483_647\n\nconst FIRST = 0\nconst ORIGIN = 0\nconst ONE = 1\nconst EDGE = 4\nconst FIELD = 92\nconst CLOUD_SHIFT = 26\nconst HALF = 0.5\n\nconst LAYERS = 4\n\nconst HALO_AT = CLEAR\n\nconst HALO_SCALE = 5\n\nconst HALO_GLOW = 7\n\nconst CORE_EDGE = 99\n\ninterface Speck {\n  across: number\n  down: number\n  glow: number\n  px: number\n}\n\ninterface StarLayer {\n  delay: string\n  image: string\n  position: string\n  size: string\n}\n\ninterface Cloud {\n  delay: string\n  shift: string\n}\n\nconst skyRecipe = cva([\n  'relative isolate overflow-hidden',\n  'rounded-tf-card bg-tf-bg',\n  'font-tf-body text-tf-fg',\n])\n\nconst driftRecipe = cva([\n  'pointer-events-none absolute -inset-1/4',\n  '[rotate:var(--tf-sweep)] tf-turning',\n  '[animation-duration:calc(var(--tf-sweep-duration)*45)]',\n])\n\nconst starRecipe = cva('pointer-events-none absolute inset-0 tf-twinkling bg-no-repeat')\n\nconst contentRecipe = cva('relative')\n\nconst hashOf = (seed: string): number => {\n  let value = SEED_BASE\n\n  for (const letter of seed) {\n    value = (value * SEED_STEP + (letter.codePointAt(FIRST) ?? ORIGIN)) % LEHMER_MODULUS\n  }\n  return value + ONE\n}\n\nconst streamFrom = (seed: string): (() => number) => {\n  let state = hashOf(seed)\n\n  return () => {\n    state = (state * LEHMER_MULTIPLIER) % LEHMER_MODULUS\n    return state / LEHMER_MODULUS\n  }\n}\n\nconst pick = <Value>(choices: readonly Value[], roll: number, fallback: Value): Value =>\n  choices[Math.floor(roll * choices.length)] ?? fallback\n\nconst glowOf = (strength: number): string =>\n  `color-mix(in oklab, var(--color-tf-fg) ${String(strength)}%, transparent)`\n\nconst circleOf = (strength: number): string => {\n  const ink = glowOf(strength)\n\n  return `radial-gradient(circle closest-side, ${ink} 0, ${ink} ${String(CORE_EDGE)}%, transparent 100%)`\n}\n\nconst haloOf = (strength: number): string => {\n  const ink = glowOf(strength)\n\n  return `radial-gradient(circle closest-side, ${ink} 0, transparent 100%)`\n}\n\nconst speckFrom = (roll: () => number): Speck => {\n  const step = roll()\n\n  return {\n    across: EDGE + roll() * FIELD,\n    down: EDGE + roll() * FIELD,\n    glow: pick(STAR_GLOW, step, FAINT),\n    px: pick(STAR_PX, step, DIM),\n  }\n}\n\nconst spotOf = (speck: Speck): string => `${String(speck.across)}% ${String(speck.down)}%`\n\nconst sizeOf = (across: number): string => `${String(across)}px ${String(across)}px`\n\ninterface Drawing {\n  images: string[]\n  positions: string[]\n  sizes: string[]\n}\n\nconst draw = (sheet: Drawing, speck: Speck): void => {\n  if (speck.glow >= HALO_AT) {\n    sheet.images.push(haloOf(HALO_GLOW))\n    sheet.positions.push(spotOf(speck))\n    sheet.sizes.push(sizeOf(speck.px * HALO_SCALE))\n  }\n  sheet.images.push(circleOf(speck.glow))\n  sheet.positions.push(spotOf(speck))\n  sheet.sizes.push(sizeOf(speck.px))\n}\n\nconst starLayers = (count: number, seed: string): StarLayer[] => {\n  const roll = streamFrom(seed)\n  const sheets: Drawing[] = Array.from({ length: LAYERS }, () => ({\n    images: [],\n    positions: [],\n    sizes: [],\n  }))\n\n  for (let drawn = ORIGIN; drawn < count; drawn += ONE) {\n    const speck = speckFrom(roll)\n    const sheet = sheets[Math.floor(roll() * LAYERS)] ?? sheets[FIRST]\n\n    if (sheet) {\n      draw(sheet, speck)\n    }\n  }\n  return sheets.map((sheet, index) => ({\n    delay: `calc(var(--tf-twinkle-duration) * -${String(index / LAYERS)})`,\n    image: sheet.images.join(', '),\n    position: sheet.positions.join(', '),\n    size: sheet.sizes.join(', '),\n  }))\n}\n\nconst cloudDrift = (seed: string): Cloud => {\n  const roll = streamFrom(`cloud:${seed}`)\n  const turn = roll()\n  const across = (roll() - HALF) * CLOUD_SHIFT\n  const down = (roll() - HALF) * CLOUD_SHIFT\n\n  return {\n    delay: `calc(var(--tf-sweep-duration) * -${String(turn)})`,\n    shift: `${String(across)}% ${String(down)}%`,\n  }\n}\n\nconst skyAnatomy = anatomy({\n  content: { part: 'content', recipe: contentRecipe, required: true },\n  nebula: { part: 'nebula', recipe: nebulaRecipe, required: true },\n  root: { part: 'sky', recipe: skyRecipe, required: true },\n  star: { part: 'star', recipe: starRecipe, required: true },\n  stars: { part: 'stars', recipe: driftRecipe, required: true },\n})\n\nexport {\n  type Cloud,\n  type StarLayer,\n  cloudDrift,\n  contentRecipe,\n  driftRecipe,\n  skyAnatomy,\n  skyRecipe,\n  starLayers,\n  starRecipe,\n}\n"],"mappings":"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"}

package/dist/recipes/slider.d.ts

@@ -17,6 +17,20 @@ declare const sliderHintRecipe: (props?: ({
   invalid?: boolean | null | undefined;
 } & import("class-variance-authority/types").ClassProp) | undefined) => string;
 declare const sliderBoundsRecipe: (props?: import("class-variance-authority/types").ClassProp | undefined) => string;
+declare const sliderAnatomy: {
+  readonly bounds: {
+    readonly part: "bounds";
+    readonly recipe: (props?: import("class-variance-authority/types").ClassProp | undefined) => string;
+    readonly required: true;
+  };
+  readonly root: {
+    readonly part: "slider";
+    readonly recipe: (props?: ({
+      fullWidth?: boolean | null | undefined;
+    } & import("class-variance-authority/types").ClassProp) | undefined) => string;
+    readonly required: true;
+  };
+};
 //#endregion
-export { sliderBoundsRecipe, sliderControlRecipe, sliderFootRecipe, sliderHeadRecipe, sliderHintRecipe, sliderKnobSize, sliderLabelRecipe, sliderNotchRecipe, sliderNotchesRecipe, sliderRangeRecipe, sliderRecipe, sliderThumbRecipe, sliderTrackRecipe, sliderValueRecipe };
+export { sliderAnatomy, sliderBoundsRecipe, sliderControlRecipe, sliderFootRecipe, sliderHeadRecipe, sliderHintRecipe, sliderKnobSize, sliderLabelRecipe, sliderNotchRecipe, sliderNotchesRecipe, sliderRangeRecipe, sliderRecipe, sliderThumbRecipe, sliderTrackRecipe, sliderValueRecipe };
 //# sourceMappingURL=slider.d.ts.map

package/dist/recipes/slider.js

@@ -1,3 +1,4 @@
+import { anatomy } from "../anatomy.js";
 import { controlReach } from "../parts/control.js";
 import { markKnob } from "../parts/mark.js";
 import { cva } from "class-variance-authority";
@@ -62,7 +63,19 @@ const sliderHintRecipe = cva("text-tf-caption font-medium", {
 	} }
 });
 const sliderBoundsRecipe = cva("ms-auto shrink-0 text-tf-caption font-medium text-tf-muted tabular-nums");
+const sliderAnatomy = anatomy({
+	bounds: {
+		part: "bounds",
+		recipe: sliderBoundsRecipe,
+		required: true
+	},
+	root: {
+		part: "slider",
+		recipe: sliderRecipe,
+		required: true
+	}
+});
 //#endregion
-export { sliderBoundsRecipe, sliderControlRecipe, sliderFootRecipe, sliderHeadRecipe, sliderHintRecipe, sliderKnobSize, sliderLabelRecipe, sliderNotchRecipe, sliderNotchesRecipe, sliderRangeRecipe, sliderRecipe, sliderThumbRecipe, sliderTrackRecipe, sliderValueRecipe };
+export { sliderAnatomy, sliderBoundsRecipe, sliderControlRecipe, sliderFootRecipe, sliderHeadRecipe, sliderHintRecipe, sliderKnobSize, sliderLabelRecipe, sliderNotchRecipe, sliderNotchesRecipe, sliderRangeRecipe, sliderRecipe, sliderThumbRecipe, sliderTrackRecipe, sliderValueRecipe };
 
 //# sourceMappingURL=slider.js.map

package/dist/recipes/slider.js.map

@@ -1 +1 @@
-{"version":3,"file":"slider.js","names":[],"sources":["../../src/recipes/slider.ts"],"sourcesContent":["import { cva } from 'class-variance-authority'\n\nimport { controlReach } from '#parts/control'\nimport { markKnob } from '#parts/mark'\n\nconst sliderKnobSize = 20\n\nconst sliderRecipe = cva(\n  [\n    'flex w-full flex-col gap-2',\n    'font-tf-body',\n    'data-disabled:cursor-not-allowed',\n    'data-disabled:**:data-[part=value-text]:text-tf-muted',\n  ],\n  {\n    defaultVariants: { fullWidth: false },\n    variants: {\n      fullWidth: { false: 'max-w-tf-panel', true: '' },\n    },\n  },\n)\n\nconst sliderHeadRecipe = cva('flex items-baseline justify-between gap-4')\n\nconst sliderLabelRecipe = cva('text-tf-body text-tf-fg data-disabled:text-tf-muted')\n\nconst sliderValueRecipe = cva([\n  'font-tf-display text-tf-h4 font-bold tracking-tf-tight tabular-nums',\n  'text-tf-fg in-data-dragging:text-tf-accent-hi in-data-focus:text-tf-accent-hi',\n  'tf-transition motion-reduce:transition-none',\n])\n\nconst sliderControlRecipe = cva([\n  'relative flex min-h-tf-target w-full items-center',\n  'not-data-readonly:interactive:cursor-pointer',\n  'data-readonly:cursor-default',\n])\n\nconst sliderTrackRecipe = cva([\n  'h-tf-mark-track w-full overflow-hidden rounded-tf-inline bg-tf-line',\n  'data-disabled:opacity-50',\n])\n\nconst sliderRangeRecipe = cva([\n  'h-tf-mark-track',\n  'bg-tf-blend-rise blend-tf-accent',\n  'data-invalid:blend-tf-danger',\n  'tf-transition not-data-dragging:tf-travels motion-reduce:transition-none',\n])\n\nconst sliderNotchesRecipe = cva('pointer-events-none absolute inset-0')\n\nconst sliderNotchRecipe = cva([\n  'h-full w-tf-hairline',\n  'data-[state=over-value]:bg-tf-line-hi data-[state=under-value]:bg-tf-shade-under',\n  'tf-transition motion-reduce:transition-none',\n])\n\nconst sliderThumbRecipe = cva([\n  ...markKnob,\n  'size-tf-icon-solo-sm blend-tf-accent',\n  'inset-ring inset-ring-tf-line-hi',\n  'in-data-invalid:inset-ring-tf-danger-hi',\n  'tf-glow tf-fill-scale tf-settled-quiet',\n  'interactive:hovered:tf-raised',\n  'not-data-dragging:tf-travels',\n  'data-dragging:bg-tf-fg-held data-dragging:tf-raised',\n  'motion-safe:data-dragging:scale-112',\n  'data-disabled:opacity-50',\n  ...controlReach,\n])\n\nconst sliderFootRecipe = cva('flex items-baseline justify-between gap-4')\n\nconst sliderHintRecipe = cva('text-tf-caption font-medium', {\n  defaultVariants: { invalid: false },\n  variants: {\n    invalid: { false: 'text-tf-muted', true: 'text-tf-danger-hi tf-arrives' },\n  },\n})\n\nconst sliderBoundsRecipe = cva(\n  'ms-auto shrink-0 text-tf-caption font-medium text-tf-muted tabular-nums',\n)\n\nexport {\n  sliderBoundsRecipe,\n  sliderControlRecipe,\n  sliderFootRecipe,\n  sliderHeadRecipe,\n  sliderHintRecipe,\n  sliderKnobSize,\n  sliderLabelRecipe,\n  sliderNotchRecipe,\n  sliderNotchesRecipe,\n  sliderRangeRecipe,\n  sliderRecipe,\n  sliderThumbRecipe,\n  sliderTrackRecipe,\n  sliderValueRecipe,\n}\n"],"mappings":";;;;AAKA,MAAM,iBAAiB;AAEvB,MAAM,eAAe,IACnB;CACE;CACA;CACA;CACA;AACF,GACA;CACE,iBAAiB,EAAE,WAAW,MAAM;CACpC,UAAU,EACR,WAAW;EAAE,OAAO;EAAkB,MAAM;CAAG,EACjD;AACF,CACF;AAEA,MAAM,mBAAmB,IAAI,2CAA2C;AAExE,MAAM,oBAAoB,IAAI,qDAAqD;AAEnF,MAAM,oBAAoB,IAAI;CAC5B;CACA;CACA;AACF,CAAC;AAED,MAAM,sBAAsB,IAAI;CAC9B;CACA;CACA;AACF,CAAC;AAED,MAAM,oBAAoB,IAAI,CAC5B,uEACA,0BACF,CAAC;AAED,MAAM,oBAAoB,IAAI;CAC5B;CACA;CACA;CACA;AACF,CAAC;AAED,MAAM,sBAAsB,IAAI,sCAAsC;AAEtE,MAAM,oBAAoB,IAAI;CAC5B;CACA;CACA;AACF,CAAC;AAED,MAAM,oBAAoB,IAAI;CAC5B,GAAG;CACH;CACA;CACA;CACA;CACA;CACA;CACA;CACA;CACA;CACA,GAAG;AACL,CAAC;AAED,MAAM,mBAAmB,IAAI,2CAA2C;AAExE,MAAM,mBAAmB,IAAI,+BAA+B;CAC1D,iBAAiB,EAAE,SAAS,MAAM;CAClC,UAAU,EACR,SAAS;EAAE,OAAO;EAAiB,MAAM;CAA+B,EAC1E;AACF,CAAC;AAED,MAAM,qBAAqB,IACzB,yEACF"}
+{"version":3,"file":"slider.js","names":[],"sources":["../../src/recipes/slider.ts"],"sourcesContent":["import { cva } from 'class-variance-authority'\n\nimport { anatomy } from '#anatomy'\nimport { controlReach } from '#parts/control'\nimport { markKnob } from '#parts/mark'\n\nconst sliderKnobSize = 20\n\nconst sliderRecipe = cva(\n  [\n    'flex w-full flex-col gap-2',\n    'font-tf-body',\n    'data-disabled:cursor-not-allowed',\n    'data-disabled:**:data-[part=value-text]:text-tf-muted',\n  ],\n  {\n    defaultVariants: { fullWidth: false },\n    variants: {\n      fullWidth: { false: 'max-w-tf-panel', true: '' },\n    },\n  },\n)\n\nconst sliderHeadRecipe = cva('flex items-baseline justify-between gap-4')\n\nconst sliderLabelRecipe = cva('text-tf-body text-tf-fg data-disabled:text-tf-muted')\n\nconst sliderValueRecipe = cva([\n  'font-tf-display text-tf-h4 font-bold tracking-tf-tight tabular-nums',\n  'text-tf-fg in-data-dragging:text-tf-accent-hi in-data-focus:text-tf-accent-hi',\n  'tf-transition motion-reduce:transition-none',\n])\n\nconst sliderControlRecipe = cva([\n  'relative flex min-h-tf-target w-full items-center',\n  'not-data-readonly:interactive:cursor-pointer',\n  'data-readonly:cursor-default',\n])\n\nconst sliderTrackRecipe = cva([\n  'h-tf-mark-track w-full overflow-hidden rounded-tf-inline bg-tf-line',\n  'data-disabled:opacity-50',\n])\n\nconst sliderRangeRecipe = cva([\n  'h-tf-mark-track',\n  'bg-tf-blend-rise blend-tf-accent',\n  'data-invalid:blend-tf-danger',\n  'tf-transition not-data-dragging:tf-travels motion-reduce:transition-none',\n])\n\nconst sliderNotchesRecipe = cva('pointer-events-none absolute inset-0')\n\nconst sliderNotchRecipe = cva([\n  'h-full w-tf-hairline',\n  'data-[state=over-value]:bg-tf-line-hi data-[state=under-value]:bg-tf-shade-under',\n  'tf-transition motion-reduce:transition-none',\n])\n\nconst sliderThumbRecipe = cva([\n  ...markKnob,\n  'size-tf-icon-solo-sm blend-tf-accent',\n  'inset-ring inset-ring-tf-line-hi',\n  'in-data-invalid:inset-ring-tf-danger-hi',\n  'tf-glow tf-fill-scale tf-settled-quiet',\n  'interactive:hovered:tf-raised',\n  'not-data-dragging:tf-travels',\n  'data-dragging:bg-tf-fg-held data-dragging:tf-raised',\n  'motion-safe:data-dragging:scale-112',\n  'data-disabled:opacity-50',\n  ...controlReach,\n])\n\nconst sliderFootRecipe = cva('flex items-baseline justify-between gap-4')\n\nconst sliderHintRecipe = cva('text-tf-caption font-medium', {\n  defaultVariants: { invalid: false },\n  variants: {\n    invalid: { false: 'text-tf-muted', true: 'text-tf-danger-hi tf-arrives' },\n  },\n})\n\nconst sliderBoundsRecipe = cva(\n  'ms-auto shrink-0 text-tf-caption font-medium text-tf-muted tabular-nums',\n)\n\nconst sliderAnatomy = anatomy({\n  bounds: { part: 'bounds', recipe: sliderBoundsRecipe, required: true },\n  root: { part: 'slider', recipe: sliderRecipe, required: true },\n})\n\nexport {\n  sliderAnatomy,\n  sliderBoundsRecipe,\n  sliderControlRecipe,\n  sliderFootRecipe,\n  sliderHeadRecipe,\n  sliderHintRecipe,\n  sliderKnobSize,\n  sliderLabelRecipe,\n  sliderNotchRecipe,\n  sliderNotchesRecipe,\n  sliderRangeRecipe,\n  sliderRecipe,\n  sliderThumbRecipe,\n  sliderTrackRecipe,\n  sliderValueRecipe,\n}\n"],"mappings":";;;;;AAMA,MAAM,iBAAiB;AAEvB,MAAM,eAAe,IACnB;CACE;CACA;CACA;CACA;AACF,GACA;CACE,iBAAiB,EAAE,WAAW,MAAM;CACpC,UAAU,EACR,WAAW;EAAE,OAAO;EAAkB,MAAM;CAAG,EACjD;AACF,CACF;AAEA,MAAM,mBAAmB,IAAI,2CAA2C;AAExE,MAAM,oBAAoB,IAAI,qDAAqD;AAEnF,MAAM,oBAAoB,IAAI;CAC5B;CACA;CACA;AACF,CAAC;AAED,MAAM,sBAAsB,IAAI;CAC9B;CACA;CACA;AACF,CAAC;AAED,MAAM,oBAAoB,IAAI,CAC5B,uEACA,0BACF,CAAC;AAED,MAAM,oBAAoB,IAAI;CAC5B;CACA;CACA;CACA;AACF,CAAC;AAED,MAAM,sBAAsB,IAAI,sCAAsC;AAEtE,MAAM,oBAAoB,IAAI;CAC5B;CACA;CACA;AACF,CAAC;AAED,MAAM,oBAAoB,IAAI;CAC5B,GAAG;CACH;CACA;CACA;CACA;CACA;CACA;CACA;CACA;CACA;CACA,GAAG;AACL,CAAC;AAED,MAAM,mBAAmB,IAAI,2CAA2C;AAExE,MAAM,mBAAmB,IAAI,+BAA+B;CAC1D,iBAAiB,EAAE,SAAS,MAAM;CAClC,UAAU,EACR,SAAS;EAAE,OAAO;EAAiB,MAAM;CAA+B,EAC1E;AACF,CAAC;AAED,MAAM,qBAAqB,IACzB,yEACF;AAEA,MAAM,gBAAgB,QAAQ;CAC5B,QAAQ;EAAE,MAAM;EAAU,QAAQ;EAAoB,UAAU;CAAK;CACrE,MAAM;EAAE,MAAM;EAAU,QAAQ;EAAc,UAAU;CAAK;AAC/D,CAAC"}

package/dist/recipes/stat.d.ts

@@ -1,4 +1,3 @@
-import { SparkShape } from "../charts/spark.js";
 import { Tone } from "../tone.js";
 //#region src/recipes/stat.d.ts
 declare const statAccents: readonly ["accent", "success", "warning", "info", "danger"];
@@ -20,11 +19,81 @@ declare const statValueRecipe: (props?: import("class-variance-authority/types")
 declare const statUnitRecipe: (props?: import("class-variance-authority/types").ClassProp | undefined) => string;
 declare const statHintRecipe: (props?: import("class-variance-authority/types").ClassProp | undefined) => string;
 declare const statSparkShapes: readonly ["line", "bars"];
-type StatSparkShape = SparkShape;
+type StatSparkShape = (typeof statSparkShapes)[number];
 declare const defaultStatSparkShape = "line";
 declare const statSparkRecipe: (props?: import("class-variance-authority/types").ClassProp | undefined) => string;
 declare const statChangeRecipe: (props?: import("class-variance-authority/types").ClassProp | undefined) => string;
 declare const statTermRecipe: (props?: import("class-variance-authority/types").ClassProp | undefined) => string;
+declare const statAnatomy: {
+  readonly badge: {
+    readonly part: "badge";
+    readonly recipe: (props?: import("class-variance-authority/types").ClassProp | undefined) => string;
+    readonly required: false;
+  };
+  readonly change: {
+    readonly part: "change";
+    readonly recipe: (props?: import("class-variance-authority/types").ClassProp | undefined) => string;
+    readonly required: false;
+  };
+  readonly counted: {
+    readonly part: "counted";
+    readonly recipe: (props?: import("class-variance-authority/types").ClassProp | undefined) => string;
+    readonly required: true;
+  };
+  readonly figure: {
+    readonly part: "figure";
+    readonly recipe: (props?: import("class-variance-authority/types").ClassProp | undefined) => string;
+    readonly required: true;
+  };
+  readonly hint: {
+    readonly part: "hint";
+    readonly recipe: (props?: import("class-variance-authority/types").ClassProp | undefined) => string;
+    readonly required: false;
+  };
+  readonly label: {
+    readonly part: "label";
+    readonly recipe: (props?: import("class-variance-authority/types").ClassProp | undefined) => string;
+    readonly required: true;
+  };
+  readonly root: {
+    readonly part: "stat";
+    readonly recipe: (props?: ({
+      accent?: "accent" | "success" | "warning" | "info" | "danger" | null | undefined;
+      surface?: "glass" | "flat" | null | undefined;
+    } & import("class-variance-authority/types").ClassProp) | undefined) => string;
+    readonly required: true;
+  };
+  readonly spark: {
+    readonly part: "spark";
+    readonly recipe: (props?: import("class-variance-authority/types").ClassProp | undefined) => string;
+    readonly required: false;
+  };
+  readonly stack: {
+    readonly part: "stack";
+    readonly recipe: (props?: import("class-variance-authority/types").ClassProp | undefined) => string;
+    readonly required: true;
+  };
+  readonly term: {
+    readonly part: "term";
+    readonly recipe: (props?: import("class-variance-authority/types").ClassProp | undefined) => string;
+    readonly required: false;
+  };
+  readonly unit: {
+    readonly part: "unit";
+    readonly recipe: (props?: import("class-variance-authority/types").ClassProp | undefined) => string;
+    readonly required: false;
+  };
+  readonly value: {
+    readonly part: "value";
+    readonly recipe: (props?: import("class-variance-authority/types").ClassProp | undefined) => string;
+    readonly required: true;
+  };
+  readonly way: {
+    readonly part: "way";
+    readonly recipe: (props?: import("class-variance-authority/types").ClassProp | undefined) => string;
+    readonly required: false;
+  };
+};
 //#endregion
-export { type StatAccent, type StatDirection, type StatSparkShape, type StatSurface, defaultStatAccent, defaultStatSparkShape, defaultStatSurface, statAccents, statChangeRecipe, statDirections, statFigureRecipe, statHintRecipe, statLabelRecipe, statRecipe, statSparkRecipe, statSparkShapes, statStackRecipe, statSurfaces, statTermRecipe, statUnitRecipe, statValueRecipe };
+export { type StatAccent, type StatDirection, type StatSparkShape, type StatSurface, defaultStatAccent, defaultStatSparkShape, defaultStatSurface, statAccents, statAnatomy, statChangeRecipe, statDirections, statFigureRecipe, statHintRecipe, statLabelRecipe, statRecipe, statSparkRecipe, statSparkShapes, statStackRecipe, statSurfaces, statTermRecipe, statUnitRecipe, statValueRecipe };
 //# sourceMappingURL=stat.d.ts.map

package/dist/recipes/stat.js

@@ -1,6 +1,7 @@
-import { toneBlend } from "../tone.js";
-import { defaultTone, tones } from "../parts/tone.js";
+import { anatomy } from "../anatomy.js";
 import { tileRoused } from "../parts/rouse.js";
+import { defaultTone, tones } from "../parts/tone.js";
+import { toneBlend } from "../tone.js";
 import { cva } from "class-variance-authority";
 //#region src/recipes/stat.ts
 const statAccents = tones;
@@ -46,7 +47,76 @@ const statChangeRecipe = cva([
 	"tf-icons [&_svg]:size-tf-icon-sm [&_svg]:shrink-0"
 ]);
 const statTermRecipe = cva("sr-only");
+const statBadgeRecipe = cva("absolute top-4 right-4");
+const statCountedRecipe = cva("");
+const statAnatomy = anatomy({
+	badge: {
+		part: "badge",
+		recipe: statBadgeRecipe,
+		required: false
+	},
+	change: {
+		part: "change",
+		recipe: statChangeRecipe,
+		required: false
+	},
+	counted: {
+		part: "counted",
+		recipe: statCountedRecipe,
+		required: true
+	},
+	figure: {
+		part: "figure",
+		recipe: statFigureRecipe,
+		required: true
+	},
+	hint: {
+		part: "hint",
+		recipe: statHintRecipe,
+		required: false
+	},
+	label: {
+		part: "label",
+		recipe: statLabelRecipe,
+		required: true
+	},
+	root: {
+		part: "stat",
+		recipe: statRecipe,
+		required: true
+	},
+	spark: {
+		part: "spark",
+		recipe: statSparkRecipe,
+		required: false
+	},
+	stack: {
+		part: "stack",
+		recipe: statStackRecipe,
+		required: true
+	},
+	term: {
+		part: "term",
+		recipe: statTermRecipe,
+		required: false
+	},
+	unit: {
+		part: "unit",
+		recipe: statUnitRecipe,
+		required: false
+	},
+	value: {
+		part: "value",
+		recipe: statValueRecipe,
+		required: true
+	},
+	way: {
+		part: "way",
+		recipe: statTermRecipe,
+		required: false
+	}
+});
 //#endregion
-export { defaultStatAccent, defaultStatSparkShape, defaultStatSurface, statAccents, statChangeRecipe, statDirections, statFigureRecipe, statHintRecipe, statLabelRecipe, statRecipe, statSparkRecipe, statSparkShapes, statStackRecipe, statSurfaces, statTermRecipe, statUnitRecipe, statValueRecipe };
+export { defaultStatAccent, defaultStatSparkShape, defaultStatSurface, statAccents, statAnatomy, statChangeRecipe, statDirections, statFigureRecipe, statHintRecipe, statLabelRecipe, statRecipe, statSparkRecipe, statSparkShapes, statStackRecipe, statSurfaces, statTermRecipe, statUnitRecipe, statValueRecipe };
 
 //# sourceMappingURL=stat.js.map

package/dist/recipes/stat.js.map

@@ -1 +1 @@
-{"version":3,"file":"stat.js","names":[],"sources":["../../src/recipes/stat.ts"],"sourcesContent":["import { cva } from 'class-variance-authority'\n\nimport type { SparkShape } from '#charts/spark'\nimport { tileRoused } from '#parts/rouse'\nimport { defaultTone, tones } from '#parts/tone'\nimport type { Tone } from '#tone'\nimport { toneBlend } from '#tone'\n\nconst statAccents = tones\n\ntype StatAccent = Tone\n\nconst statDirections = ['up', 'down'] as const\n\ntype StatDirection = (typeof statDirections)[number]\n\nconst defaultStatAccent = defaultTone\n\nconst BLEND = toneBlend\n\ntype StatSurface = 'glass' | 'flat'\n\nconst statSurfaces = ['glass', 'flat'] as const satisfies readonly StatSurface[]\n\nconst defaultStatSurface = 'glass' satisfies StatSurface\n\nconst statRecipe = cva(\n  [\n    '@container relative isolate flex min-w-0 grow items-center gap-5 p-6',\n    'font-tf-body text-tf-fg tf-transition',\n    tileRoused,\n  ],\n  {\n    defaultVariants: { accent: defaultStatAccent, surface: defaultStatSurface },\n    variants: {\n      accent: BLEND,\n      surface: {\n        flat: '',\n        glass: [\n          'rounded-tf-card bg-tf-glass shadow-tf-float backdrop-blur-tf-glass',\n          'tf-edge-sweep',\n          'motion-safe:tf-lands',\n        ].join(' '),\n      } satisfies Record<StatSurface, string>,\n    },\n  },\n)\n\nconst statStackRecipe = cva('flex min-w-0 grow flex-wrap items-center gap-x-3 gap-y-1')\n\nconst statLabelRecipe = cva(['order-1 grow text-tf-body-sm font-medium text-tf-fg'])\n\nconst statFigureRecipe = cva('order-3 m-0 flex basis-full flex-nowrap items-baseline gap-2')\n\nconst statValueRecipe = cva([\n  'font-tf-display text-tf-figure font-bold tracking-tf-tight text-tf-fg',\n  'motion-safe:tf-tallies',\n])\n\nconst statUnitRecipe = cva('text-tf-unit font-tf-body font-medium text-tf-muted')\n\nconst statHintRecipe = cva('order-4 basis-full text-tf-caption-sm text-tf-muted')\n\nconst statSparkShapes = ['line', 'bars'] as const satisfies readonly SparkShape[]\n\ntype StatSparkShape = SparkShape\n\nconst defaultStatSparkShape = 'line' satisfies StatSparkShape\n\nconst statSparkRecipe = cva('order-5 mt-2 h-7 w-full basis-full')\n\nconst statChangeRecipe = cva([\n  'relative order-2 m-0 ml-auto inline-flex items-center gap-1',\n  'tf-edge-sweep rounded-tf-pill bg-tf-panel px-2 py-1 blend-tf-accent',\n  'text-tf-caption-sm font-normal whitespace-nowrap text-tf-accent-hi tabular-nums',\n  'tf-icons [&_svg]:size-tf-icon-sm [&_svg]:shrink-0',\n])\n\nconst statTermRecipe = cva('sr-only')\n\nexport {\n  type StatAccent,\n  type StatDirection,\n  type StatSparkShape,\n  type StatSurface,\n  defaultStatAccent,\n  defaultStatSparkShape,\n  defaultStatSurface,\n  statAccents,\n  statChangeRecipe,\n  statDirections,\n  statFigureRecipe,\n  statHintRecipe,\n  statLabelRecipe,\n  statRecipe,\n  statSparkRecipe,\n  statSparkShapes,\n  statStackRecipe,\n  statSurfaces,\n  statTermRecipe,\n  statUnitRecipe,\n  statValueRecipe,\n}\n"],"mappings":";;;;;AAQA,MAAM,cAAc;AAIpB,MAAM,iBAAiB,CAAC,MAAM,MAAM;AAIpC,MAAM,oBAAoB;AAE1B,MAAM,QAAQ;AAId,MAAM,eAAe,CAAC,SAAS,MAAM;AAErC,MAAM,qBAAqB;AAE3B,MAAM,aAAa,IACjB;CACE;CACA;CACA;AACF,GACA;CACE,iBAAiB;EAAE,QAAQ;EAAmB,SAAS;CAAmB;CAC1E,UAAU;EACR,QAAQ;EACR,SAAS;GACP,MAAM;GACN,OAAO;IACL;IACA;IACA;GACF,CAAC,CAAC,KAAK,GAAG;EACZ;CACF;AACF,CACF;AAEA,MAAM,kBAAkB,IAAI,0DAA0D;AAEtF,MAAM,kBAAkB,IAAI,CAAC,qDAAqD,CAAC;AAEnF,MAAM,mBAAmB,IAAI,8DAA8D;AAE3F,MAAM,kBAAkB,IAAI,CAC1B,yEACA,wBACF,CAAC;AAED,MAAM,iBAAiB,IAAI,qDAAqD;AAEhF,MAAM,iBAAiB,IAAI,qDAAqD;AAEhF,MAAM,kBAAkB,CAAC,QAAQ,MAAM;AAIvC,MAAM,wBAAwB;AAE9B,MAAM,kBAAkB,IAAI,oCAAoC;AAEhE,MAAM,mBAAmB,IAAI;CAC3B;CACA;CACA;CACA;AACF,CAAC;AAED,MAAM,iBAAiB,IAAI,SAAS"}
+{"version":3,"file":"stat.js","names":[],"sources":["../../src/recipes/stat.ts"],"sourcesContent":["import { cva } from 'class-variance-authority'\n\nimport { anatomy } from '#anatomy'\nimport { tileRoused } from '#parts/rouse'\nimport { defaultTone, tones } from '#parts/tone'\nimport type { Tone } from '#tone'\nimport { toneBlend } from '#tone'\n\nconst statAccents = tones\n\ntype StatAccent = Tone\n\nconst statDirections = ['up', 'down'] as const\n\ntype StatDirection = (typeof statDirections)[number]\n\nconst defaultStatAccent = defaultTone\n\nconst BLEND = toneBlend\n\ntype StatSurface = 'glass' | 'flat'\n\nconst statSurfaces = ['glass', 'flat'] as const satisfies readonly StatSurface[]\n\nconst defaultStatSurface = 'glass' satisfies StatSurface\n\nconst statRecipe = cva(\n  [\n    '@container relative isolate flex min-w-0 grow items-center gap-5 p-6',\n    'font-tf-body text-tf-fg tf-transition',\n    tileRoused,\n  ],\n  {\n    defaultVariants: { accent: defaultStatAccent, surface: defaultStatSurface },\n    variants: {\n      accent: BLEND,\n      surface: {\n        flat: '',\n        glass: [\n          'rounded-tf-card bg-tf-glass shadow-tf-float backdrop-blur-tf-glass',\n          'tf-edge-sweep',\n          'motion-safe:tf-lands',\n        ].join(' '),\n      } satisfies Record<StatSurface, string>,\n    },\n  },\n)\n\nconst statStackRecipe = cva('flex min-w-0 grow flex-wrap items-center gap-x-3 gap-y-1')\n\nconst statLabelRecipe = cva(['order-1 grow text-tf-body-sm font-medium text-tf-fg'])\n\nconst statFigureRecipe = cva('order-3 m-0 flex basis-full flex-nowrap items-baseline gap-2')\n\nconst statValueRecipe = cva([\n  'font-tf-display text-tf-figure font-bold tracking-tf-tight text-tf-fg',\n  'motion-safe:tf-tallies',\n])\n\nconst statUnitRecipe = cva('text-tf-unit font-tf-body font-medium text-tf-muted')\n\nconst statHintRecipe = cva('order-4 basis-full text-tf-caption-sm text-tf-muted')\n\nconst statSparkShapes = ['line', 'bars'] as const\n\ntype StatSparkShape = (typeof statSparkShapes)[number]\n\nconst defaultStatSparkShape = 'line' satisfies StatSparkShape\n\nconst statSparkRecipe = cva('order-5 mt-2 h-7 w-full basis-full')\n\nconst statChangeRecipe = cva([\n  'relative order-2 m-0 ml-auto inline-flex items-center gap-1',\n  'tf-edge-sweep rounded-tf-pill bg-tf-panel px-2 py-1 blend-tf-accent',\n  'text-tf-caption-sm font-normal whitespace-nowrap text-tf-accent-hi tabular-nums',\n  'tf-icons [&_svg]:size-tf-icon-sm [&_svg]:shrink-0',\n])\n\nconst statTermRecipe = cva('sr-only')\n\nconst statBadgeRecipe = cva('absolute top-4 right-4')\n\nconst statCountedRecipe = cva('')\n\nconst statAnatomy = anatomy({\n  badge: { part: 'badge', recipe: statBadgeRecipe, required: false },\n  change: { part: 'change', recipe: statChangeRecipe, required: false },\n  counted: { part: 'counted', recipe: statCountedRecipe, required: true },\n  figure: { part: 'figure', recipe: statFigureRecipe, required: true },\n  hint: { part: 'hint', recipe: statHintRecipe, required: false },\n  label: { part: 'label', recipe: statLabelRecipe, required: true },\n  root: { part: 'stat', recipe: statRecipe, required: true },\n  spark: { part: 'spark', recipe: statSparkRecipe, required: false },\n  stack: { part: 'stack', recipe: statStackRecipe, required: true },\n  term: { part: 'term', recipe: statTermRecipe, required: false },\n  unit: { part: 'unit', recipe: statUnitRecipe, required: false },\n  value: { part: 'value', recipe: statValueRecipe, required: true },\n  way: { part: 'way', recipe: statTermRecipe, required: false },\n})\n\nexport {\n  type StatAccent,\n  type StatDirection,\n  type StatSparkShape,\n  type StatSurface,\n  defaultStatAccent,\n  defaultStatSparkShape,\n  defaultStatSurface,\n  statAccents,\n  statAnatomy,\n  statChangeRecipe,\n  statDirections,\n  statFigureRecipe,\n  statHintRecipe,\n  statLabelRecipe,\n  statRecipe,\n  statSparkRecipe,\n  statSparkShapes,\n  statStackRecipe,\n  statSurfaces,\n  statTermRecipe,\n  statUnitRecipe,\n  statValueRecipe,\n}\n"],"mappings":";;;;;;AAQA,MAAM,cAAc;AAIpB,MAAM,iBAAiB,CAAC,MAAM,MAAM;AAIpC,MAAM,oBAAoB;AAE1B,MAAM,QAAQ;AAId,MAAM,eAAe,CAAC,SAAS,MAAM;AAErC,MAAM,qBAAqB;AAE3B,MAAM,aAAa,IACjB;CACE;CACA;CACA;AACF,GACA;CACE,iBAAiB;EAAE,QAAQ;EAAmB,SAAS;CAAmB;CAC1E,UAAU;EACR,QAAQ;EACR,SAAS;GACP,MAAM;GACN,OAAO;IACL;IACA;IACA;GACF,CAAC,CAAC,KAAK,GAAG;EACZ;CACF;AACF,CACF;AAEA,MAAM,kBAAkB,IAAI,0DAA0D;AAEtF,MAAM,kBAAkB,IAAI,CAAC,qDAAqD,CAAC;AAEnF,MAAM,mBAAmB,IAAI,8DAA8D;AAE3F,MAAM,kBAAkB,IAAI,CAC1B,yEACA,wBACF,CAAC;AAED,MAAM,iBAAiB,IAAI,qDAAqD;AAEhF,MAAM,iBAAiB,IAAI,qDAAqD;AAEhF,MAAM,kBAAkB,CAAC,QAAQ,MAAM;AAIvC,MAAM,wBAAwB;AAE9B,MAAM,kBAAkB,IAAI,oCAAoC;AAEhE,MAAM,mBAAmB,IAAI;CAC3B;CACA;CACA;CACA;AACF,CAAC;AAED,MAAM,iBAAiB,IAAI,SAAS;AAEpC,MAAM,kBAAkB,IAAI,wBAAwB;AAEpD,MAAM,oBAAoB,IAAI,EAAE;AAEhC,MAAM,cAAc,QAAQ;CAC1B,OAAO;EAAE,MAAM;EAAS,QAAQ;EAAiB,UAAU;CAAM;CACjE,QAAQ;EAAE,MAAM;EAAU,QAAQ;EAAkB,UAAU;CAAM;CACpE,SAAS;EAAE,MAAM;EAAW,QAAQ;EAAmB,UAAU;CAAK;CACtE,QAAQ;EAAE,MAAM;EAAU,QAAQ;EAAkB,UAAU;CAAK;CACnE,MAAM;EAAE,MAAM;EAAQ,QAAQ;EAAgB,UAAU;CAAM;CAC9D,OAAO;EAAE,MAAM;EAAS,QAAQ;EAAiB,UAAU;CAAK;CAChE,MAAM;EAAE,MAAM;EAAQ,QAAQ;EAAY,UAAU;CAAK;CACzD,OAAO;EAAE,MAAM;EAAS,QAAQ;EAAiB,UAAU;CAAM;CACjE,OAAO;EAAE,MAAM;EAAS,QAAQ;EAAiB,UAAU;CAAK;CAChE,MAAM;EAAE,MAAM;EAAQ,QAAQ;EAAgB,UAAU;CAAM;CAC9D,MAAM;EAAE,MAAM;EAAQ,QAAQ;EAAgB,UAAU;CAAM;CAC9D,OAAO;EAAE,MAAM;EAAS,QAAQ;EAAiB,UAAU;CAAK;CAChE,KAAK;EAAE,MAAM;EAAO,QAAQ;EAAgB,UAAU;CAAM;AAC9D,CAAC"}

package/dist/recipes/switch.d.ts

@@ -15,6 +15,15 @@ declare const switchTitleRecipe: (props?: import("class-variance-authority/types
 declare const switchHintRecipe: (props?: ({
   invalid?: boolean | null | undefined;
 } & import("class-variance-authority/types").ClassProp) | undefined) => string;
+declare const switchAnatomy: {
+  readonly root: {
+    readonly part: "switch";
+    readonly recipe: (props?: ({
+      plate?: "full" | "snug" | "bare" | null | undefined;
+    } & import("class-variance-authority/types").ClassProp) | undefined) => string;
+    readonly required: true;
+  };
+};
 //#endregion
-export { type SwitchAccent, defaultSwitchAccent, switchAccents, switchControlRecipe, switchHintRecipe, switchLabelRecipe, switchRecipe, switchThumbRecipe, switchTitleRecipe };
+export { type SwitchAccent, defaultSwitchAccent, switchAccents, switchAnatomy, switchControlRecipe, switchHintRecipe, switchLabelRecipe, switchRecipe, switchThumbRecipe, switchTitleRecipe };
 //# sourceMappingURL=switch.d.ts.map

package/dist/recipes/switch.js

@@ -1,6 +1,7 @@
-import { defaultMarkPlate } from "../mark.js";
-import { toneBlend } from "../tone.js";
+import { anatomy } from "../anatomy.js";
 import { defaultTone, tones } from "../parts/tone.js";
+import { toneBlend } from "../tone.js";
+import { defaultMarkPlate } from "../mark.js";
 import { markFace, markKnob, markPlate, markPlated, markPress, markRow, markStack, markTitle } from "../parts/mark.js";
 import { cva } from "class-variance-authority";
 //#region src/recipes/switch.ts
@@ -54,7 +55,12 @@ const switchHintRecipe = cva("text-tf-caption font-medium", {
 		true: "text-tf-danger-hi tf-arrives"
 	} }
 });
+const switchAnatomy = anatomy({ root: {
+	part: "switch",
+	recipe: switchRecipe,
+	required: true
+} });
 //#endregion
-export { defaultSwitchAccent, switchAccents, switchControlRecipe, switchHintRecipe, switchLabelRecipe, switchRecipe, switchThumbRecipe, switchTitleRecipe };
+export { defaultSwitchAccent, switchAccents, switchAnatomy, switchControlRecipe, switchHintRecipe, switchLabelRecipe, switchRecipe, switchThumbRecipe, switchTitleRecipe };
 
 //# sourceMappingURL=switch.js.map

package/dist/recipes/switch.js.map

@@ -1 +1 @@
-{"version":3,"file":"switch.js","names":[],"sources":["../../src/recipes/switch.ts"],"sourcesContent":["import { cva } from 'class-variance-authority'\n\nimport type { MarkPlate } from '#mark'\nimport { defaultMarkPlate } from '#mark'\nimport {\n  markFace,\n  markKnob,\n  markPlate,\n  markPlated,\n  markPress,\n  markRow,\n  markStack,\n  markTitle,\n} from '#parts/mark'\nimport { defaultTone, tones } from '#parts/tone'\nimport type { Tone } from '#tone'\nimport { toneBlend } from '#tone'\n\nconst switchAccents = tones\n\ntype SwitchAccent = Tone\n\nconst defaultSwitchAccent = defaultTone\n\nconst TRACK = [\n  'box-border justify-start rounded-tf-control',\n  'w-[calc(var(--spacing-tf-icon-lg)*2)]',\n  'h-[calc(var(--spacing-tf-icon-md)+2*var(--spacing-tf-mark-inset))]',\n  'p-tf-mark-inset',\n]\n\nconst FILL = ['bg-tf-panel', 'tf-ramp']\n\nconst OFF = ['data-[state=unchecked]:interactive:not-data-readonly:hovered:bg-tf-panel-hi']\n\nconst ON = [\n  'data-[state=checked]:tf-mark-lit',\n  'data-[state=checked]:tf-mark-glowing',\n  'data-[state=checked]:bg-tf-blend',\n  'data-[state=checked]:interactive:not-data-readonly:hovered:tf-blended',\n]\n\nconst switchRecipe = cva([...markRow, 'justify-between gap-6'], {\n  defaultVariants: { plate: defaultMarkPlate },\n  variants: {\n    plate: {\n      bare: `${markPlate.bare} ${markPlated.bare}`,\n      full: `${markPlate.full} ${markPlated.full}`,\n      snug: `${markPlate.snug} ${markPlated.snug}`,\n    } satisfies Record<MarkPlate, string>,\n  },\n})\n\nconst switchControlRecipe = cva(\n  [\n    ...markFace,\n    ...TRACK,\n    ...FILL,\n    ...OFF,\n    ...ON,\n    'data-invalid:blend-tf-danger data-invalid:tf-mark-failed',\n  ],\n  {\n    defaultVariants: { accent: defaultSwitchAccent },\n    variants: { accent: toneBlend },\n  },\n)\n\nconst switchThumbRecipe = cva([\n  ...markKnob,\n  'size-tf-icon-md',\n  'data-[state=checked]:translate-x-tf-icon-sm',\n  markPress,\n])\n\nconst switchLabelRecipe = cva(markStack)\n\nconst switchTitleRecipe = cva(markTitle)\n\nconst switchHintRecipe = cva('text-tf-caption font-medium', {\n  defaultVariants: { invalid: false },\n  variants: {\n    invalid: { false: 'text-tf-muted', true: 'text-tf-danger-hi tf-arrives' },\n  },\n})\n\nexport {\n  type SwitchAccent,\n  defaultSwitchAccent,\n  switchAccents,\n  switchControlRecipe,\n  switchHintRecipe,\n  switchLabelRecipe,\n  switchRecipe,\n  switchThumbRecipe,\n  switchTitleRecipe,\n}\n"],"mappings":";;;;;;AAkBA,MAAM,gBAAgB;AAItB,MAAM,sBAAsB;AAE5B,MAAM,QAAQ;CACZ;CACA;CACA;CACA;AACF;AAEA,MAAM,OAAO,CAAC,eAAe,SAAS;AAEtC,MAAM,MAAM,CAAC,6EAA6E;AAE1F,MAAM,KAAK;CACT;CACA;CACA;CACA;AACF;AAEA,MAAM,eAAe,IAAI,CAAC,GAAG,SAAS,uBAAuB,GAAG;CAC9D,iBAAiB,EAAE,OAAO,iBAAiB;CAC3C,UAAU,EACR,OAAO;EACL,MAAM,GAAG,UAAU,KAAK,GAAG,WAAW;EACtC,MAAM,GAAG,UAAU,KAAK,GAAG,WAAW;EACtC,MAAM,GAAG,UAAU,KAAK,GAAG,WAAW;CACxC,EACF;AACF,CAAC;AAED,MAAM,sBAAsB,IAC1B;CACE,GAAG;CACH,GAAG;CACH,GAAG;CACH,GAAG;CACH,GAAG;CACH;AACF,GACA;CACE,iBAAiB,EAAE,QAAQ,oBAAoB;CAC/C,UAAU,EAAE,QAAQ,UAAU;AAChC,CACF;AAEA,MAAM,oBAAoB,IAAI;CAC5B,GAAG;CACH;CACA;CACA;AACF,CAAC;AAED,MAAM,oBAAoB,IAAI,SAAS;AAEvC,MAAM,oBAAoB,IAAI,SAAS;AAEvC,MAAM,mBAAmB,IAAI,+BAA+B;CAC1D,iBAAiB,EAAE,SAAS,MAAM;CAClC,UAAU,EACR,SAAS;EAAE,OAAO;EAAiB,MAAM;CAA+B,EAC1E;AACF,CAAC"}
+{"version":3,"file":"switch.js","names":[],"sources":["../../src/recipes/switch.ts"],"sourcesContent":["import { cva } from 'class-variance-authority'\n\nimport { anatomy } from '#anatomy'\nimport type { MarkPlate } from '#mark'\nimport { defaultMarkPlate } from '#mark'\nimport {\n  markFace,\n  markKnob,\n  markPlate,\n  markPlated,\n  markPress,\n  markRow,\n  markStack,\n  markTitle,\n} from '#parts/mark'\nimport { defaultTone, tones } from '#parts/tone'\nimport type { Tone } from '#tone'\nimport { toneBlend } from '#tone'\n\nconst switchAccents = tones\n\ntype SwitchAccent = Tone\n\nconst defaultSwitchAccent = defaultTone\n\nconst TRACK = [\n  'box-border justify-start rounded-tf-control',\n  'w-[calc(var(--spacing-tf-icon-lg)*2)]',\n  'h-[calc(var(--spacing-tf-icon-md)+2*var(--spacing-tf-mark-inset))]',\n  'p-tf-mark-inset',\n]\n\nconst FILL = ['bg-tf-panel', 'tf-ramp']\n\nconst OFF = ['data-[state=unchecked]:interactive:not-data-readonly:hovered:bg-tf-panel-hi']\n\nconst ON = [\n  'data-[state=checked]:tf-mark-lit',\n  'data-[state=checked]:tf-mark-glowing',\n  'data-[state=checked]:bg-tf-blend',\n  'data-[state=checked]:interactive:not-data-readonly:hovered:tf-blended',\n]\n\nconst switchRecipe = cva([...markRow, 'justify-between gap-6'], {\n  defaultVariants: { plate: defaultMarkPlate },\n  variants: {\n    plate: {\n      bare: `${markPlate.bare} ${markPlated.bare}`,\n      full: `${markPlate.full} ${markPlated.full}`,\n      snug: `${markPlate.snug} ${markPlated.snug}`,\n    } satisfies Record<MarkPlate, string>,\n  },\n})\n\nconst switchControlRecipe = cva(\n  [\n    ...markFace,\n    ...TRACK,\n    ...FILL,\n    ...OFF,\n    ...ON,\n    'data-invalid:blend-tf-danger data-invalid:tf-mark-failed',\n  ],\n  {\n    defaultVariants: { accent: defaultSwitchAccent },\n    variants: { accent: toneBlend },\n  },\n)\n\nconst switchThumbRecipe = cva([\n  ...markKnob,\n  'size-tf-icon-md',\n  'data-[state=checked]:translate-x-tf-icon-sm',\n  markPress,\n])\n\nconst switchLabelRecipe = cva(markStack)\n\nconst switchTitleRecipe = cva(markTitle)\n\nconst switchHintRecipe = cva('text-tf-caption font-medium', {\n  defaultVariants: { invalid: false },\n  variants: {\n    invalid: { false: 'text-tf-muted', true: 'text-tf-danger-hi tf-arrives' },\n  },\n})\n\nconst switchAnatomy = anatomy({\n  root: { part: 'switch', recipe: switchRecipe, required: true },\n})\n\nexport {\n  type SwitchAccent,\n  defaultSwitchAccent,\n  switchAccents,\n  switchAnatomy,\n  switchControlRecipe,\n  switchHintRecipe,\n  switchLabelRecipe,\n  switchRecipe,\n  switchThumbRecipe,\n  switchTitleRecipe,\n}\n"],"mappings":";;;;;;;AAmBA,MAAM,gBAAgB;AAItB,MAAM,sBAAsB;AAE5B,MAAM,QAAQ;CACZ;CACA;CACA;CACA;AACF;AAEA,MAAM,OAAO,CAAC,eAAe,SAAS;AAEtC,MAAM,MAAM,CAAC,6EAA6E;AAE1F,MAAM,KAAK;CACT;CACA;CACA;CACA;AACF;AAEA,MAAM,eAAe,IAAI,CAAC,GAAG,SAAS,uBAAuB,GAAG;CAC9D,iBAAiB,EAAE,OAAO,iBAAiB;CAC3C,UAAU,EACR,OAAO;EACL,MAAM,GAAG,UAAU,KAAK,GAAG,WAAW;EACtC,MAAM,GAAG,UAAU,KAAK,GAAG,WAAW;EACtC,MAAM,GAAG,UAAU,KAAK,GAAG,WAAW;CACxC,EACF;AACF,CAAC;AAED,MAAM,sBAAsB,IAC1B;CACE,GAAG;CACH,GAAG;CACH,GAAG;CACH,GAAG;CACH,GAAG;CACH;AACF,GACA;CACE,iBAAiB,EAAE,QAAQ,oBAAoB;CAC/C,UAAU,EAAE,QAAQ,UAAU;AAChC,CACF;AAEA,MAAM,oBAAoB,IAAI;CAC5B,GAAG;CACH;CACA;CACA;AACF,CAAC;AAED,MAAM,oBAAoB,IAAI,SAAS;AAEvC,MAAM,oBAAoB,IAAI,SAAS;AAEvC,MAAM,mBAAmB,IAAI,+BAA+B;CAC1D,iBAAiB,EAAE,SAAS,MAAM;CAClC,UAAU,EACR,SAAS;EAAE,OAAO;EAAiB,MAAM;CAA+B,EAC1E;AACF,CAAC;AAED,MAAM,gBAAgB,QAAQ,EAC5B,MAAM;CAAE,MAAM;CAAU,QAAQ;CAAc,UAAU;AAAK,EAC/D,CAAC"}

package/dist/recipes/table.d.ts

@@ -17,7 +17,7 @@ declare const tableScrollRecipe: (props?: import("class-variance-authority/types
 declare const tableGridRecipe: (props?: import("class-variance-authority/types").ClassProp | undefined) => string;
 declare const tableHeadRowRecipe: (props?: import("class-variance-authority/types").ClassProp | undefined) => string;
 declare const tableHeadCellRecipe: (props?: ({
-  align?: "end" | "start" | null | undefined;
+  align?: "start" | "end" | null | undefined;
 } & import("class-variance-authority/types").ClassProp) | undefined) => string;
 declare const tableHeadingRecipe: (props?: import("class-variance-authority/types").ClassProp | undefined) => string;
 declare const tableSortRecipe: (props?: ({
@@ -47,7 +47,7 @@ declare const tableRowRecipe: (props?: ({
 declare const tableSelectCellRecipe: (props?: import("class-variance-authority/types").ClassProp | undefined) => string;
 declare const tableMarkRecipe: (props?: import("class-variance-authority/types").ClassProp | undefined) => string;
 declare const tableCellRecipe: (props?: ({
-  align?: "end" | "start" | null | undefined;
+  align?: "start" | "end" | null | undefined;
   mono?: boolean | null | undefined;
   tabular?: boolean | null | undefined;
 } & import("class-variance-authority/types").ClassProp) | undefined) => string;
@@ -69,6 +69,66 @@ declare const tableSkeletonMarkRecipe: (props?: import("class-variance-authority
 declare const tableEmptyRecipe: (props?: import("class-variance-authority/types").ClassProp | undefined) => string;
 declare const tableEmptyTitleRecipe: (props?: import("class-variance-authority/types").ClassProp | undefined) => string;
 declare const tableEmptyHintRecipe: (props?: import("class-variance-authority/types").ClassProp | undefined) => string;
+declare const tableAnatomy: {
+  readonly bar: {
+    readonly part: "bar";
+    readonly recipe: (props?: ({
+      numeric?: boolean | null | undefined;
+    } & import("class-variance-authority/types").ClassProp) | undefined) => string;
+    readonly required: false;
+  };
+  readonly filterRule: {
+    readonly part: "filter-rule";
+    readonly recipe: (props?: import("class-variance-authority/types").ClassProp | undefined) => string;
+    readonly required: true;
+  };
+  readonly head: {
+    readonly part: "head";
+    readonly recipe: (props?: ({
+      align?: "start" | "end" | null | undefined;
+    } & import("class-variance-authority/types").ClassProp) | undefined) => string;
+    readonly required: true;
+  };
+  readonly mark: {
+    readonly part: "mark";
+    readonly recipe: (props?: ({
+      sorted?: boolean | null | undefined;
+    } & import("class-variance-authority/types").ClassProp) | undefined) => string;
+    readonly required: false;
+  };
+  readonly rank: {
+    readonly part: "rank";
+    readonly recipe: (props?: import("class-variance-authority/types").ClassProp | undefined) => string;
+    readonly required: false;
+  };
+  readonly root: {
+    readonly part: "table";
+    readonly recipe: (props?: import("class-variance-authority/types").ClassProp | undefined) => string;
+    readonly required: true;
+  };
+  readonly rule: {
+    readonly part: "rule";
+    readonly recipe: (props?: import("class-variance-authority/types").ClassProp | undefined) => string;
+    readonly required: true;
+  };
+  readonly ruled: {
+    readonly part: "ruled";
+    readonly recipe: (props?: import("class-variance-authority/types").ClassProp | undefined) => string;
+    readonly required: true;
+  };
+  readonly tableFilter: {
+    readonly part: "table-filter";
+    readonly recipe: (props?: ({
+      on?: boolean | null | undefined;
+    } & import("class-variance-authority/types").ClassProp) | undefined) => string;
+    readonly required: false;
+  };
+  readonly toolbar: {
+    readonly part: "table-toolbar";
+    readonly recipe: (props?: import("class-variance-authority/types").ClassProp | undefined) => string;
+    readonly required: false;
+  };
+};
 //#endregion
-export { type TableAlign, type TableFilterKind, tableActionsCellRecipe, tableActionsWidth, tableAppliedRecipe, tableBodyRecipe, tableCardRecipe, tableCellRecipe, tableDetailBodyRecipe, tableDetailRecipe, tableEmptyHintRecipe, tableEmptyRecipe, tableEmptyTitleRecipe, tableExpandIconRecipe, tableExpandRecipe, tableFilterMarkRecipe, tableFilterRecipe, tableGridRecipe, tableGroupRecipe, tableHeadCellRecipe, tableHeadRowRecipe, tableHeadingRecipe, tableMarkRecipe, tablePinWidth, tableRankRecipe, tableRecipe, tableRowRecipe, tableRuleRecipe, tableScrollRecipe, tableSearchRecipe, tableSelectCellRecipe, tableSelectionActionsRecipe, tableSelectionCountRecipe, tableSelectionRecipe, tableSkeletonBarRecipe, tableSkeletonMarkRecipe, tableSortIconRecipe, tableSortLabelRecipe, tableSortMarkRecipe, tableSortRecipe, tableStepRecipe, tableToolbarRecipe, tableValueRecipe };
+export { type TableAlign, type TableFilterKind, tableActionsCellRecipe, tableActionsWidth, tableAnatomy, tableAppliedRecipe, tableBodyRecipe, tableCardRecipe, tableCellRecipe, tableDetailBodyRecipe, tableDetailRecipe, tableEmptyHintRecipe, tableEmptyRecipe, tableEmptyTitleRecipe, tableExpandIconRecipe, tableExpandRecipe, tableFilterMarkRecipe, tableFilterRecipe, tableGridRecipe, tableGroupRecipe, tableHeadCellRecipe, tableHeadRowRecipe, tableHeadingRecipe, tableMarkRecipe, tablePinWidth, tableRankRecipe, tableRecipe, tableRowRecipe, tableRuleRecipe, tableScrollRecipe, tableSearchRecipe, tableSelectCellRecipe, tableSelectionActionsRecipe, tableSelectionCountRecipe, tableSelectionRecipe, tableSkeletonBarRecipe, tableSkeletonMarkRecipe, tableSortIconRecipe, tableSortLabelRecipe, tableSortMarkRecipe, tableSortRecipe, tableStepRecipe, tableToolbarRecipe, tableValueRecipe };
 //# sourceMappingURL=table.d.ts.map

package/dist/recipes/table.js

@@ -1,8 +1,10 @@
-import { toneTint } from "../tone.js";
+import { anatomy } from "../anatomy.js";
 import { controlInert, controlPress, controlQuietIcon, controlReach } from "../parts/control.js";
 import { ruleFading } from "../parts/rule.js";
+import { toneTint } from "../tone.js";
 import { eyebrowQuiet, eyebrowType } from "../parts/eyebrow.js";
 import { revealedControl, revealedIcon, shownControl, shownIcon } from "../parts/reveal.js";
+import { tableFilterRuleRecipe } from "./tableFilter.js";
 import { cva } from "class-variance-authority";
 //#region src/recipes/table.ts
 const defaultTableAlign = "start";
@@ -176,7 +178,59 @@ const tableSkeletonMarkRecipe = cva("size-tf-icon-lg flex-none tf-breathing roun
 const tableEmptyRecipe = cva("flex flex-col items-center gap-2 px-6 py-14 text-center");
 const tableEmptyTitleRecipe = cva("font-tf-display text-tf-h4 font-bold tracking-tf-tight text-tf-fg");
 const tableEmptyHintRecipe = cva("text-tf-body-sm font-medium text-tf-muted");
+const tableAnatomy = anatomy({
+	bar: {
+		part: "bar",
+		recipe: tableSkeletonBarRecipe,
+		required: false
+	},
+	filterRule: {
+		part: "filter-rule",
+		recipe: tableFilterRuleRecipe,
+		required: true
+	},
+	head: {
+		part: "head",
+		recipe: tableHeadCellRecipe,
+		required: true
+	},
+	mark: {
+		part: "mark",
+		recipe: tableSortMarkRecipe,
+		required: false
+	},
+	rank: {
+		part: "rank",
+		recipe: tableRankRecipe,
+		required: false
+	},
+	root: {
+		part: "table",
+		recipe: tableRecipe,
+		required: true
+	},
+	rule: {
+		part: "rule",
+		recipe: tableRuleRecipe,
+		required: true
+	},
+	ruled: {
+		part: "ruled",
+		recipe: tableGroupRecipe,
+		required: true
+	},
+	tableFilter: {
+		part: "table-filter",
+		recipe: tableFilterRecipe,
+		required: false
+	},
+	toolbar: {
+		part: "table-toolbar",
+		recipe: tableToolbarRecipe,
+		required: false
+	}
+});
 //#endregion
-export { tableActionsCellRecipe, tableActionsWidth, tableAppliedRecipe, tableBodyRecipe, tableCardRecipe, tableCellRecipe, tableDetailBodyRecipe, tableDetailRecipe, tableEmptyHintRecipe, tableEmptyRecipe, tableEmptyTitleRecipe, tableExpandIconRecipe, tableExpandRecipe, tableFilterMarkRecipe, tableFilterRecipe, tableGridRecipe, tableGroupRecipe, tableHeadCellRecipe, tableHeadRowRecipe, tableHeadingRecipe, tableMarkRecipe, tablePinWidth, tableRankRecipe, tableRecipe, tableRowRecipe, tableRuleRecipe, tableScrollRecipe, tableSearchRecipe, tableSelectCellRecipe, tableSelectionActionsRecipe, tableSelectionCountRecipe, tableSelectionRecipe, tableSkeletonBarRecipe, tableSkeletonMarkRecipe, tableSortIconRecipe, tableSortLabelRecipe, tableSortMarkRecipe, tableSortRecipe, tableStepRecipe, tableToolbarRecipe, tableValueRecipe };
+export { tableActionsCellRecipe, tableActionsWidth, tableAnatomy, tableAppliedRecipe, tableBodyRecipe, tableCardRecipe, tableCellRecipe, tableDetailBodyRecipe, tableDetailRecipe, tableEmptyHintRecipe, tableEmptyRecipe, tableEmptyTitleRecipe, tableExpandIconRecipe, tableExpandRecipe, tableFilterMarkRecipe, tableFilterRecipe, tableGridRecipe, tableGroupRecipe, tableHeadCellRecipe, tableHeadRowRecipe, tableHeadingRecipe, tableMarkRecipe, tablePinWidth, tableRankRecipe, tableRecipe, tableRowRecipe, tableRuleRecipe, tableScrollRecipe, tableSearchRecipe, tableSelectCellRecipe, tableSelectionActionsRecipe, tableSelectionCountRecipe, tableSelectionRecipe, tableSkeletonBarRecipe, tableSkeletonMarkRecipe, tableSortIconRecipe, tableSortLabelRecipe, tableSortMarkRecipe, tableSortRecipe, tableStepRecipe, tableToolbarRecipe, tableValueRecipe };
 
 //# sourceMappingURL=table.js.map

package/dist/recipes/table.js.map

@@ -1 +1 @@
-{"version":3,"file":"table.js","names":[],"sources":["../../src/recipes/table.ts"],"sourcesContent":["import { cva } from 'class-variance-authority'\n\nimport { controlInert, controlPress, controlQuietIcon, controlReach } from '#parts/control'\nimport { eyebrowQuiet, eyebrowType } from '#parts/eyebrow'\nimport { revealedControl, revealedIcon, shownControl, shownIcon } from '#parts/reveal'\nimport { ruleFading } from '#parts/rule'\nimport { toneTint } from '#tone'\n\ntype TableAlign = 'start' | 'end'\n\ntype TableFilterKind = 'text' | 'enum' | 'range'\n\nconst defaultTableAlign = 'start' satisfies TableAlign\n\nconst TIGHT = [\n  'flex size-tf-control-2xs flex-none items-center justify-center rounded-tf-inline',\n  'tf-icons [&_svg]:size-tf-icon-2xs [&_svg]:shrink-0',\n  'cursor-pointer tf-transition motion-reduce:transition-none',\n  'interactive:hovered:bg-tf-panel-hi interactive:hovered:text-tf-fg',\n  ...controlReach,\n  ...controlInert,\n]\n\nconst CELL = 'flex min-w-0 items-center px-4'\n\nconst tablePinWidth = 52\n\nconst tableActionsWidth = 160\n\nconst tableRecipe = cva('flex w-full min-w-0 flex-col gap-8 font-tf-body')\n\nconst tableToolbarRecipe = cva('flex flex-wrap items-center gap-3')\n\nconst tableSearchRecipe = cva('max-w-tf-panel flex-none')\n\nconst tableAppliedRecipe = cva('flex flex-1 flex-wrap items-center justify-end gap-2')\n\nconst tableSelectionRecipe = cva([\n  'flex flex-wrap items-center gap-4 rounded-tf-control bg-tf-accent-tint px-4 py-3',\n  'animate-tf-in motion-reduce:animate-none',\n])\n\nconst tableSelectionCountRecipe = cva('text-tf-body-sm font-medium text-tf-accent-hi')\n\nconst tableSelectionActionsRecipe = cva('ml-auto flex flex-wrap items-center gap-2')\n\nconst tableCardRecipe = cva('relative isolate rounded-tf-card', {\n  defaultVariants: { bordered: true },\n  variants: {\n    bordered: {\n      false: '',\n      true: 'tf-edge-sweep tf-swept blend-tf-accent tf-edge-plain',\n    },\n  },\n})\n\nconst tableScrollRecipe = cva([\n  'tf-scroll-thin overflow-x-auto rounded-tf-card',\n  'tf-resizes motion-reduce:transition-none',\n])\n\nconst tableGridRecipe = cva('overflow-x-clip text-tf-body-sm font-medium text-tf-fg')\n\nconst tableHeadRowRecipe = cva('grid h-tf-control-md')\n\nconst tableHeadCellRecipe = cva([CELL, 'gap-1 whitespace-nowrap'], {\n  defaultVariants: { align: defaultTableAlign },\n  variants: {\n    align: {\n      end: 'justify-end',\n      start: '',\n    } satisfies Record<TableAlign, string>,\n  },\n})\n\nconst tableHeadingRecipe = cva([`flex-none text-tf-caption ${eyebrowQuiet}`])\n\nconst tableSortRecipe = cva(\n  [\n    '-ml-2 flex h-tf-row min-w-0 items-center gap-2 rounded-tf-inline px-2',\n    `text-tf-caption ${eyebrowType}`,\n    'tf-icons [&_svg]:size-tf-icon-2xs [&_svg]:shrink-0',\n    'cursor-pointer tf-transition motion-reduce:transition-none',\n    'interactive:hovered:bg-tf-panel-hi interactive:hovered:text-tf-fg',\n    ...controlReach,\n    ...controlPress,\n    ...controlInert,\n  ],\n  {\n    defaultVariants: { sorted: false },\n    variants: {\n      sorted: { false: 'text-tf-muted', true: 'text-tf-accent-hi' },\n    },\n  },\n)\n\nconst tableSortLabelRecipe = cva('min-w-0 truncate')\n\nconst tableSortIconRecipe = cva('tf-transition motion-reduce:transition-none', {\n  defaultVariants: { descending: false },\n  variants: {\n    descending: { false: '', true: 'rotate-180' },\n  },\n})\n\nconst tableSortMarkRecipe = cva('', {\n  defaultVariants: { sorted: false },\n  variants: {\n    sorted: { false: revealedIcon, true: shownIcon },\n  },\n})\n\nconst tableFilterMarkRecipe = cva('', {\n  defaultVariants: { on: false },\n  variants: {\n    on: { false: revealedControl, true: shownControl },\n  },\n})\n\nconst tableRankRecipe = cva([\n  'flex-none rounded-tf-pill bg-tf-accent-tint px-1.5',\n  'text-tf-caption-sm font-normal text-tf-accent-hi tabular-nums',\n])\n\nconst tableFilterRecipe = cva(TIGHT, {\n  defaultVariants: { on: false },\n  variants: {\n    on: { false: 'text-tf-muted', true: 'bg-tf-accent-tint text-tf-accent-hi' },\n  },\n})\n\nconst tableRuleRecipe = cva(`block ${ruleFading}`)\n\nconst PAGING = [\n  'data-[going=forward]:[--tf-page-from:calc(var(--spacing)*4)]',\n  'data-[going=back]:[--tf-page-from:calc(var(--spacing)*-4)]',\n  'data-[step=a]:motion-safe:animate-tf-page',\n  'data-[step=b]:motion-safe:animate-tf-page-again',\n]\n\nconst tableBodyRecipe = cva(PAGING)\n\nconst tableGroupRecipe = cva('border-b border-tf-line-2 last:border-b-0')\n\nconst A_WASH_OVER_WHATEVER_IS_THERE = [\n  'relative',\n  \"before:pointer-events-none before:absolute before:inset-0 before:content-['']\",\n  'before:tf-transition before:motion-reduce:transition-none',\n  'not-data-selected:hovered:before:bg-tf-panel-2',\n  'data-selected:before:bg-tf-accent-tint',\n]\n\nconst tableRowRecipe = cva(\n  ['grid tf-transition motion-reduce:transition-none', ...A_WASH_OVER_WHATEVER_IS_THERE],\n  {\n    defaultVariants: { accent: 'none', dense: false },\n    variants: {\n      accent: { ...toneTint, none: '' },\n      dense: { false: 'h-tf-control-lg', true: 'h-tf-control-md' },\n    },\n  },\n)\n\nconst tableSelectCellRecipe = cva('flex items-center justify-center')\n\nconst tableMarkRecipe = cva('flex')\n\nconst tableCellRecipe = cva([CELL, 'gap-3'], {\n  defaultVariants: { align: defaultTableAlign, mono: false, tabular: false },\n  variants: {\n    align: {\n      end: 'justify-end text-right',\n      start: '',\n    } satisfies Record<TableAlign, string>,\n    mono: { false: '', true: 'font-mono' },\n    tabular: { false: '', true: 'whitespace-nowrap tabular-nums' },\n  },\n})\n\nconst tableValueRecipe = cva('min-w-0 truncate')\n\nconst tableExpandRecipe = cva(TIGHT, {\n  defaultVariants: { open: false },\n  variants: {\n    open: { false: 'text-tf-muted', true: 'text-tf-accent-hi' },\n  },\n})\n\nconst tableExpandIconRecipe = cva('tf-transition motion-reduce:transition-none', {\n  defaultVariants: { open: false },\n  variants: {\n    open: { false: '', true: 'rotate-90' },\n  },\n})\n\nconst tableActionsCellRecipe = cva([\n  'sticky right-0 flex items-center justify-end gap-2 pr-3 pl-6',\n  'backdrop-blur-tf-panel in-data-turning:bg-tf-surface-quiet',\n  'before:absolute before:inset-y-0 before:left-0 before:w-tf-hairline before:bg-tf-line-2',\n  \"before:content-['']\",\n])\n\nconst tableStepRecipe = cva(controlQuietIcon)\n\nconst tableDetailRecipe = cva('tf-unfolds bg-tf-sunken-hi motion-reduce:transition-none')\n\nconst tableDetailBodyRecipe = cva([\n  'py-5 pr-6 pl-16',\n  'animate-tf-fade-in motion-reduce:animate-none',\n])\n\nconst tableSkeletonBarRecipe = cva('h-3 tf-breathing rounded-tf-pill bg-tf-panel', {\n  defaultVariants: { numeric: false },\n  variants: {\n    numeric: { false: 'w-3/5', true: 'w-2/5' },\n  },\n})\n\nconst tableSkeletonMarkRecipe = cva(\n  'size-tf-icon-lg flex-none tf-breathing rounded-tf-inline bg-tf-panel',\n)\n\nconst tableEmptyRecipe = cva('flex flex-col items-center gap-2 px-6 py-14 text-center')\n\nconst tableEmptyTitleRecipe = cva(\n  'font-tf-display text-tf-h4 font-bold tracking-tf-tight text-tf-fg',\n)\n\nconst tableEmptyHintRecipe = cva('text-tf-body-sm font-medium text-tf-muted')\n\nexport {\n  type TableAlign,\n  type TableFilterKind,\n  tableActionsCellRecipe,\n  tableActionsWidth,\n  tableAppliedRecipe,\n  tableBodyRecipe,\n  tableCardRecipe,\n  tableCellRecipe,\n  tableDetailBodyRecipe,\n  tableDetailRecipe,\n  tableEmptyHintRecipe,\n  tableEmptyRecipe,\n  tableEmptyTitleRecipe,\n  tableExpandIconRecipe,\n  tableExpandRecipe,\n  tableFilterRecipe,\n  tableGridRecipe,\n  tableGroupRecipe,\n  tableHeadCellRecipe,\n  tableHeadRowRecipe,\n  tableHeadingRecipe,\n  tableMarkRecipe,\n  tablePinWidth,\n  tableRecipe,\n  tableRowRecipe,\n  tableRuleRecipe,\n  tableScrollRecipe,\n  tableSearchRecipe,\n  tableSelectCellRecipe,\n  tableSelectionActionsRecipe,\n  tableSelectionCountRecipe,\n  tableSelectionRecipe,\n  tableSkeletonBarRecipe,\n  tableSkeletonMarkRecipe,\n  tableFilterMarkRecipe,\n  tableRankRecipe,\n  tableSortIconRecipe,\n  tableSortMarkRecipe,\n  tableSortLabelRecipe,\n  tableSortRecipe,\n  tableStepRecipe,\n  tableToolbarRecipe,\n  tableValueRecipe,\n}\n"],"mappings":"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"}
+{"version":3,"file":"table.js","names":[],"sources":["../../src/recipes/table.ts"],"sourcesContent":["import { cva } from 'class-variance-authority'\n\nimport { anatomy } from '#anatomy'\nimport { controlInert, controlPress, controlQuietIcon, controlReach } from '#parts/control'\nimport { eyebrowQuiet, eyebrowType } from '#parts/eyebrow'\nimport { revealedControl, revealedIcon, shownControl, shownIcon } from '#parts/reveal'\nimport { ruleFading } from '#parts/rule'\nimport { toneTint } from '#tone'\n\nimport { tableFilterRuleRecipe } from './tableFilter'\n\ntype TableAlign = 'start' | 'end'\n\ntype TableFilterKind = 'text' | 'enum' | 'range'\n\nconst defaultTableAlign = 'start' satisfies TableAlign\n\nconst TIGHT = [\n  'flex size-tf-control-2xs flex-none items-center justify-center rounded-tf-inline',\n  'tf-icons [&_svg]:size-tf-icon-2xs [&_svg]:shrink-0',\n  'cursor-pointer tf-transition motion-reduce:transition-none',\n  'interactive:hovered:bg-tf-panel-hi interactive:hovered:text-tf-fg',\n  ...controlReach,\n  ...controlInert,\n]\n\nconst CELL = 'flex min-w-0 items-center px-4'\n\nconst tablePinWidth = 52\n\nconst tableActionsWidth = 160\n\nconst tableRecipe = cva('flex w-full min-w-0 flex-col gap-8 font-tf-body')\n\nconst tableToolbarRecipe = cva('flex flex-wrap items-center gap-3')\n\nconst tableSearchRecipe = cva('max-w-tf-panel flex-none')\n\nconst tableAppliedRecipe = cva('flex flex-1 flex-wrap items-center justify-end gap-2')\n\nconst tableSelectionRecipe = cva([\n  'flex flex-wrap items-center gap-4 rounded-tf-control bg-tf-accent-tint px-4 py-3',\n  'animate-tf-in motion-reduce:animate-none',\n])\n\nconst tableSelectionCountRecipe = cva('text-tf-body-sm font-medium text-tf-accent-hi')\n\nconst tableSelectionActionsRecipe = cva('ml-auto flex flex-wrap items-center gap-2')\n\nconst tableCardRecipe = cva('relative isolate rounded-tf-card', {\n  defaultVariants: { bordered: true },\n  variants: {\n    bordered: {\n      false: '',\n      true: 'tf-edge-sweep tf-swept blend-tf-accent tf-edge-plain',\n    },\n  },\n})\n\nconst tableScrollRecipe = cva([\n  'tf-scroll-thin overflow-x-auto rounded-tf-card',\n  'tf-resizes motion-reduce:transition-none',\n])\n\nconst tableGridRecipe = cva('overflow-x-clip text-tf-body-sm font-medium text-tf-fg')\n\nconst tableHeadRowRecipe = cva('grid h-tf-control-md')\n\nconst tableHeadCellRecipe = cva([CELL, 'gap-1 whitespace-nowrap'], {\n  defaultVariants: { align: defaultTableAlign },\n  variants: {\n    align: {\n      end: 'justify-end',\n      start: '',\n    } satisfies Record<TableAlign, string>,\n  },\n})\n\nconst tableHeadingRecipe = cva([`flex-none text-tf-caption ${eyebrowQuiet}`])\n\nconst tableSortRecipe = cva(\n  [\n    '-ml-2 flex h-tf-row min-w-0 items-center gap-2 rounded-tf-inline px-2',\n    `text-tf-caption ${eyebrowType}`,\n    'tf-icons [&_svg]:size-tf-icon-2xs [&_svg]:shrink-0',\n    'cursor-pointer tf-transition motion-reduce:transition-none',\n    'interactive:hovered:bg-tf-panel-hi interactive:hovered:text-tf-fg',\n    ...controlReach,\n    ...controlPress,\n    ...controlInert,\n  ],\n  {\n    defaultVariants: { sorted: false },\n    variants: {\n      sorted: { false: 'text-tf-muted', true: 'text-tf-accent-hi' },\n    },\n  },\n)\n\nconst tableSortLabelRecipe = cva('min-w-0 truncate')\n\nconst tableSortIconRecipe = cva('tf-transition motion-reduce:transition-none', {\n  defaultVariants: { descending: false },\n  variants: {\n    descending: { false: '', true: 'rotate-180' },\n  },\n})\n\nconst tableSortMarkRecipe = cva('', {\n  defaultVariants: { sorted: false },\n  variants: {\n    sorted: { false: revealedIcon, true: shownIcon },\n  },\n})\n\nconst tableFilterMarkRecipe = cva('', {\n  defaultVariants: { on: false },\n  variants: {\n    on: { false: revealedControl, true: shownControl },\n  },\n})\n\nconst tableRankRecipe = cva([\n  'flex-none rounded-tf-pill bg-tf-accent-tint px-1.5',\n  'text-tf-caption-sm font-normal text-tf-accent-hi tabular-nums',\n])\n\nconst tableFilterRecipe = cva(TIGHT, {\n  defaultVariants: { on: false },\n  variants: {\n    on: { false: 'text-tf-muted', true: 'bg-tf-accent-tint text-tf-accent-hi' },\n  },\n})\n\nconst tableRuleRecipe = cva(`block ${ruleFading}`)\n\nconst PAGING = [\n  'data-[going=forward]:[--tf-page-from:calc(var(--spacing)*4)]',\n  'data-[going=back]:[--tf-page-from:calc(var(--spacing)*-4)]',\n  'data-[step=a]:motion-safe:animate-tf-page',\n  'data-[step=b]:motion-safe:animate-tf-page-again',\n]\n\nconst tableBodyRecipe = cva(PAGING)\n\nconst tableGroupRecipe = cva('border-b border-tf-line-2 last:border-b-0')\n\nconst A_WASH_OVER_WHATEVER_IS_THERE = [\n  'relative',\n  \"before:pointer-events-none before:absolute before:inset-0 before:content-['']\",\n  'before:tf-transition before:motion-reduce:transition-none',\n  'not-data-selected:hovered:before:bg-tf-panel-2',\n  'data-selected:before:bg-tf-accent-tint',\n]\n\nconst tableRowRecipe = cva(\n  ['grid tf-transition motion-reduce:transition-none', ...A_WASH_OVER_WHATEVER_IS_THERE],\n  {\n    defaultVariants: { accent: 'none', dense: false },\n    variants: {\n      accent: { ...toneTint, none: '' },\n      dense: { false: 'h-tf-control-lg', true: 'h-tf-control-md' },\n    },\n  },\n)\n\nconst tableSelectCellRecipe = cva('flex items-center justify-center')\n\nconst tableMarkRecipe = cva('flex')\n\nconst tableCellRecipe = cva([CELL, 'gap-3'], {\n  defaultVariants: { align: defaultTableAlign, mono: false, tabular: false },\n  variants: {\n    align: {\n      end: 'justify-end text-right',\n      start: '',\n    } satisfies Record<TableAlign, string>,\n    mono: { false: '', true: 'font-mono' },\n    tabular: { false: '', true: 'whitespace-nowrap tabular-nums' },\n  },\n})\n\nconst tableValueRecipe = cva('min-w-0 truncate')\n\nconst tableExpandRecipe = cva(TIGHT, {\n  defaultVariants: { open: false },\n  variants: {\n    open: { false: 'text-tf-muted', true: 'text-tf-accent-hi' },\n  },\n})\n\nconst tableExpandIconRecipe = cva('tf-transition motion-reduce:transition-none', {\n  defaultVariants: { open: false },\n  variants: {\n    open: { false: '', true: 'rotate-90' },\n  },\n})\n\nconst tableActionsCellRecipe = cva([\n  'sticky right-0 flex items-center justify-end gap-2 pr-3 pl-6',\n  'backdrop-blur-tf-panel in-data-turning:bg-tf-surface-quiet',\n  'before:absolute before:inset-y-0 before:left-0 before:w-tf-hairline before:bg-tf-line-2',\n  \"before:content-['']\",\n])\n\nconst tableStepRecipe = cva(controlQuietIcon)\n\nconst tableDetailRecipe = cva('tf-unfolds bg-tf-sunken-hi motion-reduce:transition-none')\n\nconst tableDetailBodyRecipe = cva([\n  'py-5 pr-6 pl-16',\n  'animate-tf-fade-in motion-reduce:animate-none',\n])\n\nconst tableSkeletonBarRecipe = cva('h-3 tf-breathing rounded-tf-pill bg-tf-panel', {\n  defaultVariants: { numeric: false },\n  variants: {\n    numeric: { false: 'w-3/5', true: 'w-2/5' },\n  },\n})\n\nconst tableSkeletonMarkRecipe = cva(\n  'size-tf-icon-lg flex-none tf-breathing rounded-tf-inline bg-tf-panel',\n)\n\nconst tableEmptyRecipe = cva('flex flex-col items-center gap-2 px-6 py-14 text-center')\n\nconst tableEmptyTitleRecipe = cva(\n  'font-tf-display text-tf-h4 font-bold tracking-tf-tight text-tf-fg',\n)\n\nconst tableEmptyHintRecipe = cva('text-tf-body-sm font-medium text-tf-muted')\n\nconst tableAnatomy = anatomy({\n  bar: { part: 'bar', recipe: tableSkeletonBarRecipe, required: false },\n  filterRule: { part: 'filter-rule', recipe: tableFilterRuleRecipe, required: true },\n  head: { part: 'head', recipe: tableHeadCellRecipe, required: true },\n  mark: { part: 'mark', recipe: tableSortMarkRecipe, required: false },\n  rank: { part: 'rank', recipe: tableRankRecipe, required: false },\n  root: { part: 'table', recipe: tableRecipe, required: true },\n  rule: { part: 'rule', recipe: tableRuleRecipe, required: true },\n  ruled: { part: 'ruled', recipe: tableGroupRecipe, required: true },\n  tableFilter: { part: 'table-filter', recipe: tableFilterRecipe, required: false },\n  toolbar: { part: 'table-toolbar', recipe: tableToolbarRecipe, required: false },\n})\n\nexport {\n  type TableAlign,\n  type TableFilterKind,\n  tableAnatomy,\n  tableActionsCellRecipe,\n  tableActionsWidth,\n  tableAppliedRecipe,\n  tableBodyRecipe,\n  tableCardRecipe,\n  tableCellRecipe,\n  tableDetailBodyRecipe,\n  tableDetailRecipe,\n  tableEmptyHintRecipe,\n  tableEmptyRecipe,\n  tableEmptyTitleRecipe,\n  tableExpandIconRecipe,\n  tableExpandRecipe,\n  tableFilterRecipe,\n  tableGridRecipe,\n  tableGroupRecipe,\n  tableHeadCellRecipe,\n  tableHeadRowRecipe,\n  tableHeadingRecipe,\n  tableMarkRecipe,\n  tablePinWidth,\n  tableRecipe,\n  tableRowRecipe,\n  tableRuleRecipe,\n  tableScrollRecipe,\n  tableSearchRecipe,\n  tableSelectCellRecipe,\n  tableSelectionActionsRecipe,\n  tableSelectionCountRecipe,\n  tableSelectionRecipe,\n  tableSkeletonBarRecipe,\n  tableSkeletonMarkRecipe,\n  tableFilterMarkRecipe,\n  tableRankRecipe,\n  tableSortIconRecipe,\n  tableSortMarkRecipe,\n  tableSortLabelRecipe,\n  tableSortRecipe,\n  tableStepRecipe,\n  tableToolbarRecipe,\n  tableValueRecipe,\n}\n"],"mappings":"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"}