@keboola/design 11.0.0 → 11.0.1

package/dist/charts.js.map

@@ -1 +1 @@
-{"version":3,"sources":["../src/blocks/Charts/ChartContainer.tsx","../src/blocks/Charts/ChartTooltip.tsx","../src/blocks/Charts/format.ts","../src/blocks/Charts/cartesian.tsx","../src/blocks/Charts/theme.ts","../src/blocks/Charts/LineChart.tsx","../src/blocks/Charts/BarChart.tsx","../src/blocks/Charts/AreaChart.tsx","../src/blocks/Charts/PieChart.tsx"],"names":["jsx","RechartsTooltip","jsxs","RechartsLineChart","RechartsBarChart","RechartsAreaChart","RechartsPieChart","Legend"],"mappings":";;;;;;;;;AA2BO,IAAM,iBAAiB,CAAC;AAAA,EAC7B,MAAA,GAAS,GAAA;AAAA,EACT,KAAA,GAAQ,MAAA;AAAA,EACR,SAAA;AAAA,EACA,QAAA;AAAA,EACA,GAAG;AACL,CAAA,qBACE,GAAA;AAAA,EAAC,KAAA;AAAA,EAAA;AAAA,IACC,SAAA,EAAW,EAAA;AAAA,MACT,YAAA;AAAA;AAAA,MAEA,iEAAA;AAAA,MACA,mEAAA;AAAA,MACA,8CAAA;AAAA,MACA,0DAAA;AAAA;AAAA,MAEA,uDAAA;AAAA,MACA,oDAAA;AAAA,MACA,yDAAA;AAAA,MACA,8DAAA;AAAA,MACA,kEAAA;AAAA,MACA,yCAAA;AAAA,MACA;AAAA,KACF;AAAA,IACC,GAAG,KAAA;AAAA,IAEJ,QAAA,kBAAA,GAAA,CAAC,mBAAA,EAAA,EAAoB,KAAA,EAAc,MAAA,EAChC,QAAA,EACH;AAAA;AACF;AC9BK,IAAM,sBAAsB,CAAC;AAAA,EAClC,MAAA;AAAA,EACA,KAAA;AAAA,EACA,OAAA;AAAA,EACA,cAAA;AAAA,EACA;AACF,CAAA,KAAgC;AAC9B,EAAA,IAAI,CAAC,MAAA,IAAU,CAAC,OAAA,EAAS,QAAQ,OAAO,IAAA;AAExC,EAAA,uBACE,IAAA;AAAA,IAAC,KAAA;AAAA,IAAA;AAAA,MACC,SAAA,EAAW,EAAA;AAAA,QACT,2IAAA;AAAA,QACA;AAAA,OACF;AAAA,MAEC,QAAA,EAAA;AAAA,QAAA,KAAA,IAAS,wBAAQA,GAAAA,CAAC,KAAA,EAAA,EAAI,SAAA,EAAU,0BAA0B,QAAA,EAAA,KAAA,EAAM,CAAA;AAAA,wBACjEA,IAAC,KAAA,EAAA,EAAI,SAAA,EAAU,gCACZ,QAAA,EAAA,OAAA,CAAQ,GAAA,CAAI,CAAC,KAAA,KAAU;AACtB,UAAA,MAAM,OAAO,MAAA,CAAO,KAAA,CAAM,IAAA,IAAQ,KAAA,CAAM,WAAW,EAAE,CAAA;AACrD,UAAA,MAAM,QAAQ,KAAA,CAAM,KAAA;AAGpB,UAAA,MAAM,SAAA,GAAY,SAAS,IAAA,IAAQ,KAAA,KAAU,MAAM,MAAA,CAAO,QAAA,CAAS,MAAA,CAAO,KAAK,CAAC,CAAA;AAChF,UAAA,MAAM,OAAA,GAAU,SAAA,GACZ,cAAA,GACE,cAAA,CAAe,OAAO,KAAK,CAAA,EAAG,IAAI,CAAA,GAClC,MAAA,CAAO,MAAA,CAAO,KAAK,CAAC,IACrB,KAAA,IAAS,EAAA;AACd,UAAA,uBACE,IAAA;AAAA,YAAC,KAAA;AAAA,YAAA;AAAA,cAEC,SAAA,EAAU,qDAAA;AAAA,cAEV,QAAA,EAAA;AAAA,gCAAA,IAAA,CAAC,MAAA,EAAA,EAAK,WAAU,oCAAA,EACd,QAAA,EAAA;AAAA,kCAAAA,GAAAA;AAAA,oBAAC,MAAA;AAAA,oBAAA;AAAA,sBACC,SAAA,EAAU,wCAAA;AAAA,sBACV,KAAA,EAAO,EAAE,eAAA,EAAiB,KAAA,CAAM,KAAA;AAAM;AAAA,mBACxC;AAAA,kCACAA,GAAAA,CAAC,MAAA,EAAA,EAAK,SAAA,EAAU,4BAA4B,QAAA,EAAA,IAAA,EAAK;AAAA,iBAAA,EACnD,CAAA;AAAA,gCACAA,GAAAA,CAAC,MAAA,EAAA,EAAK,SAAA,EAAU,kCAAkC,QAAA,EAAA,OAAA,EAAQ;AAAA;AAAA,aAAA;AAAA,YAVrD,MAAA,CAAO,KAAA,CAAM,OAAA,IAAW,IAAI;AAAA,WAWnC;AAAA,QAEJ,CAAC,CAAA,EACH;AAAA;AAAA;AAAA,GACF;AAEJ;AAUO,IAAM,eAAe,CAAC,EAAE,gBAAgB,GAAG,KAAA,uBAChDA,GAAAA;AAAA,EAACC,OAAA;AAAA,EAAA;AAAA,IACC,MAAA,EAAQ,EAAE,WAAA,EAAa,CAAA,EAAE;AAAA,IACzB,OAAA,kBAASD,GAAAA,CAAC,mBAAA,EAAA,EAAoB,cAAA,EAAgC,CAAA;AAAA,IAC7D,GAAG;AAAA;AACN;;;ACjFK,IAAM,WAAA,GAAc,CACzB,KAAA,EACA,cAAA,KACW;AACX,EAAA,IAAI,KAAA,IAAS,IAAA,IAAQ,KAAA,KAAU,EAAA,EAAI,OAAO,EAAA;AAC1C,EAAA,MAAM,GAAA,GAAM,OAAO,KAAK,CAAA;AACxB,EAAA,IAAI,CAAC,MAAA,CAAO,QAAA,CAAS,GAAG,GAAG,OAAO,EAAA;AAClC,EAAA,OAAO,cAAA,GAAiB,cAAA,CAAe,GAAG,CAAA,GAAI,OAAO,GAAG,CAAA;AAC1D,CAAA;ACVA,IAAM,UAAA,GAAa;AAAA,EACjB,QAAA,EAAU,KAAA;AAAA,EACV,QAAA,EAAU,KAAA;AAAA,EACV,IAAA,EAAM,EAAE,QAAA,EAAU,EAAA;AACpB,CAAA;AAOO,IAAM,kBAAkB,CAAC;AAAA,EAC9B,IAAA;AAAA,EACA,QAAA,GAAW,IAAA;AAAA,EACX,SAAA,GAAY,IAAA;AAAA,EACZ,UAAA,GAAa,KAAA;AAAA,EACb,WAAA,GAAc,IAAA;AAAA,EACd,cAAA;AAAA,EACA;AACF,CAAA,qBAIEE,KAAA,QAAA,EAAA,EACG,QAAA,EAAA;AAAA,EAAA,QAAA,oBAAYF,GAAAA,CAAC,aAAA,EAAA,EAAc,eAAA,EAAgB,KAAA,EAAM,UAAU,KAAA,EAAO,CAAA;AAAA,kBACnEA,GAAAA,CAAC,KAAA,EAAA,EAAM,OAAA,EAAS,IAAA,EAAO,GAAG,UAAA,EAAY,CAAA;AAAA,EAAA,CAKpC,SAAA,IAAa,OAAA,KAAY,MAAA,qBACzBA,GAAAA;AAAA,IAAC,KAAA;AAAA,IAAA;AAAA,MACC,MAAM,CAAC,SAAA;AAAA,MACP,MAAA,EAAQ,OAAA;AAAA,MACR,KAAA,EAAO,EAAA;AAAA,MACN,GAAG,UAAA;AAAA,MACJ,eACE,cAAA,GACI,CAAC,UAA2B,WAAA,CAAY,KAAA,EAAO,cAAc,CAAA,GAC7D;AAAA;AAAA,GAER;AAAA,EAED,+BACCA,GAAAA;AAAA,IAAC,YAAA;AAAA,IAAA;AAAA,MACC,gBAAgB,cAAA,GAAiB,CAAC,UAAU,WAAA,CAAY,KAAA,EAAO,cAAc,CAAA,GAAI;AAAA;AAAA,GACnF;AAAA,EAED,UAAA,oBAAcA,GAAAA,CAAC,MAAA,EAAA,EAAO,cAAc,EAAE,QAAA,EAAU,IAAG,EAAG;AAAA,CAAA,EACzD,CAAA;;;ACzCF,IAAM,iBAAA,GAAoB,CAAA;AASnB,IAAM,eAAA,GAAkB,CAAC,KAAA,KAA0B;AAGxD,EAAA,MAAM,IAAA,GAAA,CAAU,KAAA,GAAQ,iBAAA,GAAqB,iBAAA,IAAqB,iBAAA,GAAqB,CAAA;AACvF,EAAA,OAAO,mBAAmB,IAAI,CAAA,EAAA,CAAA;AAChC;AAGO,IAAM,kBAAA,GAAqB,CAAC,KAAA,EAAe,KAAA,KAChD,gBAAgB,KAAA,GAAQ,KAAA,GAAQ,IAAI,KAAK,CAAA;ACOpC,IAAM,YAAY,CAAC;AAAA,EACxB,IAAA;AAAA,EACA,IAAA;AAAA,EACA,MAAA;AAAA,EACA,MAAA;AAAA,EACA,KAAA;AAAA,EACA,SAAA;AAAA,EACA,GAAG;AACL,CAAA,qBACEA,IAAC,cAAA,EAAA,EAAe,MAAA,EAAgB,OAAc,SAAA,EAC5C,QAAA,kBAAAE,KAACC,WAAA,EAAA,EAAkB,IAAA,EAAY,QAAQ,EAAE,GAAA,EAAK,GAAG,KAAA,EAAO,CAAA,EAAG,MAAM,CAAA,EAAG,MAAA,EAAQ,GAAE,EAC3E,QAAA,EAAA;AAAA,EAAA,eAAA,CAAgB,EAAE,IAAA,EAAM,GAAG,MAAA,EAAQ,CAAA;AAAA,EACnC,MAAA,CAAO,GAAA,CAAI,CAAC,CAAA,EAAG,KAAA,KAAU;AACxB,IAAA,MAAM,KAAA,GAAQ,kBAAA,CAAmB,KAAA,EAAO,CAAA,CAAE,KAAK,CAAA;AAC/C,IAAA,uBACEH,GAAAA;AAAA,MAAC,IAAA;AAAA,MAAA;AAAA,QAEC,IAAA,EAAK,UAAA;AAAA,QACL,SAAS,CAAA,CAAE,OAAA;AAAA,QACX,IAAA,EAAM,CAAA,CAAE,IAAA,IAAQ,CAAA,CAAE,OAAA;AAAA,QAClB,MAAA,EAAQ,KAAA;AAAA,QACR,WAAA,EAAa,CAAA;AAAA,QACb,KAAK,EAAE,CAAA,EAAG,GAAG,IAAA,EAAM,KAAA,EAAO,QAAQ,KAAA,EAAM;AAAA,QACxC,SAAA,EAAW,EAAE,CAAA,EAAG,CAAA,EAAE;AAAA,QAClB,iBAAA,EAAmB;AAAA,OAAA;AAAA,MARd,CAAA,CAAE;AAAA,KAST;AAAA,EAEJ,CAAC;AAAA,CAAA,EACH,CAAA,EACF;AC/CK,IAAM,WAAW,CAAC;AAAA,EACvB,IAAA;AAAA,EACA,IAAA;AAAA,EACA,MAAA;AAAA,EACA,MAAA;AAAA,EACA,KAAA;AAAA,EACA,SAAA;AAAA,EACA,OAAA,GAAU,KAAA;AAAA,EACV,GAAG;AACL,CAAA,qBACEA,IAAC,cAAA,EAAA,EAAe,MAAA,EAAgB,OAAc,SAAA,EAC5C,QAAA,kBAAAE,KAACE,UAAA,EAAA,EAAiB,IAAA,EAAY,QAAQ,EAAE,GAAA,EAAK,GAAG,KAAA,EAAO,CAAA,EAAG,MAAM,CAAA,EAAG,MAAA,EAAQ,GAAE,EAC1E,QAAA,EAAA;AAAA,EAAA,eAAA,CAAgB,EAAE,IAAA,EAAM,GAAG,MAAA,EAAQ,CAAA;AAAA,EACnC,MAAA,CAAO,GAAA,CAAI,CAAC,CAAA,EAAG,0BACdJ,GAAAA;AAAA,IAAC,GAAA;AAAA,IAAA;AAAA,MAEC,SAAS,CAAA,CAAE,OAAA;AAAA,MACX,IAAA,EAAM,CAAA,CAAE,IAAA,IAAQ,CAAA,CAAE,OAAA;AAAA,MAClB,IAAA,EAAM,kBAAA,CAAmB,KAAA,EAAO,CAAA,CAAE,KAAK,CAAA;AAAA,MACvC,QAAQ,OAAA,GAAU,CAAA,GAAI,CAAC,CAAA,EAAG,CAAA,EAAG,GAAG,CAAC,CAAA;AAAA,MACjC,OAAA,EAAS,UAAU,OAAA,GAAU,MAAA;AAAA,MAC7B,iBAAA,EAAmB;AAAA,KAAA;AAAA,IANd,CAAA,CAAE;AAAA,GAQV;AAAA,CAAA,EACH,CAAA,EACF;ACxBK,IAAM,YAAY,CAAC;AAAA,EACxB,IAAA;AAAA,EACA,IAAA;AAAA,EACA,MAAA;AAAA,EACA,MAAA;AAAA,EACA,KAAA;AAAA,EACA,SAAA;AAAA,EACA,OAAA,GAAU,KAAA;AAAA,EACV,GAAG;AACL,CAAA,qBACEA,IAAC,cAAA,EAAA,EAAe,MAAA,EAAgB,OAAc,SAAA,EAC5C,QAAA,kBAAAE,KAACG,WAAA,EAAA,EAAkB,IAAA,EAAY,QAAQ,EAAE,GAAA,EAAK,GAAG,KAAA,EAAO,CAAA,EAAG,MAAM,CAAA,EAAG,MAAA,EAAQ,GAAE,EAC3E,QAAA,EAAA;AAAA,EAAA,eAAA,CAAgB,EAAE,IAAA,EAAM,GAAG,MAAA,EAAQ,CAAA;AAAA,EACnC,MAAA,CAAO,GAAA,CAAI,CAAC,CAAA,EAAG,KAAA,KAAU;AACxB,IAAA,MAAM,KAAA,GAAQ,kBAAA,CAAmB,KAAA,EAAO,CAAA,CAAE,KAAK,CAAA;AAC/C,IAAA,uBACEL,GAAAA;AAAA,MAAC,IAAA;AAAA,MAAA;AAAA,QAEC,IAAA,EAAK,UAAA;AAAA,QACL,SAAS,CAAA,CAAE,OAAA;AAAA,QACX,IAAA,EAAM,CAAA,CAAE,IAAA,IAAQ,CAAA,CAAE,OAAA;AAAA,QAClB,MAAA,EAAQ,KAAA;AAAA,QACR,IAAA,EAAM,KAAA;AAAA,QACN,WAAA,EAAa,IAAA;AAAA,QACb,WAAA,EAAa,CAAA;AAAA,QACb,OAAA,EAAS,UAAU,OAAA,GAAU,MAAA;AAAA,QAC7B,iBAAA,EAAmB;AAAA,OAAA;AAAA,MATd,CAAA,CAAE;AAAA,KAUT;AAAA,EAEJ,CAAC;AAAA,CAAA,EACH,CAAA,EACF;ACdK,IAAM,WAAW,CAAC;AAAA,EACvB,IAAA;AAAA,EACA,OAAA;AAAA,EACA,OAAA;AAAA,EACA,WAAA,GAAc,CAAA;AAAA,EACd,MAAA;AAAA,EACA,KAAA;AAAA,EACA,SAAA;AAAA,EACA,UAAA,GAAa,IAAA;AAAA,EACb,WAAA,GAAc,IAAA;AAAA,EACd;AACF,CAAA,qBACEA,IAAC,cAAA,EAAA,EAAe,MAAA,EAAgB,OAAc,SAAA,EAC5C,QAAA,kBAAAE,KAACI,UAAA,EAAA,EACE,QAAA,EAAA;AAAA,EAAA,WAAA,oBACCN,GAAAA;AAAA,IAAC,YAAA;AAAA,IAAA;AAAA,MACC,gBACE,cAAA,GAAiB,CAAC,UAAU,WAAA,CAAY,KAAA,EAAO,cAAc,CAAA,GAAI;AAAA;AAAA,GAErE;AAAA,EAED,UAAA,oBAAcA,GAAAA,CAACO,MAAAA,EAAA,EAAO,YAAA,EAAc,EAAE,QAAA,EAAU,EAAA,EAAG,EAAG,CAAA;AAAA,kBACvDP,GAAAA;AAAA,IAAC,GAAA;AAAA,IAAA;AAAA,MACC,IAAA;AAAA,MACA,OAAA;AAAA,MACA,OAAA;AAAA,MACA,WAAA;AAAA,MAGA,MAAA,EAAO,wBAAA;AAAA,MACP,iBAAA,EAAmB,KAAA;AAAA,MAElB,eAAK,GAAA,CAAI,CAAC,OAAO,KAAA,qBAChBA,IAAC,IAAA,EAAA,EAA2C,IAAA,EAAM,eAAA,CAAgB,KAAK,KAA5D,MAAA,CAAO,KAAA,CAAM,OAAO,CAAA,IAAK,KAAK,CAAiC,CAC3E;AAAA;AAAA;AACH,CAAA,EACF,CAAA,EACF","file":"charts.js","sourcesContent":["import { type ComponentProps, type ReactElement } from 'react';\nimport { ResponsiveContainer } from 'recharts';\n\nimport { cn } from '../../utils';\n\n/** A length that recharts' `<ResponsiveContainer>` accepts: px number or `\"NN%\"`. */\nexport type ChartDimension = number | `${number}%`;\n\nexport type ChartContainerProps = Omit<ComponentProps<'div'>, 'children'> & {\n  /**\n   * Height as a px number or percentage string. Charts have no intrinsic\n   * height, so a container needs one either here or from a sized ancestor.\n   * Defaults to 300.\n   */\n  height?: ChartDimension;\n  /** Width as a px number or percentage. Defaults to `\"100%\"` (fills parent). */\n  width?: ChartDimension;\n  /** A single recharts chart element (`<LineChart>`, `<BarChart>`, …). */\n  children: ReactElement;\n};\n\n/**\n * Responsive, brand-themed frame for a chart. Wraps the chart in recharts'\n * `<ResponsiveContainer>` and applies the semantic-token chrome (axis text,\n * grid, cursor) through CSS so every chart inside inherits it. Sizing is\n * intrinsic: give it a `height` (default 300) and it fills the parent width.\n */\nexport const ChartContainer = ({\n  height = 300,\n  width = '100%',\n  className,\n  children,\n  ...props\n}: ChartContainerProps) => (\n  <div\n    className={cn(\n      'tw:text-xs',\n      // Axis ticks and labels follow the muted foreground token.\n      'tw:[&_.recharts-cartesian-axis-tick_text]:fill-muted-foreground',\n      'tw:[&_.recharts-polar-angle-axis-tick_text]:fill-muted-foreground',\n      'tw:[&_.recharts-label]:fill-muted-foreground',\n      'tw:[&_.recharts-legend-item-text]:!text-muted-foreground',\n      // Grid lines, axis lines and the hover cursor follow the border token.\n      'tw:[&_.recharts-cartesian-grid_line]:stroke-border/60',\n      'tw:[&_.recharts-cartesian-axis-line]:stroke-border',\n      'tw:[&_.recharts-cartesian-axis-tick-line]:stroke-border',\n      'tw:[&_.recharts-curve.recharts-tooltip-cursor]:stroke-border',\n      'tw:[&_.recharts-rectangle.recharts-tooltip-cursor]:fill-muted/60',\n      'tw:[&_.recharts-surface]:outline-hidden',\n      className,\n    )}\n    {...props}\n  >\n    <ResponsiveContainer width={width} height={height}>\n      {children}\n    </ResponsiveContainer>\n  </div>\n);\n","import { type ComponentProps } from 'react';\nimport { Tooltip as RechartsTooltip } from 'recharts';\n\nimport { cn } from '../../utils';\n\ntype TooltipPayloadEntry = {\n  name?: string | number;\n  value?: string | number;\n  color?: string;\n  dataKey?: string | number;\n};\n\ntype ChartTooltipContentProps = {\n  active?: boolean;\n  label?: string | number;\n  payload?: TooltipPayloadEntry[];\n  /** Format a value for display (e.g. currency, percentage). */\n  valueFormatter?: (value: string | number, name: string) => string;\n  className?: string;\n};\n\n/**\n * Brand-themed tooltip body. Surfaces (background, border, text) resolve from\n * semantic tokens, and each series swatch reuses the recharts-provided series\n * `color` (already a `--chart-*` token from this package's charts).\n */\nexport const ChartTooltipContent = ({\n  active,\n  label,\n  payload,\n  valueFormatter,\n  className,\n}: ChartTooltipContentProps) => {\n  if (!active || !payload?.length) return null;\n\n  return (\n    <div\n      className={cn(\n        'tw:min-w-32 tw:rounded-md tw:border tw:border-border tw:bg-popover tw:px-2.5 tw:py-1.5 tw:text-xs tw:text-popover-foreground tw:shadow-md',\n        className,\n      )}\n    >\n      {label != null && <div className=\"tw:mb-1 tw:font-medium\">{label}</div>}\n      <div className=\"tw:flex tw:flex-col tw:gap-1\">\n        {payload.map((entry) => {\n          const name = String(entry.name ?? entry.dataKey ?? '');\n          const value = entry.value;\n          // Missing / non-numeric values render blank rather than \"NaN\"/\"0\";\n          // only well-formed numbers reach the formatter.\n          const hasNumber = value != null && value !== '' && Number.isFinite(Number(value));\n          const display = hasNumber\n            ? valueFormatter\n              ? valueFormatter(Number(value), name)\n              : String(Number(value))\n            : (value ?? '');\n          return (\n            <div\n              key={String(entry.dataKey ?? name)}\n              className=\"tw:flex tw:items-center tw:justify-between tw:gap-3\"\n            >\n              <span className=\"tw:flex tw:items-center tw:gap-1.5\">\n                <span\n                  className=\"tw:size-2 tw:shrink-0 tw:rounded-[2px]\"\n                  style={{ backgroundColor: entry.color }}\n                />\n                <span className=\"tw:text-muted-foreground\">{name}</span>\n              </span>\n              <span className=\"tw:font-medium tw:tabular-nums\">{display}</span>\n            </div>\n          );\n        })}\n      </div>\n    </div>\n  );\n};\n\nexport type ChartTooltipProps = ComponentProps<typeof RechartsTooltip> & {\n  valueFormatter?: (value: string | number, name: string) => string;\n};\n\n/**\n * Drop-in recharts `<Tooltip>` pre-wired to render {@link ChartTooltipContent}.\n * Each chart mounts one by default; pass `showTooltip={false}` on the chart to omit.\n */\nexport const ChartTooltip = ({ valueFormatter, ...props }: ChartTooltipProps) => (\n  <RechartsTooltip\n    cursor={{ strokeWidth: 1 }}\n    content={<ChartTooltipContent valueFormatter={valueFormatter} />}\n    {...props}\n  />\n);\n","/**\n * Apply a numeric `valueFormatter` safely. recharts hands axis ticks and\n * tooltip payload values as `string | number | null | undefined`, and partial\n * or streaming data can carry gaps. Coercing those straight through\n * `Number(value)` would render `$0` (empty string → 0) or `$NaN` (non-numeric),\n * so a missing / non-finite value is rendered as an empty string instead of\n * being fed to the formatter.\n */\nexport const formatValue = (\n  value: string | number | null | undefined,\n  valueFormatter?: (value: number) => string,\n): string => {\n  if (value == null || value === '') return '';\n  const num = Number(value);\n  if (!Number.isFinite(num)) return '';\n  return valueFormatter ? valueFormatter(num) : String(num);\n};\n","import { CartesianGrid, Legend, XAxis, YAxis } from 'recharts';\n\nimport { ChartTooltip } from './ChartTooltip';\nimport { formatValue } from './format';\nimport { type CartesianChartProps, type ChartAxisDomain } from './types';\n\nconst AXIS_PROPS = {\n  tickLine: false,\n  axisLine: false,\n  tick: { fontSize: 11 },\n} as const;\n\n/**\n * The grid + axes + tooltip + legend shared by the line, bar, and area charts.\n * Colors are applied via `ChartContainer`'s CSS chrome, not inline props, so\n * these stay brand-safe.\n */\nexport const cartesianChrome = ({\n  xKey,\n  showGrid = true,\n  showYAxis = true,\n  showLegend = false,\n  showTooltip = true,\n  valueFormatter,\n  yDomain,\n}: Pick<\n  CartesianChartProps,\n  'xKey' | 'showGrid' | 'showYAxis' | 'showLegend' | 'showTooltip' | 'valueFormatter'\n> & { yDomain?: ChartAxisDomain }) => (\n  <>\n    {showGrid && <CartesianGrid strokeDasharray=\"3 3\" vertical={false} />}\n    <XAxis dataKey={xKey} {...AXIS_PROPS} />\n    {/* A domain has to reach recharts through a mounted <YAxis>, so a chart that\n        hides its axis but sets one still gets the element — hidden, and taking\n        no layout width. Without a domain the hidden case renders nothing, as\n        before, and recharts falls back to its implicit axis. */}\n    {(showYAxis || yDomain !== undefined) && (\n      <YAxis\n        hide={!showYAxis}\n        domain={yDomain}\n        width={48}\n        {...AXIS_PROPS}\n        tickFormatter={\n          valueFormatter\n            ? (value: string | number) => formatValue(value, valueFormatter)\n            : undefined\n        }\n      />\n    )}\n    {showTooltip && (\n      <ChartTooltip\n        valueFormatter={valueFormatter ? (value) => formatValue(value, valueFormatter) : undefined}\n      />\n    )}\n    {showLegend && <Legend wrapperStyle={{ fontSize: 11 }} />}\n  </>\n);\n","/**\n * The design system ships a five-slot categorical chart palette as CSS\n * variables (`--chart-1` … `--chart-5`). Charts resolve their\n * series colors from these tokens only — never from inline hex or a primitive\n * scale — so they follow both the active color scheme (light/dark, via\n * `data-theme` in `styles.css`) and the active brand: a brand reskins charts\n * by defining `colors.chart` (and `colorsDark.chart`) in its\n * `@keboola/brand-registry` definition, which `ThemeProvider` emits as the\n * `--chart-*` variables.\n *\n * The CSS variables hold raw `R G B` channels (for Tailwind's `<alpha-value>`\n * opacity modifiers), so they are wrapped in `rgb(...)` before handing them to\n * recharts as ordinary SVG `stroke` / `fill` strings.\n */\nconst CHART_TOKEN_COUNT = 5;\n\n/** Number of the semantic chart token (`1`–`5`) a series maps to. */\nexport type ChartColorToken = 1 | 2 | 3 | 4 | 5;\n\n/**\n * The CSS color for a chart token. `index` is 0-based (series position); it\n * wraps around the five-slot palette so any number of series stays on-brand.\n */\nexport const chartTokenColor = (index: number): string => {\n  // Euclidean modulo so negative indices still land in 1..CHART_TOKEN_COUNT\n  // (plain `%` would yield e.g. `--chart-0` for index -1).\n  const slot = (((index % CHART_TOKEN_COUNT) + CHART_TOKEN_COUNT) % CHART_TOKEN_COUNT) + 1;\n  return `rgb(var(--chart-${slot}))`;\n};\n\n/** Resolve an explicit token (1–5) or fall back to the series position. */\nexport const resolveSeriesColor = (index: number, token?: ChartColorToken): string =>\n  chartTokenColor(token ? token - 1 : index);\n","import { Line, LineChart as RechartsLineChart } from 'recharts';\n\nimport { cartesianChrome } from './cartesian';\nimport { ChartContainer } from './ChartContainer';\nimport { resolveSeriesColor } from './theme';\nimport { type CartesianChartProps, type ChartAxisDomain } from './types';\n\nexport type LineChartProps = CartesianChartProps & {\n  /**\n   * `[min, max]` bounds for the value (y) axis — numbers, `'auto'`, or padded\n   * data extremes (`['dataMin - 500', 'dataMax + 500']`). Defaults to a zero\n   * baseline.\n   *\n   * Only the line chart takes this. A line encodes value by POSITION, so moving\n   * the baseline rescales it without misstating it; bars and areas encode by\n   * length and filled area from the baseline, and truncating those makes the\n   * geometry lie about the ratios. Use it to compare two series of similar\n   * magnitude far from zero — not for a single series whose magnitude the\n   * reader is meant to judge.\n   */\n  yDomain?: ChartAxisDomain;\n};\n\n/**\n * A themed multi-series line chart. Each series' color comes from the semantic\n * `--chart-*` palette (by order, or pinned via `series[].color`), which\n * follows the active color scheme and the active brand's `colors.chart` when it\n * defines one. Wrap-free — mounts its own {@link ChartContainer}.\n *\n * @example\n * <LineChart\n *   data={data}\n *   xKey=\"month\"\n *   series={[{ dataKey: 'revenue', name: 'Revenue' }, { dataKey: 'cost' }]}\n * />\n *\n * @example Two close-but-high series, on a baseline that shows the gap\n * <LineChart data={data} xKey=\"month\" series={series} yDomain={[7000, 9000]} />\n */\nexport const LineChart = ({\n  data,\n  xKey,\n  series,\n  height,\n  width,\n  className,\n  ...chrome\n}: LineChartProps) => (\n  <ChartContainer height={height} width={width} className={className}>\n    <RechartsLineChart data={data} margin={{ top: 8, right: 8, left: 0, bottom: 0 }}>\n      {cartesianChrome({ xKey, ...chrome })}\n      {series.map((s, index) => {\n        const color = resolveSeriesColor(index, s.color);\n        return (\n          <Line\n            key={s.dataKey}\n            type=\"monotone\"\n            dataKey={s.dataKey}\n            name={s.name ?? s.dataKey}\n            stroke={color}\n            strokeWidth={2}\n            dot={{ r: 3, fill: color, stroke: color }}\n            activeDot={{ r: 4 }}\n            isAnimationActive={false}\n          />\n        );\n      })}\n    </RechartsLineChart>\n  </ChartContainer>\n);\n","import { Bar, BarChart as RechartsBarChart } from 'recharts';\n\nimport { cartesianChrome } from './cartesian';\nimport { ChartContainer } from './ChartContainer';\nimport { resolveSeriesColor } from './theme';\nimport { type CartesianChartProps } from './types';\n\nexport type BarChartProps = CartesianChartProps & {\n  /** Stack the series into a single bar per category. Defaults to grouped. */\n  stacked?: boolean;\n};\n\n/**\n * A themed multi-series bar chart. Series colors come from the semantic\n * `--chart-*` palette (by order, or pinned via `series[].color`), which\n * follows the active color scheme and the active brand's `colors.chart` when it\n * defines one. Pass `stacked` to stack the series instead of grouping them.\n *\n * @example\n * <BarChart data={data} xKey=\"month\" series={[{ dataKey: 'revenue' }]} />\n */\nexport const BarChart = ({\n  data,\n  xKey,\n  series,\n  height,\n  width,\n  className,\n  stacked = false,\n  ...chrome\n}: BarChartProps) => (\n  <ChartContainer height={height} width={width} className={className}>\n    <RechartsBarChart data={data} margin={{ top: 8, right: 8, left: 0, bottom: 0 }}>\n      {cartesianChrome({ xKey, ...chrome })}\n      {series.map((s, index) => (\n        <Bar\n          key={s.dataKey}\n          dataKey={s.dataKey}\n          name={s.name ?? s.dataKey}\n          fill={resolveSeriesColor(index, s.color)}\n          radius={stacked ? 0 : [4, 4, 0, 0]}\n          stackId={stacked ? 'stack' : undefined}\n          isAnimationActive={false}\n        />\n      ))}\n    </RechartsBarChart>\n  </ChartContainer>\n);\n","import { Area, AreaChart as RechartsAreaChart } from 'recharts';\n\nimport { cartesianChrome } from './cartesian';\nimport { ChartContainer } from './ChartContainer';\nimport { resolveSeriesColor } from './theme';\nimport { type CartesianChartProps } from './types';\n\nexport type AreaChartProps = CartesianChartProps & {\n  /** Stack the series into a cumulative area. Defaults to overlaid. */\n  stacked?: boolean;\n};\n\n/**\n * A themed multi-series area chart. Each series is stroked and softly filled\n * from the semantic `--chart-*` palette (by order, or pinned via\n * `series[].color`), which follows the active color scheme and the active\n * brand's `colors.chart` when it defines one. Pass `stacked` to stack the\n * series cumulatively.\n *\n * @example\n * <AreaChart data={data} xKey=\"month\" series={[{ dataKey: 'revenue' }]} />\n */\nexport const AreaChart = ({\n  data,\n  xKey,\n  series,\n  height,\n  width,\n  className,\n  stacked = false,\n  ...chrome\n}: AreaChartProps) => (\n  <ChartContainer height={height} width={width} className={className}>\n    <RechartsAreaChart data={data} margin={{ top: 8, right: 8, left: 0, bottom: 0 }}>\n      {cartesianChrome({ xKey, ...chrome })}\n      {series.map((s, index) => {\n        const color = resolveSeriesColor(index, s.color);\n        return (\n          <Area\n            key={s.dataKey}\n            type=\"monotone\"\n            dataKey={s.dataKey}\n            name={s.name ?? s.dataKey}\n            stroke={color}\n            fill={color}\n            fillOpacity={0.15}\n            strokeWidth={2}\n            stackId={stacked ? 'stack' : undefined}\n            isAnimationActive={false}\n          />\n        );\n      })}\n    </RechartsAreaChart>\n  </ChartContainer>\n);\n","import { Cell, Legend, Pie, PieChart as RechartsPieChart } from 'recharts';\n\nimport { ChartContainer, type ChartDimension } from './ChartContainer';\nimport { ChartTooltip } from './ChartTooltip';\nimport { formatValue } from './format';\nimport { chartTokenColor } from './theme';\nimport { type ChartDatum } from './types';\n\nexport type PieChartProps = {\n  /** The rows to plot — one sector per row. */\n  data: ChartDatum[];\n  /** Key into each datum for the sector label. */\n  nameKey: string;\n  /** Key into each datum for the sector value. */\n  dataKey: string;\n  /** Render as a donut with a hole of this inner radius (px or %). */\n  innerRadius?: ChartDimension;\n  /** Height as a px number or percentage. Defaults to 300. */\n  height?: ChartDimension;\n  /** Width as a px number or percentage. Defaults to `\"100%\"`. */\n  width?: ChartDimension;\n  /** Show a legend below the chart. Defaults to `true`. */\n  showLegend?: boolean;\n  /** Show the hover tooltip. Defaults to `true`. */\n  showTooltip?: boolean;\n  /** Format a sector value for the tooltip. */\n  valueFormatter?: (value: number) => string;\n  className?: string;\n};\n\n/**\n * A themed pie / donut chart. Each sector cycles through the semantic\n * `--chart-*` palette, which follows the active color scheme and the\n * active brand's `colors.chart` when it defines one. Pass `innerRadius` to make\n * a donut.\n *\n * @example\n * <PieChart data={data} nameKey=\"engine\" dataKey=\"rows\" innerRadius=\"60%\" />\n */\nexport const PieChart = ({\n  data,\n  nameKey,\n  dataKey,\n  innerRadius = 0,\n  height,\n  width,\n  className,\n  showLegend = true,\n  showTooltip = true,\n  valueFormatter,\n}: PieChartProps) => (\n  <ChartContainer height={height} width={width} className={className}>\n    <RechartsPieChart>\n      {showTooltip && (\n        <ChartTooltip\n          valueFormatter={\n            valueFormatter ? (value) => formatValue(value, valueFormatter) : undefined\n          }\n        />\n      )}\n      {showLegend && <Legend wrapperStyle={{ fontSize: 11 }} />}\n      <Pie\n        data={data}\n        nameKey={nameKey}\n        dataKey={dataKey}\n        innerRadius={innerRadius}\n        // Separate sectors with the brand surface color rather than recharts'\n        // hardcoded white default.\n        stroke=\"rgb(var(--background))\"\n        isAnimationActive={false}\n      >\n        {data.map((datum, index) => (\n          <Cell key={String(datum[nameKey] ?? index)} fill={chartTokenColor(index)} />\n        ))}\n      </Pie>\n    </RechartsPieChart>\n  </ChartContainer>\n);\n"]}
+{"version":3,"file":"charts.js","names":["RechartsTooltip","RechartsLineChart","RechartsBarChart","RechartsAreaChart","RechartsPieChart"],"sources":["../src/blocks/Charts/ChartContainer.tsx","../src/blocks/Charts/ChartTooltip.tsx","../src/blocks/Charts/format.ts","../src/blocks/Charts/cartesian.tsx","../src/blocks/Charts/theme.ts","../src/blocks/Charts/LineChart.tsx","../src/blocks/Charts/BarChart.tsx","../src/blocks/Charts/AreaChart.tsx","../src/blocks/Charts/PieChart.tsx"],"sourcesContent":["import { type ComponentProps, type ReactElement } from 'react';\nimport { ResponsiveContainer } from 'recharts';\n\nimport { cn } from '../../utils';\n\n/** A length that recharts' `<ResponsiveContainer>` accepts: px number or `\"NN%\"`. */\nexport type ChartDimension = number | `${number}%`;\n\nexport type ChartContainerProps = Omit<ComponentProps<'div'>, 'children'> & {\n  /**\n   * Height as a px number or percentage string. Charts have no intrinsic\n   * height, so a container needs one either here or from a sized ancestor.\n   * Defaults to 300.\n   */\n  height?: ChartDimension;\n  /** Width as a px number or percentage. Defaults to `\"100%\"` (fills parent). */\n  width?: ChartDimension;\n  /** A single recharts chart element (`<LineChart>`, `<BarChart>`, …). */\n  children: ReactElement;\n};\n\n/**\n * Responsive, brand-themed frame for a chart. Wraps the chart in recharts'\n * `<ResponsiveContainer>` and applies the semantic-token chrome (axis text,\n * grid, cursor) through CSS so every chart inside inherits it. Sizing is\n * intrinsic: give it a `height` (default 300) and it fills the parent width.\n */\nexport const ChartContainer = ({\n  height = 300,\n  width = '100%',\n  className,\n  children,\n  ...props\n}: ChartContainerProps) => (\n  <div\n    className={cn(\n      'tw:text-xs',\n      // Axis ticks and labels follow the muted foreground token.\n      'tw:[&_.recharts-cartesian-axis-tick_text]:fill-muted-foreground',\n      'tw:[&_.recharts-polar-angle-axis-tick_text]:fill-muted-foreground',\n      'tw:[&_.recharts-label]:fill-muted-foreground',\n      'tw:[&_.recharts-legend-item-text]:!text-muted-foreground',\n      // Grid lines, axis lines and the hover cursor follow the border token.\n      'tw:[&_.recharts-cartesian-grid_line]:stroke-border/60',\n      'tw:[&_.recharts-cartesian-axis-line]:stroke-border',\n      'tw:[&_.recharts-cartesian-axis-tick-line]:stroke-border',\n      'tw:[&_.recharts-curve.recharts-tooltip-cursor]:stroke-border',\n      'tw:[&_.recharts-rectangle.recharts-tooltip-cursor]:fill-muted/60',\n      'tw:[&_.recharts-surface]:outline-hidden',\n      className,\n    )}\n    {...props}\n  >\n    <ResponsiveContainer width={width} height={height}>\n      {children}\n    </ResponsiveContainer>\n  </div>\n);\n","import { type ComponentProps } from 'react';\nimport { Tooltip as RechartsTooltip } from 'recharts';\n\nimport { cn } from '../../utils';\n\ntype TooltipPayloadEntry = {\n  name?: string | number;\n  value?: string | number;\n  color?: string;\n  dataKey?: string | number;\n};\n\ntype ChartTooltipContentProps = {\n  active?: boolean;\n  label?: string | number;\n  payload?: TooltipPayloadEntry[];\n  /** Format a value for display (e.g. currency, percentage). */\n  valueFormatter?: (value: string | number, name: string) => string;\n  className?: string;\n};\n\n/**\n * Brand-themed tooltip body. Surfaces (background, border, text) resolve from\n * semantic tokens, and each series swatch reuses the recharts-provided series\n * `color` (already a `--chart-*` token from this package's charts).\n */\nexport const ChartTooltipContent = ({\n  active,\n  label,\n  payload,\n  valueFormatter,\n  className,\n}: ChartTooltipContentProps) => {\n  if (!active || !payload?.length) return null;\n\n  return (\n    <div\n      className={cn(\n        'tw:min-w-32 tw:rounded-md tw:border tw:border-border tw:bg-popover tw:px-2.5 tw:py-1.5 tw:text-xs tw:text-popover-foreground tw:shadow-md',\n        className,\n      )}\n    >\n      {label != null && <div className=\"tw:mb-1 tw:font-medium\">{label}</div>}\n      <div className=\"tw:flex tw:flex-col tw:gap-1\">\n        {payload.map((entry) => {\n          const name = String(entry.name ?? entry.dataKey ?? '');\n          const value = entry.value;\n          // Missing / non-numeric values render blank rather than \"NaN\"/\"0\";\n          // only well-formed numbers reach the formatter.\n          const hasNumber = value != null && value !== '' && Number.isFinite(Number(value));\n          const display = hasNumber\n            ? valueFormatter\n              ? valueFormatter(Number(value), name)\n              : String(Number(value))\n            : (value ?? '');\n          return (\n            <div\n              key={String(entry.dataKey ?? name)}\n              className=\"tw:flex tw:items-center tw:justify-between tw:gap-3\"\n            >\n              <span className=\"tw:flex tw:items-center tw:gap-1.5\">\n                <span\n                  className=\"tw:size-2 tw:shrink-0 tw:rounded-[2px]\"\n                  style={{ backgroundColor: entry.color }}\n                />\n                <span className=\"tw:text-muted-foreground\">{name}</span>\n              </span>\n              <span className=\"tw:font-medium tw:tabular-nums\">{display}</span>\n            </div>\n          );\n        })}\n      </div>\n    </div>\n  );\n};\n\nexport type ChartTooltipProps = ComponentProps<typeof RechartsTooltip> & {\n  valueFormatter?: (value: string | number, name: string) => string;\n};\n\n/**\n * Drop-in recharts `<Tooltip>` pre-wired to render {@link ChartTooltipContent}.\n * Each chart mounts one by default; pass `showTooltip={false}` on the chart to omit.\n */\nexport const ChartTooltip = ({ valueFormatter, ...props }: ChartTooltipProps) => (\n  <RechartsTooltip\n    cursor={{ strokeWidth: 1 }}\n    content={<ChartTooltipContent valueFormatter={valueFormatter} />}\n    {...props}\n  />\n);\n","/**\n * Apply a numeric `valueFormatter` safely. recharts hands axis ticks and\n * tooltip payload values as `string | number | null | undefined`, and partial\n * or streaming data can carry gaps. Coercing those straight through\n * `Number(value)` would render `$0` (empty string → 0) or `$NaN` (non-numeric),\n * so a missing / non-finite value is rendered as an empty string instead of\n * being fed to the formatter.\n */\nexport const formatValue = (\n  value: string | number | null | undefined,\n  valueFormatter?: (value: number) => string,\n): string => {\n  if (value == null || value === '') return '';\n  const num = Number(value);\n  if (!Number.isFinite(num)) return '';\n  return valueFormatter ? valueFormatter(num) : String(num);\n};\n","import { CartesianGrid, Legend, XAxis, YAxis } from 'recharts';\n\nimport { ChartTooltip } from './ChartTooltip';\nimport { formatValue } from './format';\nimport { type CartesianChartProps, type ChartAxisDomain } from './types';\n\nconst AXIS_PROPS = {\n  tickLine: false,\n  axisLine: false,\n  tick: { fontSize: 11 },\n} as const;\n\n/**\n * The grid + axes + tooltip + legend shared by the line, bar, and area charts.\n * Colors are applied via `ChartContainer`'s CSS chrome, not inline props, so\n * these stay brand-safe.\n */\nexport const cartesianChrome = ({\n  xKey,\n  showGrid = true,\n  showYAxis = true,\n  showLegend = false,\n  showTooltip = true,\n  valueFormatter,\n  yDomain,\n}: Pick<\n  CartesianChartProps,\n  'xKey' | 'showGrid' | 'showYAxis' | 'showLegend' | 'showTooltip' | 'valueFormatter'\n> & { yDomain?: ChartAxisDomain }) => (\n  <>\n    {showGrid && <CartesianGrid strokeDasharray=\"3 3\" vertical={false} />}\n    <XAxis dataKey={xKey} {...AXIS_PROPS} />\n    {/* A domain has to reach recharts through a mounted <YAxis>, so a chart that\n        hides its axis but sets one still gets the element — hidden, and taking\n        no layout width. Without a domain the hidden case renders nothing, as\n        before, and recharts falls back to its implicit axis. */}\n    {(showYAxis || yDomain !== undefined) && (\n      <YAxis\n        hide={!showYAxis}\n        domain={yDomain}\n        width={48}\n        {...AXIS_PROPS}\n        tickFormatter={\n          valueFormatter\n            ? (value: string | number) => formatValue(value, valueFormatter)\n            : undefined\n        }\n      />\n    )}\n    {showTooltip && (\n      <ChartTooltip\n        valueFormatter={valueFormatter ? (value) => formatValue(value, valueFormatter) : undefined}\n      />\n    )}\n    {showLegend && <Legend wrapperStyle={{ fontSize: 11 }} />}\n  </>\n);\n","/**\n * The design system ships a five-slot categorical chart palette as CSS\n * variables (`--chart-1` … `--chart-5`). Charts resolve their\n * series colors from these tokens only — never from inline hex or a primitive\n * scale — so they follow both the active color scheme (light/dark, via\n * `data-theme` in `styles.css`) and the active brand: a brand reskins charts\n * by defining `colors.chart` (and `colorsDark.chart`) in its\n * `@keboola/brand-registry` definition, which `ThemeProvider` emits as the\n * `--chart-*` variables.\n *\n * The CSS variables hold raw `R G B` channels (for Tailwind's `<alpha-value>`\n * opacity modifiers), so they are wrapped in `rgb(...)` before handing them to\n * recharts as ordinary SVG `stroke` / `fill` strings.\n */\nconst CHART_TOKEN_COUNT = 5;\n\n/** Number of the semantic chart token (`1`–`5`) a series maps to. */\nexport type ChartColorToken = 1 | 2 | 3 | 4 | 5;\n\n/**\n * The CSS color for a chart token. `index` is 0-based (series position); it\n * wraps around the five-slot palette so any number of series stays on-brand.\n */\nexport const chartTokenColor = (index: number): string => {\n  // Euclidean modulo so negative indices still land in 1..CHART_TOKEN_COUNT\n  // (plain `%` would yield e.g. `--chart-0` for index -1).\n  const slot = (((index % CHART_TOKEN_COUNT) + CHART_TOKEN_COUNT) % CHART_TOKEN_COUNT) + 1;\n  return `rgb(var(--chart-${slot}))`;\n};\n\n/** Resolve an explicit token (1–5) or fall back to the series position. */\nexport const resolveSeriesColor = (index: number, token?: ChartColorToken): string =>\n  chartTokenColor(token ? token - 1 : index);\n","import { Line, LineChart as RechartsLineChart } from 'recharts';\n\nimport { cartesianChrome } from './cartesian';\nimport { ChartContainer } from './ChartContainer';\nimport { resolveSeriesColor } from './theme';\nimport { type CartesianChartProps, type ChartAxisDomain } from './types';\n\nexport type LineChartProps = CartesianChartProps & {\n  /**\n   * `[min, max]` bounds for the value (y) axis — numbers, `'auto'`, or padded\n   * data extremes (`['dataMin - 500', 'dataMax + 500']`). Defaults to a zero\n   * baseline.\n   *\n   * Only the line chart takes this. A line encodes value by POSITION, so moving\n   * the baseline rescales it without misstating it; bars and areas encode by\n   * length and filled area from the baseline, and truncating those makes the\n   * geometry lie about the ratios. Use it to compare two series of similar\n   * magnitude far from zero — not for a single series whose magnitude the\n   * reader is meant to judge.\n   */\n  yDomain?: ChartAxisDomain;\n};\n\n/**\n * A themed multi-series line chart. Each series' color comes from the semantic\n * `--chart-*` palette (by order, or pinned via `series[].color`), which\n * follows the active color scheme and the active brand's `colors.chart` when it\n * defines one. Wrap-free — mounts its own {@link ChartContainer}.\n *\n * @example\n * <LineChart\n *   data={data}\n *   xKey=\"month\"\n *   series={[{ dataKey: 'revenue', name: 'Revenue' }, { dataKey: 'cost' }]}\n * />\n *\n * @example Two close-but-high series, on a baseline that shows the gap\n * <LineChart data={data} xKey=\"month\" series={series} yDomain={[7000, 9000]} />\n */\nexport const LineChart = ({\n  data,\n  xKey,\n  series,\n  height,\n  width,\n  className,\n  ...chrome\n}: LineChartProps) => (\n  <ChartContainer height={height} width={width} className={className}>\n    <RechartsLineChart data={data} margin={{ top: 8, right: 8, left: 0, bottom: 0 }}>\n      {cartesianChrome({ xKey, ...chrome })}\n      {series.map((s, index) => {\n        const color = resolveSeriesColor(index, s.color);\n        return (\n          <Line\n            key={s.dataKey}\n            type=\"monotone\"\n            dataKey={s.dataKey}\n            name={s.name ?? s.dataKey}\n            stroke={color}\n            strokeWidth={2}\n            dot={{ r: 3, fill: color, stroke: color }}\n            activeDot={{ r: 4 }}\n            isAnimationActive={false}\n          />\n        );\n      })}\n    </RechartsLineChart>\n  </ChartContainer>\n);\n","import { Bar, BarChart as RechartsBarChart } from 'recharts';\n\nimport { cartesianChrome } from './cartesian';\nimport { ChartContainer } from './ChartContainer';\nimport { resolveSeriesColor } from './theme';\nimport { type CartesianChartProps } from './types';\n\nexport type BarChartProps = CartesianChartProps & {\n  /** Stack the series into a single bar per category. Defaults to grouped. */\n  stacked?: boolean;\n};\n\n/**\n * A themed multi-series bar chart. Series colors come from the semantic\n * `--chart-*` palette (by order, or pinned via `series[].color`), which\n * follows the active color scheme and the active brand's `colors.chart` when it\n * defines one. Pass `stacked` to stack the series instead of grouping them.\n *\n * @example\n * <BarChart data={data} xKey=\"month\" series={[{ dataKey: 'revenue' }]} />\n */\nexport const BarChart = ({\n  data,\n  xKey,\n  series,\n  height,\n  width,\n  className,\n  stacked = false,\n  ...chrome\n}: BarChartProps) => (\n  <ChartContainer height={height} width={width} className={className}>\n    <RechartsBarChart data={data} margin={{ top: 8, right: 8, left: 0, bottom: 0 }}>\n      {cartesianChrome({ xKey, ...chrome })}\n      {series.map((s, index) => (\n        <Bar\n          key={s.dataKey}\n          dataKey={s.dataKey}\n          name={s.name ?? s.dataKey}\n          fill={resolveSeriesColor(index, s.color)}\n          radius={stacked ? 0 : [4, 4, 0, 0]}\n          stackId={stacked ? 'stack' : undefined}\n          isAnimationActive={false}\n        />\n      ))}\n    </RechartsBarChart>\n  </ChartContainer>\n);\n","import { Area, AreaChart as RechartsAreaChart } from 'recharts';\n\nimport { cartesianChrome } from './cartesian';\nimport { ChartContainer } from './ChartContainer';\nimport { resolveSeriesColor } from './theme';\nimport { type CartesianChartProps } from './types';\n\nexport type AreaChartProps = CartesianChartProps & {\n  /** Stack the series into a cumulative area. Defaults to overlaid. */\n  stacked?: boolean;\n};\n\n/**\n * A themed multi-series area chart. Each series is stroked and softly filled\n * from the semantic `--chart-*` palette (by order, or pinned via\n * `series[].color`), which follows the active color scheme and the active\n * brand's `colors.chart` when it defines one. Pass `stacked` to stack the\n * series cumulatively.\n *\n * @example\n * <AreaChart data={data} xKey=\"month\" series={[{ dataKey: 'revenue' }]} />\n */\nexport const AreaChart = ({\n  data,\n  xKey,\n  series,\n  height,\n  width,\n  className,\n  stacked = false,\n  ...chrome\n}: AreaChartProps) => (\n  <ChartContainer height={height} width={width} className={className}>\n    <RechartsAreaChart data={data} margin={{ top: 8, right: 8, left: 0, bottom: 0 }}>\n      {cartesianChrome({ xKey, ...chrome })}\n      {series.map((s, index) => {\n        const color = resolveSeriesColor(index, s.color);\n        return (\n          <Area\n            key={s.dataKey}\n            type=\"monotone\"\n            dataKey={s.dataKey}\n            name={s.name ?? s.dataKey}\n            stroke={color}\n            fill={color}\n            fillOpacity={0.15}\n            strokeWidth={2}\n            stackId={stacked ? 'stack' : undefined}\n            isAnimationActive={false}\n          />\n        );\n      })}\n    </RechartsAreaChart>\n  </ChartContainer>\n);\n","import { Cell, Legend, Pie, PieChart as RechartsPieChart } from 'recharts';\n\nimport { ChartContainer, type ChartDimension } from './ChartContainer';\nimport { ChartTooltip } from './ChartTooltip';\nimport { formatValue } from './format';\nimport { chartTokenColor } from './theme';\nimport { type ChartDatum } from './types';\n\nexport type PieChartProps = {\n  /** The rows to plot — one sector per row. */\n  data: ChartDatum[];\n  /** Key into each datum for the sector label. */\n  nameKey: string;\n  /** Key into each datum for the sector value. */\n  dataKey: string;\n  /** Render as a donut with a hole of this inner radius (px or %). */\n  innerRadius?: ChartDimension;\n  /** Height as a px number or percentage. Defaults to 300. */\n  height?: ChartDimension;\n  /** Width as a px number or percentage. Defaults to `\"100%\"`. */\n  width?: ChartDimension;\n  /** Show a legend below the chart. Defaults to `true`. */\n  showLegend?: boolean;\n  /** Show the hover tooltip. Defaults to `true`. */\n  showTooltip?: boolean;\n  /** Format a sector value for the tooltip. */\n  valueFormatter?: (value: number) => string;\n  className?: string;\n};\n\n/**\n * A themed pie / donut chart. Each sector cycles through the semantic\n * `--chart-*` palette, which follows the active color scheme and the\n * active brand's `colors.chart` when it defines one. Pass `innerRadius` to make\n * a donut.\n *\n * @example\n * <PieChart data={data} nameKey=\"engine\" dataKey=\"rows\" innerRadius=\"60%\" />\n */\nexport const PieChart = ({\n  data,\n  nameKey,\n  dataKey,\n  innerRadius = 0,\n  height,\n  width,\n  className,\n  showLegend = true,\n  showTooltip = true,\n  valueFormatter,\n}: PieChartProps) => (\n  <ChartContainer height={height} width={width} className={className}>\n    <RechartsPieChart>\n      {showTooltip && (\n        <ChartTooltip\n          valueFormatter={\n            valueFormatter ? (value) => formatValue(value, valueFormatter) : undefined\n          }\n        />\n      )}\n      {showLegend && <Legend wrapperStyle={{ fontSize: 11 }} />}\n      <Pie\n        data={data}\n        nameKey={nameKey}\n        dataKey={dataKey}\n        innerRadius={innerRadius}\n        // Separate sectors with the brand surface color rather than recharts'\n        // hardcoded white default.\n        stroke=\"rgb(var(--background))\"\n        isAnimationActive={false}\n      >\n        {data.map((datum, index) => (\n          <Cell key={String(datum[nameKey] ?? index)} fill={chartTokenColor(index)} />\n        ))}\n      </Pie>\n    </RechartsPieChart>\n  </ChartContainer>\n);\n"],"mappings":"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"}

package/dist/classNames-BzrkDnOD.js

@@ -0,0 +1,9 @@
+import { clsx } from "clsx";
+import { extendTailwindMerge } from "tailwind-merge";
+//#region src/utils/classNames.ts
+const twMerge = extendTailwindMerge({ prefix: "tw" });
+const cn = (...classes) => twMerge(clsx(...classes));
+//#endregion
+export { cn };
+
+//# sourceMappingURL=classNames-BzrkDnOD.js.map

package/dist/classNames-BzrkDnOD.js.map

@@ -0,0 +1 @@
+{"version":3,"file":"classNames-BzrkDnOD.js","names":[],"sources":["../src/utils/classNames.ts"],"sourcesContent":["import { type ClassValue, clsx } from 'clsx';\nimport { extendTailwindMerge } from 'tailwind-merge';\n\n// tailwind-merge v3 (Tailwind v4): the prefix drops the trailing separator —\n// `tw:` → `tw` (the `:` separator is implied).\nconst twMerge = extendTailwindMerge({\n  prefix: 'tw',\n});\n\nexport const cn = (...classes: ClassValue[]) => twMerge(clsx(...classes));\n"],"mappings":";;;AAKA,MAAM,UAAU,oBAAoB,EAClC,QAAQ,KACV,CAAC;AAED,MAAa,MAAM,GAAG,YAA0B,QAAQ,KAAK,GAAG,OAAO,CAAC"}

package/dist/constants-D6JcsD4_.d.ts

@@ -0,0 +1,41 @@
+//#region src/components/MergeEditor/constants.d.ts
+declare const CHUNK_TYPE: {
+  readonly UNCHANGED: 'unchanged';
+  readonly ADDED: 'added';
+  readonly REMOVED: 'removed';
+};
+type ChunkType = (typeof CHUNK_TYPE)[keyof typeof CHUNK_TYPE];
+type DiffChunk = {
+  type: ChunkType;
+  value: string;
+  /** 1-indexed start line in the old (left) text */
+  oldStart: number;
+  /** 1-indexed end line in the old (left) text */
+  oldEnd: number;
+  /** 1-indexed start line in the new (right) text */
+  newStart: number;
+  /** 1-indexed end line in the new (right) text */
+  newEnd: number;
+};
+/**
+ * A paired conflict: adjacent REMOVED + ADDED chunks from diffLines,
+ * representing a section that was modified. If only one side exists,
+ * the other is empty (pure insertion or deletion).
+ */
+type MergeConflict = {
+  id: string;
+  oldValue: string;
+  oldStartLine: number;
+  oldEndLine: number;
+  newValue: string;
+  newStartLine: number;
+  newEndLine: number;
+};
+declare const CHANGE_CLASS: {
+  readonly SAFE: 'safe';
+  readonly CONFLICT: 'conflict';
+};
+type ChangeClassification = (typeof CHANGE_CLASS)[keyof typeof CHANGE_CLASS];
+//#endregion
+export { ChangeClassification, DiffChunk, MergeConflict };
+//# sourceMappingURL=constants-D6JcsD4_.d.ts.map

package/dist/context-KxxeMHbR.js

@@ -0,0 +1,62 @@
+import { createContext, use } from "react";
+import { keboolaLegacySidebar, keboolaLegacyTopnav } from "@keboola/brand-registry";
+//#region src/components/ThemeProvider/utils.ts
+const createTheme = (brand) => ({
+	id: brand.id,
+	name: brand.name,
+	shell: brand.shell,
+	logo: brand.logo
+});
+const createCssVars = () => {
+	const vars = {};
+	return {
+		set: (name, value) => {
+			if (value !== void 0) vars[name] = value;
+		},
+		expose: () => ({ ...vars })
+	};
+};
+//#endregion
+//#region src/components/ThemeProvider/defaults.ts
+const keboolaLegacyIds = [keboolaLegacySidebar.id, keboolaLegacyTopnav.id];
+const DEFAULT_COLOR_SCHEME = "light";
+const DEFAULT_BRAND_ID = "design-system";
+const defaultBrand = {
+	id: DEFAULT_BRAND_ID,
+	name: "Design System",
+	shell: "sidebar",
+	theme: {}
+};
+const defaultTheme = createTheme(defaultBrand);
+const DEFAULT_BRANDS = [];
+//#endregion
+//#region src/components/ThemeProvider/context.tsx
+const noop = () => void 0;
+const defaultContext = {
+	scheme: DEFAULT_COLOR_SCHEME,
+	resolvedScheme: DEFAULT_COLOR_SCHEME,
+	setScheme: noop,
+	brandId: defaultTheme.id,
+	setBrand: noop,
+	themes: [defaultTheme],
+	currentTheme: defaultTheme
+};
+const ThemeContext = createContext(defaultContext);
+const useTheme = () => use(ThemeContext);
+/**
+* TEMPORARY — kbc-ui-internal only.
+*
+* Flags whether the subtree renders the argo design language. Defaults to argo
+* (`true`) — the modern default; legacy chrome is the exception. It exists
+* solely to bridge kbc-ui while its chrome is migrated off the legacy design
+* language: kbc-ui provides `false` for legacy brands/surfaces (see its
+* `AppThemeProvider`) and reads it via `useArgoDesign`. `ThemeProvider` does
+* not set it — argo is decoupled from the brand. Once every kbc-ui surface has
+* been migrated, this context and its hook can be deleted.
+*/
+const ArgoDesignContext = createContext(true);
+const useArgoDesign = () => use(ArgoDesignContext);
+//#endregion
+export { ArgoDesignContext, DEFAULT_BRANDS, DEFAULT_BRAND_ID, DEFAULT_COLOR_SCHEME, ThemeContext, createCssVars, createTheme, defaultBrand, keboolaLegacyIds, useArgoDesign, useTheme };
+
+//# sourceMappingURL=context-KxxeMHbR.js.map

package/dist/context-KxxeMHbR.js.map

@@ -0,0 +1 @@
+{"version":3,"file":"context-KxxeMHbR.js","names":[],"sources":["../src/components/ThemeProvider/utils.ts","../src/components/ThemeProvider/defaults.ts","../src/components/ThemeProvider/context.tsx"],"sourcesContent":["import type { Brand } from '@keboola/brand-registry';\n\nimport type { Theme } from './types';\n\nexport const createTheme = (brand: Brand): Theme => ({\n  id: brand.id,\n  name: brand.name,\n  shell: brand.shell,\n  logo: brand.logo,\n});\n\nexport type CssVars = {\n  set: (name: string, value: string | undefined) => void;\n  expose: () => Record<string, string>;\n};\n\nexport const createCssVars = (): CssVars => {\n  const vars: Record<string, string> = {};\n  return {\n    set: (name, value) => {\n      if (value !== undefined) vars[name] = value;\n    },\n    expose: () => ({ ...vars }),\n  };\n};\n","import type { Brand } from '@keboola/brand-registry';\nimport { keboolaLegacySidebar, keboolaLegacyTopnav } from '@keboola/brand-registry';\n\nimport type { ResolvedColorScheme } from './types';\nimport { createTheme } from './utils';\n\nexport const keboolaLegacyIds = [keboolaLegacySidebar.id, keboolaLegacyTopnav.id];\nexport const DEFAULT_COLOR_SCHEME: ResolvedColorScheme = 'light';\n\n// Sentinel active-brand id that maps to no registry brand. It resolves to\n// `defaultBrand` below, whose empty theme injects nothing — so the design-system\n// stylesheet defaults (`:root` / `[data-theme='dark']`) provide every token.\nexport const DEFAULT_BRAND_ID = 'design-system';\n\n// The \"no brand\" fallback: an empty theme → no CSS vars injected → the\n// stylesheet defaults win. Its shell/name still drive AppShell + switcher label.\nexport const defaultBrand: Brand = {\n  id: DEFAULT_BRAND_ID,\n  name: 'Design System',\n  shell: 'sidebar',\n  theme: {},\n};\nexport const defaultTheme = createTheme(defaultBrand);\n\nexport const DEFAULT_BRANDS: Brand[] = [];\n","import { createContext, use } from 'react';\n\nimport { DEFAULT_COLOR_SCHEME, defaultTheme } from './defaults';\nimport type { Theme } from './types';\nimport type { useBrandState } from './useBrandState';\nimport type { useColorSchemeState } from './useColorSchemeState';\n\nexport type ThemeContextValue = ReturnType<typeof useColorSchemeState> &\n  ReturnType<typeof useBrandState> & {\n    themes: Theme[];\n    currentTheme: Theme;\n  };\n\nconst noop = () => void 0;\n\nconst defaultContext: ThemeContextValue = {\n  scheme: DEFAULT_COLOR_SCHEME,\n  resolvedScheme: DEFAULT_COLOR_SCHEME,\n  setScheme: noop,\n  brandId: defaultTheme.id,\n  setBrand: noop,\n\n  themes: [defaultTheme],\n  currentTheme: defaultTheme,\n};\n\nexport const ThemeContext = createContext(defaultContext);\n\nexport const useTheme = () => use(ThemeContext);\n\n/**\n * TEMPORARY — kbc-ui-internal only.\n *\n * Flags whether the subtree renders the argo design language. Defaults to argo\n * (`true`) — the modern default; legacy chrome is the exception. It exists\n * solely to bridge kbc-ui while its chrome is migrated off the legacy design\n * language: kbc-ui provides `false` for legacy brands/surfaces (see its\n * `AppThemeProvider`) and reads it via `useArgoDesign`. `ThemeProvider` does\n * not set it — argo is decoupled from the brand. Once every kbc-ui surface has\n * been migrated, this context and its hook can be deleted.\n */\nexport const ArgoDesignContext = createContext<boolean>(true);\n\nexport const useArgoDesign = () => use(ArgoDesignContext);\n"],"mappings":";;;AAIA,MAAa,eAAe,WAAyB;CACnD,IAAI,MAAM;CACV,MAAM,MAAM;CACZ,OAAO,MAAM;CACb,MAAM,MAAM;AACd;AAOA,MAAa,sBAA+B;CAC1C,MAAM,OAA+B,CAAC;CACtC,OAAO;EACL,MAAM,MAAM,UAAU;GACpB,IAAI,UAAU,KAAA,GAAW,KAAK,QAAQ;EACxC;EACA,eAAe,EAAE,GAAG,KAAK;CAC3B;AACF;;;AClBA,MAAa,mBAAmB,CAAC,qBAAqB,IAAI,oBAAoB,EAAE;AAChF,MAAa,uBAA4C;AAKzD,MAAa,mBAAmB;AAIhC,MAAa,eAAsB;CACjC,IAAI;CACJ,MAAM;CACN,OAAO;CACP,OAAO,CAAC;AACV;AACA,MAAa,eAAe,YAAY,YAAY;AAEpD,MAAa,iBAA0B,CAAC;;;ACXxC,MAAM,aAAa,KAAK;AAExB,MAAM,iBAAoC;CACxC,QAAQ;CACR,gBAAgB;CAChB,WAAW;CACX,SAAS,aAAa;CACtB,UAAU;CAEV,QAAQ,CAAC,YAAY;CACrB,cAAc;AAChB;AAEA,MAAa,eAAe,cAAc,cAAc;AAExD,MAAa,iBAAiB,IAAI,YAAY;;;;;;;;;;;;AAa9C,MAAa,oBAAoB,cAAuB,IAAI;AAE5D,MAAa,sBAAsB,IAAI,iBAAiB"}

package/dist/editors.d.ts

@@ -1,189 +1,196 @@
-import * as react_jsx_runtime from 'react/jsx-runtime';
-import { ReactNode } from 'react';
-import { CompletionSource } from '@codemirror/autocomplete';
-import { SQLNamespace } from '@codemirror/lang-sql';
-import { EditorView, EditorState } from '@uiw/react-codemirror';
-import { SqlDialectName } from '@keboola/codemirror-lang-sql';
-export { SqlDialectName } from '@keboola/codemirror-lang-sql';
-import { M as MergeConflict, C as ChangeClassification } from './constants-D3gaMY-W.js';
-
-declare const LANGUAGE_MODES: readonly ["application/json", "text/plain", "text/x-python", "text/x-sql", "text/x-mysql", "text/x-pgsql", "text/x-mssql", "text/x-sfsql", "text/x-bqsql", "text/x-plsql", "text/x-rsrc", "text/x-sh", "text/x-toml", "text/jsonnet", "text/x-dbt", "text/javascript", "text/typescript"];
+import { ChangeClassification, MergeConflict } from "./constants-D6JcsD4_.js";
+import { ReactNode } from "react";
+import { CompletionSource } from "@codemirror/autocomplete";
+import { EditorView } from "@codemirror/view";
+import { EditorState, EditorView as EditorView$1 } from "@uiw/react-codemirror";
+import { SQLNamespace } from "@codemirror/lang-sql";
+import { StreamLanguage } from "@codemirror/language";
+import { SqlDialectName, SqlDialectName as SqlDialectName$1 } from "@keboola/codemirror-lang-sql";
+import "@codemirror/state";
+//#region src/components/CodeEditor/helpers.d.ts
+declare const LANGUAGE_MODES: readonly ['application/json', 'text/plain', 'text/x-python', 'text/x-sql', 'text/x-mysql', 'text/x-pgsql', 'text/x-mssql', 'text/x-sfsql', 'text/x-bqsql', 'text/x-plsql', 'text/x-rsrc', 'text/x-sh', 'text/x-toml', 'text/jsonnet', 'text/x-dbt', 'text/javascript', 'text/typescript'];
 type LANGUAGE_MODE = (typeof LANGUAGE_MODES)[number];
 declare const isLanguageMode: (mode: string) => mode is LANGUAGE_MODE;
-
+//#endregion
+//#region src/components/CodeEditor/variableCompletion.d.ts
 type EditorVariable = {
-    name: string;
-    value?: string;
+  name: string;
+  value?: string;
 };
-
+//#endregion
+//#region src/components/CodeEditor/CodeEditor.d.ts
 type Props$2 = {
-    value: string;
-    previousValue?: string;
-    /**
-     * `'field'` draws the chrome an `InputGroup` draws — surface, border, radius,
-     * focus ring, read-only wash — for an editor that is one control among others
-     * in a form. It sizes to its content, so don't pin its height.
-     *
-     * `'plain'` (the default) is the full-bleed surface of an editor that *is* the
-     * panel: a modal body, a chat block, a fixed-height viewer already framed by
-     * whatever contains it.
-     */
-    variant?: 'plain' | 'field';
-    mode?: LANGUAGE_MODE;
-    placeholder?: string;
-    /** Names the editable region for screen readers — the editor has no visible label of its own. */
-    ariaLabel?: string;
-    /**
-     * Highlights every occurrence and scrolls the selected one into view. The find
-     * UI is the caller's — pass the query it holds, and omit both props entirely to
-     * leave the search extension uninstalled.
-     */
-    searchQuery?: string;
-    searchMatchIndex?: number;
-    readOnly?: boolean;
-    /**
-     * Refuses edits while leaving the editor looking and behaving as it did — for a
-     * transient lock such as an in-flight save, where a keystroke landing mid-request
-     * would be overwritten by the response. `readOnly` is the wrong prop for that:
-     * it turns the editor into a viewer, greying the surface and taking the lint
-     * marks and completions with it.
-     */
-    inputLocked?: boolean;
-    /**
-     * A flat list of completions, offered everywhere in the document. One word per
-     * label: CodeMirror derives the pattern for the word being completed from the
-     * labels' characters, so a space in one widens it across whitespace and the
-     * editor offers nothing past the first word of a line. A phrase belongs in
-     * `completionSource`.
-     *
-     * Compared by identity, like `completionSource` — hand the editor a stable array.
-     */
-    autocompletions?: string[];
-    /**
-     * Completions that depend on where the cursor is — a column list offered only
-     * after its table, say. Wins over both `autocompletions` and `completeAny`,
-     * which stay the right props for a list that is the same everywhere in the
-     * document and for having no list at all. Like them, it opens on typing.
-     *
-     * Compared by identity: build it in a `useMemo` or the editor rebuilds its whole
-     * extension tree on every render.
-     */
-    completionSource?: CompletionSource;
-    /**
-     * Configuration variables, completed into `{{name}}`. Independent of
-     * `completionSource`: both are offered, so a caller keeps its own completions and
-     * gets variables spelled the way the rest of the platform writes them.
-     */
-    variables?: EditorVariable[];
-    extraKeys?: Record<string, () => void>;
-    withToggleCommentHint?: boolean;
-    withAutofocus?: boolean;
-    withLineNumbers?: boolean;
-    withLineWrapping?: boolean;
-    withCollapseUnchanged?: boolean;
-    withCopyButton?: boolean;
-    completeAny?: boolean;
-    help?: ReactNode;
-    helpPostfix?: ReactNode;
-    /**
-     * Extra actions for the toolbar that floats over the editor's top-right corner,
-     * beside the copy button. The toolbar is a 28px chip, so pass `size="icon-xs"`
-     * buttons — a default-sized one grows the chip and de-aligns the copy button.
-     */
-    renderAdditionalButtons?: (value?: string) => ReactNode;
-    className?: string;
+  value: string;
+  previousValue?: string;
+  /**
+   * `'field'` draws the chrome an `InputGroup` draws — surface, border, radius,
+   * focus ring, read-only wash — for an editor that is one control among others
+   * in a form. It sizes to its content, so don't pin its height.
+   *
+   * `'plain'` (the default) is the full-bleed surface of an editor that *is* the
+   * panel: a modal body, a chat block, a fixed-height viewer already framed by
+   * whatever contains it.
+   */
+  variant?: 'plain' | 'field';
+  mode?: LANGUAGE_MODE;
+  placeholder?: string;
+  /** Names the editable region for screen readers — the editor has no visible label of its own. */
+  ariaLabel?: string;
+  /**
+   * Highlights every occurrence and scrolls the selected one into view. The find
+   * UI is the caller's — pass the query it holds, and omit both props entirely to
+   * leave the search extension uninstalled.
+   */
+  searchQuery?: string;
+  searchMatchIndex?: number;
+  readOnly?: boolean;
+  /**
+   * Refuses edits while leaving the editor looking and behaving as it did — for a
+   * transient lock such as an in-flight save, where a keystroke landing mid-request
+   * would be overwritten by the response. `readOnly` is the wrong prop for that:
+   * it turns the editor into a viewer, greying the surface and taking the lint
+   * marks and completions with it.
+   */
+  inputLocked?: boolean;
+  /**
+   * A flat list of completions, offered everywhere in the document. One word per
+   * label: CodeMirror derives the pattern for the word being completed from the
+   * labels' characters, so a space in one widens it across whitespace and the
+   * editor offers nothing past the first word of a line. A phrase belongs in
+   * `completionSource`.
+   *
+   * Compared by identity, like `completionSource` — hand the editor a stable array.
+   */
+  autocompletions?: string[];
+  /**
+   * Completions that depend on where the cursor is — a column list offered only
+   * after its table, say. Wins over both `autocompletions` and `completeAny`,
+   * which stay the right props for a list that is the same everywhere in the
+   * document and for having no list at all. Like them, it opens on typing.
+   *
+   * Compared by identity: build it in a `useMemo` or the editor rebuilds its whole
+   * extension tree on every render.
+   */
+  completionSource?: CompletionSource;
+  /**
+   * Configuration variables, completed into `{{name}}`. Independent of
+   * `completionSource`: both are offered, so a caller keeps its own completions and
+   * gets variables spelled the way the rest of the platform writes them.
+   */
+  variables?: EditorVariable[];
+  extraKeys?: Record<string, () => void>;
+  withToggleCommentHint?: boolean;
+  withAutofocus?: boolean;
+  withLineNumbers?: boolean;
+  withLineWrapping?: boolean;
+  withCollapseUnchanged?: boolean;
+  withCopyButton?: boolean;
+  completeAny?: boolean;
+  help?: ReactNode;
+  helpPostfix?: ReactNode;
+  /**
+   * Extra actions for the toolbar that floats over the editor's top-right corner,
+   * beside the copy button. The toolbar is a 28px chip, so pass `size="icon-xs"`
+   * buttons — a default-sized one grows the chip and de-aligns the copy button.
+   */
+  renderAdditionalButtons?: (value?: string) => ReactNode;
+  className?: string;
 } & ({
-    readOnly: true;
-    onChange?: never;
+  readOnly: true;
+  onChange?: never;
 } | {
-    readOnly?: boolean;
-    onChange: (value: string) => void;
+  readOnly?: boolean;
+  onChange: (value: string) => void;
 });
-declare const CodeEditor: ({ value, previousValue, onChange, variant, mode, placeholder, ariaLabel, searchQuery, searchMatchIndex, readOnly, inputLocked, autocompletions, completionSource, variables, extraKeys, withToggleCommentHint, withAutofocus, withLineNumbers, withLineWrapping, withCollapseUnchanged, withCopyButton, completeAny, help, helpPostfix, renderAdditionalButtons, className, }: Props$2) => react_jsx_runtime.JSX.Element;
-
+declare const CodeEditor: ({ value, previousValue, onChange, variant, mode, placeholder, ariaLabel, searchQuery, searchMatchIndex, readOnly, inputLocked, autocompletions, completionSource, variables, extraKeys, withToggleCommentHint, withAutofocus, withLineNumbers, withLineWrapping, withCollapseUnchanged, withCopyButton, completeAny, help, helpPostfix, renderAdditionalButtons, className }: Props$2) => import("react/jsx-runtime").JSX.Element;
+//#endregion
+//#region src/components/CodeEditor/highlighting.d.ts
 type HighlightedLines = {
+  from: number;
+  to: number;
+  error?: {
     from: number;
     to: number;
-    error?: {
-        from: number;
-        to: number;
-    };
-    processing?: {
-        from: number;
-        to: number;
-    };
+  };
+  processing?: {
+    from: number;
+    to: number;
+  };
 } | null;
-
+//#endregion
+//#region src/components/CodeEditor/SqlEditor.d.ts
 type Props$1 = {
-    value: string;
-    onChange?: (value: string) => void;
-    onSelectionChange?: (text: string) => void;
-    onCreateEditor?: (view: EditorView, state: EditorState) => void;
-    onDestroyEditor?: () => void;
-    onBlurEditor?: (view: EditorView) => void;
-    onFocusEditor?: (view: EditorView) => void;
-    readOnly: boolean;
-    placeholder?: string;
-    searchQuery?: string;
-    searchMatchIndex?: number;
-    queryParser?: (sql: string) => Promise<string[]>;
-    autoFocus?: boolean;
-    lineNumbers?: boolean;
-    className?: string;
-    /**
-     * A schema is too large to compare by value, so this one prop keeps the
-     * identity requirement every other prop here is now free of: hand the editor
-     * a stable object, or it rebuilds its whole extension tree on every render.
-     */
-    schema?: SQLNamespace;
-    /**
-     * Completions the caller knows and the schema does not — a table the code writes to
-     * before it exists, say. Added to the schema, keyword and variable completions; unlike
-     * `CodeEditor`'s prop of the same name, it replaces nothing.
-     *
-     * Compared by identity: build it in a `useMemo` or the editor rebuilds its whole
-     * extension tree on every render.
-     */
-    completionSource?: CompletionSource;
-    variables?: EditorVariable[];
-    defaultSchema?: string;
-    defaultDatabase?: string;
-    highlightLines?: HighlightedLines;
-    dialect?: SqlDialectName;
+  value: string;
+  onChange?: (value: string) => void;
+  onSelectionChange?: (text: string) => void;
+  onCreateEditor?: (view: EditorView$1, state: EditorState) => void;
+  onDestroyEditor?: () => void;
+  onBlurEditor?: (view: EditorView$1) => void;
+  onFocusEditor?: (view: EditorView$1) => void;
+  readOnly: boolean;
+  placeholder?: string;
+  searchQuery?: string;
+  searchMatchIndex?: number;
+  queryParser?: (sql: string) => Promise<string[]>;
+  autoFocus?: boolean;
+  lineNumbers?: boolean;
+  className?: string;
+  /**
+   * A schema is too large to compare by value, so this one prop keeps the
+   * identity requirement every other prop here is now free of: hand the editor
+   * a stable object, or it rebuilds its whole extension tree on every render.
+   */
+  schema?: SQLNamespace;
+  /**
+   * Completions the caller knows and the schema does not — a table the code writes to
+   * before it exists, say. Added to the schema, keyword and variable completions; unlike
+   * `CodeEditor`'s prop of the same name, it replaces nothing.
+   *
+   * Compared by identity: build it in a `useMemo` or the editor rebuilds its whole
+   * extension tree on every render.
+   */
+  completionSource?: CompletionSource;
+  variables?: EditorVariable[];
+  defaultSchema?: string;
+  defaultDatabase?: string;
+  highlightLines?: HighlightedLines;
+  dialect?: SqlDialectName$1;
 };
-declare const SqlEditor: ({ value, onChange, onSelectionChange, onCreateEditor, onDestroyEditor, onBlurEditor, onFocusEditor, placeholder, searchQuery, searchMatchIndex, readOnly, queryParser, autoFocus, lineNumbers, className, schema, completionSource, variables, defaultDatabase, defaultSchema, highlightLines, dialect, }: Props$1) => react_jsx_runtime.JSX.Element;
-
+declare const SqlEditor: ({ value, onChange, onSelectionChange, onCreateEditor, onDestroyEditor, onBlurEditor, onFocusEditor, placeholder, searchQuery, searchMatchIndex, readOnly, queryParser, autoFocus, lineNumbers, className, schema, completionSource, variables, defaultDatabase, defaultSchema, highlightLines, dialect }: Props$1) => import("react/jsx-runtime").JSX.Element;
+//#endregion
+//#region src/components/MergeEditor/MergeEditor.d.ts
 type Props = {
-    mergeValue: string;
-    handleMergeChange: (value: string) => void;
-    leftText: string;
-    rightText: string;
-    leftConflicts: MergeConflict[];
-    rightConflicts: MergeConflict[];
-    leftHighlightedLines: Set<number>;
-    rightHighlightedLines: Set<number>;
-    leftClassification: Map<number, ChangeClassification>;
-    rightClassification: Map<number, ChangeClassification>;
-    mergeHighlightedLines: Set<number>;
-    mergeClassification: Map<number, ChangeClassification>;
-    acceptLeft: (conflict: MergeConflict) => void;
-    acceptRight: (conflict: MergeConflict) => void;
-    dismissLeft: (conflict: MergeConflict) => void;
-    dismissRight: (conflict: MergeConflict) => void;
-    leftHeader?: ReactNode;
-    middleHeader?: ReactNode;
-    middleHeaderClassName?: string;
-    middleClassName?: string;
-    rightHeader?: ReactNode;
-    className?: string;
-    /**
-     * Paint the corresponding read-only pane with the error palette to signal the
-     * side has been deleted upstream. The diff is still rendered so the user can
-     * see what was lost; accept/dismiss controls for that side are suppressed.
-     */
-    leftDeleted?: boolean;
-    rightDeleted?: boolean;
+  mergeValue: string;
+  handleMergeChange: (value: string) => void;
+  leftText: string;
+  rightText: string;
+  leftConflicts: MergeConflict[];
+  rightConflicts: MergeConflict[];
+  leftHighlightedLines: Set<number>;
+  rightHighlightedLines: Set<number>;
+  leftClassification: Map<number, ChangeClassification>;
+  rightClassification: Map<number, ChangeClassification>;
+  mergeHighlightedLines: Set<number>;
+  mergeClassification: Map<number, ChangeClassification>;
+  acceptLeft: (conflict: MergeConflict) => void;
+  acceptRight: (conflict: MergeConflict) => void;
+  dismissLeft: (conflict: MergeConflict) => void;
+  dismissRight: (conflict: MergeConflict) => void;
+  leftHeader?: ReactNode;
+  middleHeader?: ReactNode;
+  middleHeaderClassName?: string;
+  middleClassName?: string;
+  rightHeader?: ReactNode;
+  className?: string;
+  /**
+   * Paint the corresponding read-only pane with the error palette to signal the
+   * side has been deleted upstream. The diff is still rendered so the user can
+   * see what was lost; accept/dismiss controls for that side are suppressed.
+   */
+  leftDeleted?: boolean;
+  rightDeleted?: boolean;
 };
-declare const MergeEditor: ({ mergeValue, handleMergeChange, leftText, rightText, leftConflicts, rightConflicts, leftHighlightedLines, rightHighlightedLines, leftClassification, rightClassification, mergeHighlightedLines, mergeClassification, acceptLeft, acceptRight, dismissLeft, dismissRight, leftHeader, middleHeader, middleHeaderClassName, middleClassName, rightHeader, className, leftDeleted, rightDeleted, }: Props) => react_jsx_runtime.JSX.Element;
-
-export { CodeEditor, type EditorVariable, type LANGUAGE_MODE, LANGUAGE_MODES, MergeEditor, SqlEditor, isLanguageMode };
+declare const MergeEditor: ({ mergeValue, handleMergeChange, leftText, rightText, leftConflicts, rightConflicts, leftHighlightedLines, rightHighlightedLines, leftClassification, rightClassification, mergeHighlightedLines, mergeClassification, acceptLeft, acceptRight, dismissLeft, dismissRight, leftHeader, middleHeader, middleHeaderClassName, middleClassName, rightHeader, className, leftDeleted, rightDeleted }: Props) => import("react/jsx-runtime").JSX.Element;
+//#endregion
+export { CodeEditor, type EditorVariable, type LANGUAGE_MODE, LANGUAGE_MODES, MergeEditor, type SqlDialectName, SqlEditor, isLanguageMode };
+//# sourceMappingURL=editors.d.ts.map