@alpic-ai/ui 0.0.0-staging.gfdded29 → 0.0.0-staging.gfecc574

This diff represents the content of publicly available package versions that have been released to one of the supported registries. The information contained in this diff is provided for informational purposes only and reflects changes between package versions as they appear in their respective public registries.
Files changed (179) hide show
  1. package/dist/components/accordion-card.d.mts +5 -30
  2. package/dist/components/accordion-card.mjs +1 -5
  3. package/dist/components/accordion.d.mts +5 -23
  4. package/dist/components/accordion.mjs +1 -5
  5. package/dist/components/alert.d.mts +6 -25
  6. package/dist/components/area-chart.d.mts +4 -25
  7. package/dist/components/area-chart.mjs +25 -118
  8. package/dist/components/attachment-tile.d.mts +1 -13
  9. package/dist/components/avatar.d.mts +5 -28
  10. package/dist/components/badge.d.mts +2 -9
  11. package/dist/components/bar-chart.d.mts +6 -22
  12. package/dist/components/bar-chart.mjs +68 -92
  13. package/dist/components/bar-list.d.mts +6 -15
  14. package/dist/components/bar-list.mjs +47 -21
  15. package/dist/components/breadcrumb.d.mts +8 -35
  16. package/dist/components/breadcrumb.mjs +1 -1
  17. package/dist/components/button.d.mts +2 -15
  18. package/dist/components/button.mjs +5 -4
  19. package/dist/components/card.d.mts +7 -30
  20. package/dist/components/chart-card.d.mts +3 -14
  21. package/dist/components/chart-container.d.mts +1 -6
  22. package/dist/components/chart-legend.d.mts +7 -11
  23. package/dist/components/chart-legend.mjs +21 -7
  24. package/dist/components/chart-primitives.d.mts +63 -0
  25. package/dist/components/chart-primitives.mjs +129 -0
  26. package/dist/components/chart-tooltip.d.mts +4 -14
  27. package/dist/components/chart-tooltip.mjs +54 -27
  28. package/dist/components/checkbox.d.mts +1 -5
  29. package/dist/components/collapsible.d.mts +3 -10
  30. package/dist/components/combobox.d.mts +9 -46
  31. package/dist/components/combobox.mjs +3 -2
  32. package/dist/components/command.d.mts +8 -32
  33. package/dist/components/copyable.d.mts +2 -9
  34. package/dist/components/description-list.d.mts +4 -17
  35. package/dist/components/dialog.d.mts +10 -42
  36. package/dist/components/dialog.mjs +1 -1
  37. package/dist/components/donut-chart.d.mts +3 -18
  38. package/dist/components/donut-chart.mjs +1 -3
  39. package/dist/components/dropdown-menu.d.mts +14 -56
  40. package/dist/components/dropdown-menu.mjs +1 -0
  41. package/dist/components/editable.d.mts +101 -0
  42. package/dist/components/editable.mjs +509 -0
  43. package/dist/components/field.d.mts +14 -0
  44. package/dist/components/field.mjs +41 -0
  45. package/dist/components/form.d.mts +18 -116
  46. package/dist/components/form.mjs +25 -12
  47. package/dist/components/github-button.d.mts +1 -6
  48. package/dist/components/heatmap-chart.d.mts +6 -22
  49. package/dist/components/heatmap-chart.mjs +146 -116
  50. package/dist/components/input-group.d.mts +3 -15
  51. package/dist/components/input.d.mts +3 -14
  52. package/dist/components/input.mjs +14 -35
  53. package/dist/components/label.d.mts +1 -5
  54. package/dist/components/line-chart.d.mts +5 -23
  55. package/dist/components/line-chart.mjs +31 -114
  56. package/dist/components/page-loader.d.mts +1 -3
  57. package/dist/components/pagination.d.mts +1 -8
  58. package/dist/components/popover.d.mts +4 -16
  59. package/dist/components/radio-group.d.mts +2 -9
  60. package/dist/components/scroll-area.d.mts +2 -11
  61. package/dist/components/scroll-area.mjs +1 -1
  62. package/dist/components/select-trigger-variants.d.mts +3 -8
  63. package/dist/components/select-trigger-variants.mjs +1 -5
  64. package/dist/components/select.d.mts +8 -35
  65. package/dist/components/select.mjs +1 -1
  66. package/dist/components/separator.d.mts +1 -7
  67. package/dist/components/sheet.d.mts +9 -35
  68. package/dist/components/shimmer-text.d.mts +2 -7
  69. package/dist/components/sidebar.d.mts +22 -113
  70. package/dist/components/sidebar.mjs +2 -2
  71. package/dist/components/skeleton.d.mts +1 -6
  72. package/dist/components/skeleton.mjs +1 -1
  73. package/dist/components/sonner.d.mts +1 -8
  74. package/dist/components/spinner.d.mts +4 -16
  75. package/dist/components/stat.d.mts +10 -13
  76. package/dist/components/stat.mjs +74 -64
  77. package/dist/components/status-dot.d.mts +2 -8
  78. package/dist/components/switch.d.mts +1 -5
  79. package/dist/components/switch.mjs +1 -1
  80. package/dist/components/table.d.mts +12 -39
  81. package/dist/components/table.mjs +4 -4
  82. package/dist/components/tabs.d.mts +7 -36
  83. package/dist/components/tabs.mjs +3 -3
  84. package/dist/components/tag.d.mts +3 -20
  85. package/dist/components/task-progress.d.mts +2 -11
  86. package/dist/components/textarea.d.mts +1 -11
  87. package/dist/components/textarea.mjs +11 -34
  88. package/dist/components/toggle-group.d.mts +2 -15
  89. package/dist/components/toggle-group.mjs +2 -2
  90. package/dist/components/tooltip-icon-button.d.mts +0 -1
  91. package/dist/components/tooltip.d.mts +4 -17
  92. package/dist/components/typography.d.mts +5 -19
  93. package/dist/components/visually-hidden-input.d.mts +12 -0
  94. package/dist/components/visually-hidden-input.mjs +109 -0
  95. package/dist/components/wizard.d.mts +1 -7
  96. package/dist/hooks/use-as-ref.d.mts +5 -0
  97. package/dist/hooks/use-as-ref.mjs +12 -0
  98. package/dist/hooks/use-chart-theme.d.mts +3 -4
  99. package/dist/hooks/use-copy-to-clipboard.d.mts +2 -5
  100. package/dist/hooks/use-isomorphic-layout-effect.d.mts +5 -0
  101. package/dist/hooks/use-isomorphic-layout-effect.mjs +5 -0
  102. package/dist/hooks/use-lazy-ref.d.mts +6 -0
  103. package/dist/hooks/use-lazy-ref.mjs +9 -0
  104. package/dist/hooks/use-mobile.d.mts +2 -3
  105. package/dist/hooks/use-mobile.mjs +1 -2
  106. package/dist/lib/chart-palette.d.mts +17 -3
  107. package/dist/lib/chart-palette.mjs +29 -27
  108. package/dist/lib/chart.d.mts +8 -7
  109. package/dist/lib/chart.mjs +2 -11
  110. package/dist/lib/cn.d.mts +2 -4
  111. package/dist/lib/compose-refs.mjs +23 -0
  112. package/package.json +38 -38
  113. package/src/components/accordion-card.tsx +1 -5
  114. package/src/components/accordion.tsx +1 -5
  115. package/src/components/area-chart.tsx +37 -153
  116. package/src/components/attachment-tile.tsx +0 -5
  117. package/src/components/avatar.tsx +0 -2
  118. package/src/components/bar-chart.tsx +91 -108
  119. package/src/components/bar-list.tsx +58 -26
  120. package/src/components/breadcrumb.tsx +1 -0
  121. package/src/components/button.tsx +5 -4
  122. package/src/components/chart-legend.tsx +47 -10
  123. package/src/components/chart-primitives.tsx +182 -0
  124. package/src/components/chart-tooltip.tsx +22 -6
  125. package/src/components/combobox.tsx +28 -37
  126. package/src/components/dialog.tsx +1 -0
  127. package/src/components/donut-chart.tsx +1 -4
  128. package/src/components/dropdown-menu.tsx +1 -12
  129. package/src/components/editable.tsx +871 -0
  130. package/src/components/field.tsx +57 -0
  131. package/src/components/form.tsx +33 -14
  132. package/src/components/heatmap-chart.tsx +48 -10
  133. package/src/components/input-group.tsx +1 -0
  134. package/src/components/input.tsx +11 -33
  135. package/src/components/line-chart.tsx +49 -145
  136. package/src/components/scroll-area.tsx +1 -1
  137. package/src/components/select-trigger-variants.ts +1 -5
  138. package/src/components/select.tsx +1 -10
  139. package/src/components/sidebar.tsx +2 -2
  140. package/src/components/skeleton.tsx +1 -1
  141. package/src/components/stat.tsx +85 -46
  142. package/src/components/switch.tsx +1 -0
  143. package/src/components/table.tsx +14 -9
  144. package/src/components/tabs.tsx +4 -22
  145. package/src/components/tag.tsx +0 -6
  146. package/src/components/task-progress.tsx +2 -14
  147. package/src/components/textarea.tsx +4 -34
  148. package/src/components/toggle-group.tsx +2 -2
  149. package/src/components/visually-hidden-input.tsx +148 -0
  150. package/src/components/wizard.tsx +0 -6
  151. package/src/hooks/use-as-ref.ts +15 -0
  152. package/src/hooks/use-chart-theme.ts +2 -0
  153. package/src/hooks/use-isomorphic-layout-effect.ts +5 -0
  154. package/src/hooks/use-lazy-ref.ts +13 -0
  155. package/src/lib/chart-palette.ts +23 -39
  156. package/src/lib/chart.ts +3 -15
  157. package/src/lib/compose-refs.ts +38 -0
  158. package/src/stories/area-chart.stories.tsx +10 -6
  159. package/src/stories/bar-chart.stories.tsx +10 -6
  160. package/src/stories/button.stories.tsx +1 -15
  161. package/src/stories/combobox.stories.tsx +0 -12
  162. package/src/stories/donut-chart.stories.tsx +8 -6
  163. package/src/stories/dropdown-menu.stories.tsx +0 -4
  164. package/src/stories/form.stories.tsx +0 -6
  165. package/src/stories/heatmap-chart.stories.tsx +0 -1
  166. package/src/stories/input-group.stories.tsx +0 -4
  167. package/src/stories/input.stories.tsx +3 -8
  168. package/src/stories/line-chart.stories.tsx +128 -86
  169. package/src/stories/sidebar.stories.tsx +1 -4
  170. package/src/stories/skeleton.stories.tsx +0 -2
  171. package/src/stories/stat.stories.tsx +8 -6
  172. package/src/stories/table.stories.tsx +0 -5
  173. package/src/stories/tabs.stories.tsx +0 -11
  174. package/src/stories/textarea.stories.tsx +7 -0
  175. package/src/stories/toggle-group.stories.tsx +0 -5
  176. package/src/stories/wizard.stories.tsx +0 -4
  177. package/dist/hooks/use-reduced-motion.d.mts +0 -4
  178. package/dist/hooks/use-reduced-motion.mjs +0 -16
  179. package/src/hooks/use-reduced-motion.ts +0 -17
@@ -1,40 +1,15 @@
1
1
  import * as AccordionPrimitive from "@radix-ui/react-accordion";
2
2
  import * as React$1 from "react";
3
-
4
3
  //#region src/components/accordion-card.d.ts
5
- declare function AccordionCard({
6
- defaultOpen,
7
- open,
8
- onOpenChange,
9
- disabled,
10
- className,
11
- children,
12
- ...props
13
- }: {
4
+ declare function AccordionCard({ defaultOpen, open, onOpenChange, disabled, className, children, ...props }: {
14
5
  defaultOpen?: boolean;
15
6
  open?: boolean;
16
7
  onOpenChange?: (nextOpen: boolean) => void;
17
8
  disabled?: boolean;
18
9
  } & Omit<React$1.ComponentProps<typeof AccordionPrimitive.Root>, "type" | "collapsible" | "defaultValue" | "value" | "onValueChange" | "disabled">): React$1.JSX.Element;
19
- declare function AccordionCardHeader({
20
- className,
21
- children,
22
- ...props
23
- }: React$1.ComponentProps<typeof AccordionPrimitive.Trigger>): React$1.JSX.Element;
24
- declare function AccordionCardTitle({
25
- className,
26
- children,
27
- ...props
28
- }: React$1.HTMLAttributes<HTMLHeadingElement>): React$1.JSX.Element;
29
- /**
30
- * `className` is forwarded to the inner padding wrapper, not the Radix Content root.
31
- * The root always applies overflow-hidden and the accordion animations.
32
- * To override overflow or animation behavior, wrap this component in an additional element.
33
- */
34
- declare function AccordionCardContent({
35
- className,
36
- children,
37
- ...props
38
- }: React$1.ComponentProps<typeof AccordionPrimitive.Content>): React$1.JSX.Element;
10
+ declare function AccordionCardHeader({ className, children, ...props }: React$1.ComponentProps<typeof AccordionPrimitive.Trigger>): React$1.JSX.Element;
11
+ declare function AccordionCardTitle({ className, children, ...props }: React$1.HTMLAttributes<HTMLHeadingElement>): React$1.JSX.Element;
12
+ /** `className` styles the inner padding wrapper, not the Radix Content root, which keeps overflow-hidden and the accordion animations. */
13
+ declare function AccordionCardContent({ className, children, ...props }: React$1.ComponentProps<typeof AccordionPrimitive.Content>): React$1.JSX.Element;
39
14
  //#endregion
40
15
  export { AccordionCard, AccordionCardContent, AccordionCardHeader, AccordionCardTitle };
@@ -41,11 +41,7 @@ function AccordionCardTitle({ className, children, ...props }) {
41
41
  children
42
42
  });
43
43
  }
44
- /**
45
- * `className` is forwarded to the inner padding wrapper, not the Radix Content root.
46
- * The root always applies overflow-hidden and the accordion animations.
47
- * To override overflow or animation behavior, wrap this component in an additional element.
48
- */
44
+ /** `className` styles the inner padding wrapper, not the Radix Content root, which keeps overflow-hidden and the accordion animations. */
49
45
  function AccordionCardContent({ className, children, ...props }) {
50
46
  return /* @__PURE__ */ jsx(AccordionPrimitive.Content, {
51
47
  "data-slot": "accordion-card-content",
@@ -1,28 +1,10 @@
1
1
  import * as AccordionPrimitive from "@radix-ui/react-accordion";
2
2
  import * as React$1 from "react";
3
-
4
3
  //#region src/components/accordion.d.ts
5
- declare function Accordion({
6
- ...props
7
- }: React$1.ComponentProps<typeof AccordionPrimitive.Root>): React$1.JSX.Element;
8
- declare function AccordionItem({
9
- className,
10
- ...props
11
- }: React$1.ComponentProps<typeof AccordionPrimitive.Item>): React$1.JSX.Element;
12
- declare function AccordionTrigger({
13
- className,
14
- children,
15
- ...props
16
- }: React$1.ComponentProps<typeof AccordionPrimitive.Trigger>): React$1.JSX.Element;
17
- /**
18
- * `className` is forwarded to the inner padding wrapper, not the Radix Content root.
19
- * The root always applies overflow-hidden and the accordion animations.
20
- * To override overflow or animation behavior, wrap this component in an additional element.
21
- */
22
- declare function AccordionContent({
23
- className,
24
- children,
25
- ...props
26
- }: React$1.ComponentProps<typeof AccordionPrimitive.Content>): React$1.JSX.Element;
4
+ declare function Accordion({ ...props }: React$1.ComponentProps<typeof AccordionPrimitive.Root>): React$1.JSX.Element;
5
+ declare function AccordionItem({ className, ...props }: React$1.ComponentProps<typeof AccordionPrimitive.Item>): React$1.JSX.Element;
6
+ declare function AccordionTrigger({ className, children, ...props }: React$1.ComponentProps<typeof AccordionPrimitive.Trigger>): React$1.JSX.Element;
7
+ /** `className` styles the inner padding wrapper, not the Radix Content root, which keeps overflow-hidden and the accordion animations. */
8
+ declare function AccordionContent({ className, children, ...props }: React$1.ComponentProps<typeof AccordionPrimitive.Content>): React$1.JSX.Element;
27
9
  //#endregion
28
10
  export { Accordion, AccordionContent, AccordionItem, AccordionTrigger };
@@ -28,11 +28,7 @@ function AccordionTrigger({ className, children, ...props }) {
28
28
  })
29
29
  });
30
30
  }
31
- /**
32
- * `className` is forwarded to the inner padding wrapper, not the Radix Content root.
33
- * The root always applies overflow-hidden and the accordion animations.
34
- * To override overflow or animation behavior, wrap this component in an additional element.
35
- */
31
+ /** `className` styles the inner padding wrapper, not the Radix Content root, which keeps overflow-hidden and the accordion animations. */
36
32
  function AccordionContent({ className, children, ...props }) {
37
33
  return /* @__PURE__ */ jsx(AccordionPrimitive.Content, {
38
34
  "data-slot": "accordion-content",
@@ -1,38 +1,19 @@
1
1
  import { VariantProps } from "class-variance-authority";
2
2
  import * as React$1 from "react";
3
-
4
3
  //#region src/components/alert.d.ts
5
4
  declare const alertVariants: (props?: ({
6
- variant?: "default" | "destructive" | "warning" | "success" | null | undefined;
5
+ variant?: "destructive" | "default" | "success" | "warning" | null | undefined;
7
6
  } & import("class-variance-authority/types").ClassProp) | undefined) => string;
8
7
  interface AlertProps extends React$1.HTMLAttributes<HTMLDivElement>, VariantProps<typeof alertVariants> {}
9
- declare function Alert({
10
- className,
11
- variant,
12
- ...props
13
- }: AlertProps): React$1.JSX.Element;
14
- declare function AlertTitle({
15
- className,
16
- ...props
17
- }: React$1.HTMLAttributes<HTMLParagraphElement>): React$1.JSX.Element;
18
- declare function AlertDescription({
19
- className,
20
- ...props
21
- }: React$1.HTMLAttributes<HTMLDivElement>): React$1.JSX.Element;
8
+ declare function Alert({ className, variant, ...props }: AlertProps): React$1.JSX.Element;
9
+ declare function AlertTitle({ className, ...props }: React$1.HTMLAttributes<HTMLParagraphElement>): React$1.JSX.Element;
10
+ declare function AlertDescription({ className, ...props }: React$1.HTMLAttributes<HTMLDivElement>): React$1.JSX.Element;
22
11
  interface ConvenienceAlertProps {
23
12
  title?: string;
24
13
  description?: React$1.ReactNode;
25
14
  className?: string;
26
15
  }
27
- declare function ErrorAlert({
28
- title,
29
- description,
30
- className
31
- }: ConvenienceAlertProps): React$1.JSX.Element;
32
- declare function WarningAlert({
33
- title,
34
- description,
35
- className
36
- }: ConvenienceAlertProps): React$1.JSX.Element;
16
+ declare function ErrorAlert({ title, description, className }: ConvenienceAlertProps): React$1.JSX.Element;
17
+ declare function WarningAlert({ title, description, className }: ConvenienceAlertProps): React$1.JSX.Element;
37
18
  //#endregion
38
19
  export { Alert, AlertDescription, AlertTitle, ErrorAlert, WarningAlert };
@@ -1,20 +1,19 @@
1
1
  import { ChartSeries } from "../lib/chart.mjs";
2
2
  import { ChartPaletteName } from "../lib/chart-palette.mjs";
3
3
  import * as React$1 from "react";
4
-
5
4
  //#region src/components/area-chart.d.ts
6
5
  declare const CURVE_TYPE: {
7
6
  readonly monotone: "monotone";
8
7
  readonly linear: "linear";
9
8
  readonly step: "stepAfter";
10
9
  };
11
- interface ChartMarker {
10
+ export interface ChartMarker {
12
11
  x: string | number;
13
12
  y: number;
14
13
  label?: string;
15
14
  color?: string;
16
15
  }
17
- interface AreaChartProps {
16
+ export interface AreaChartProps {
18
17
  data: ReadonlyArray<Record<string, string | number | null | undefined>>;
19
18
  index: string;
20
19
  series: ChartSeries[];
@@ -39,26 +38,6 @@ interface AreaChartProps {
39
38
  labelFormatter?: (label: string | number) => string;
40
39
  className?: string;
41
40
  }
42
- declare function AreaChart({
43
- data,
44
- index,
45
- series,
46
- variant,
47
- curve,
48
- legend,
49
- legendAlign,
50
- valueFlags,
51
- height,
52
- yAxisWidth,
53
- palette,
54
- referenceLine,
55
- markers,
56
- lastValueLabel,
57
- texture,
58
- loading,
59
- valueFormatter,
60
- labelFormatter,
61
- className
62
- }: AreaChartProps): React$1.JSX.Element;
41
+ declare function AreaChart({ data, index, series, variant, curve, legend, legendAlign, valueFlags, height, yAxisWidth, palette, referenceLine, markers, lastValueLabel, texture, loading, valueFormatter, labelFormatter, className }: AreaChartProps): React$1.JSX.Element;
63
42
  //#endregion
64
- export { AreaChart, AreaChartProps, ChartMarker };
43
+ export { AreaChart };
@@ -1,13 +1,14 @@
1
1
  "use client";
2
2
  import { cn } from "../lib/cn.mjs";
3
- import { useReducedMotion } from "../hooks/use-reduced-motion.mjs";
4
3
  import { makeXAxisTick, orderByLuminance, resolveSeries } from "../lib/chart.mjs";
5
4
  import { useChartContext } from "./chart-container.mjs";
6
5
  import { ChartLegend } from "./chart-legend.mjs";
6
+ import { computeNumericMax, makeActiveDot, makeChartAxis, makeLastValueLabel, makeLegendItems, renderMarkers, renderReferenceLine } from "./chart-primitives.mjs";
7
7
  import { ChartTooltipContent } from "./chart-tooltip.mjs";
8
+ import { Skeleton } from "./skeleton.mjs";
8
9
  import { jsx, jsxs } from "react/jsx-runtime";
9
10
  import * as React$1 from "react";
10
- import { Area, AreaChart as AreaChart$1, CartesianGrid, LabelList, ReferenceArea, ReferenceDot, ReferenceLine, ResponsiveContainer, Tooltip, XAxis, YAxis } from "recharts";
11
+ import { Area, AreaChart as AreaChart$1, CartesianGrid, LabelList, ResponsiveContainer, Tooltip, XAxis, YAxis } from "recharts";
11
12
  //#region src/components/area-chart.tsx
12
13
  const CURVE_TYPE = {
13
14
  monotone: "monotone",
@@ -17,28 +18,13 @@ const CURVE_TYPE = {
17
18
  function AreaChart({ data, index, series, variant = "stacked", curve = "monotone", legend = false, legendAlign = "left", valueFlags = false, height = 200, yAxisWidth = 48, palette, referenceLine, markers, lastValueLabel = false, texture = false, loading = false, valueFormatter = (value) => value.toLocaleString("en-US"), labelFormatter, className }) {
18
19
  const { palette: paletteColors, theme } = useChartContext(palette);
19
20
  const reactId = React$1.useId().replace(/:/g, "");
20
- const animated = !useReducedMotion();
21
21
  const resolved = resolveSeries(series, paletteColors, theme);
22
22
  const stacked = variant === "stacked" || variant === "expand";
23
23
  const rendered = stacked ? orderByLuminance(resolved) : resolved;
24
24
  const filled = !(variant === "grouped" && rendered.length > 1);
25
25
  const lead = resolved[0];
26
26
  const withTotal = stacked && rendered.length > 1;
27
- const numericMax = React$1.useMemo(() => {
28
- let max = 0;
29
- for (const row of data) {
30
- let rowTotal = 0;
31
- for (const entry of series) {
32
- const value = Number(row[entry.key]);
33
- if (Number.isFinite(value)) {
34
- rowTotal += value;
35
- if (!stacked && value > max) max = value;
36
- }
37
- }
38
- if (stacked && rowTotal > max) max = rowTotal;
39
- }
40
- return max;
41
- }, [
27
+ const numericMax = React$1.useMemo(() => computeNumericMax(data, series, stacked), [
42
28
  data,
43
29
  series,
44
30
  stacked
@@ -50,79 +36,21 @@ function AreaChart({ data, index, series, variant = "stacked", curve = "monotone
50
36
  bottom: 2,
51
37
  left: 0
52
38
  };
53
- const axis = {
54
- stroke: theme.border,
55
- tick: {
56
- fill: theme.axisForeground,
57
- fontSize: 10,
58
- fontFamily: theme.fontMono
59
- },
60
- tickLine: false,
61
- axisLine: {
62
- stroke: theme.border,
63
- strokeOpacity: .6
64
- }
65
- };
66
- const legendItems = resolved.map((entry) => ({
67
- name: entry.name,
68
- color: entry.color,
69
- dashed: entry.dashed
70
- }));
71
- const activeDotFor = (entry) => valueFlags ? (dotProps) => {
72
- if (dotProps.cx == null || dotProps.cy == null) return /* @__PURE__ */ jsx("g", {});
73
- return /* @__PURE__ */ jsxs("g", { children: [/* @__PURE__ */ jsx("circle", {
74
- cx: dotProps.cx,
75
- cy: dotProps.cy,
76
- r: 3.5,
77
- fill: entry.color,
78
- stroke: theme.card,
79
- strokeWidth: 2
80
- }), /* @__PURE__ */ jsx("text", {
81
- x: dotProps.cx,
82
- y: dotProps.cy - 8,
83
- textAnchor: "middle",
84
- fill: entry.color,
85
- fontFamily: theme.fontMono,
86
- fontSize: 10,
87
- style: { fontVariantNumeric: "tabular-nums" },
88
- children: valueFormatter(Number(dotProps.value ?? 0))
89
- })] });
90
- } : {
91
- r: 3.5,
92
- fill: entry.color,
93
- stroke: theme.card,
94
- strokeWidth: 2
95
- };
39
+ const axis = makeChartAxis(theme);
40
+ const legendItems = makeLegendItems(resolved);
96
41
  const fillFor = (entry, slot) => {
97
42
  if (!filled) return "none";
98
43
  if (texture && lead && entry.key === lead.key) return `url(#hatch-${reactId})`;
99
44
  return `url(#area-${reactId}-${slot})`;
100
45
  };
101
- const renderLastLabel = (color) => (props) => {
102
- if (props.index !== data.length - 1 || props.x == null || props.y == null) return null;
103
- return /* @__PURE__ */ jsx("text", {
104
- x: Number(props.x) + 6,
105
- y: Number(props.y),
106
- dy: 3,
107
- fill: color,
108
- fontFamily: theme.fontMono,
109
- fontSize: 10,
110
- textAnchor: "start",
111
- style: { fontVariantNumeric: "tabular-nums" },
112
- children: valueFormatter(Number(props.value ?? 0))
113
- });
114
- };
115
46
  const isEmpty = data.length === 0 || rendered.length === 0;
116
47
  return /* @__PURE__ */ jsxs("div", {
117
48
  "data-slot": "area-chart",
118
- className: cn("flex w-full flex-col gap-3", className),
49
+ className: cn("flex w-full flex-col gap-3", "[&_.recharts-surface]:outline-none [&_.recharts-wrapper]:outline-none", className),
119
50
  children: [/* @__PURE__ */ jsx("div", {
120
51
  className: "w-full",
121
52
  style: { height },
122
- children: loading ? /* @__PURE__ */ jsxs("div", {
123
- className: "flex h-full items-center justify-center gap-2.5 font-mono text-quaternary-foreground text-text-xs",
124
- children: [/* @__PURE__ */ jsx("span", { className: "size-4 animate-spin rounded-full border-2 border-border border-t-foreground" }), "loading…"]
125
- }) : isEmpty ? /* @__PURE__ */ jsx("div", {
53
+ children: loading ? /* @__PURE__ */ jsx(Skeleton, { className: "h-full w-full rounded-lg" }) : isEmpty ? /* @__PURE__ */ jsx("div", {
126
54
  className: "flex h-full items-center justify-center rounded-lg border border-border border-dashed font-mono text-quaternary-foreground text-text-xs",
127
55
  children: "no data in range"
128
56
  }) : /* @__PURE__ */ jsx(ResponsiveContainer, {
@@ -183,7 +111,7 @@ function AreaChart({ data, index, series, variant = "stacked", curve = "monotone
183
111
  ...axis,
184
112
  tick: makeXAxisTick(theme),
185
113
  interval: "preserveStartEnd",
186
- minTickGap: 44
114
+ minTickGap: 56
187
115
  }),
188
116
  /* @__PURE__ */ jsx(YAxis, {
189
117
  ...axis,
@@ -207,25 +135,10 @@ function AreaChart({ data, index, series, variant = "stacked", curve = "monotone
207
135
  showTotal: withTotal
208
136
  })
209
137
  }),
210
- referenceLine?.band && /* @__PURE__ */ jsx(ReferenceArea, {
211
- y1: referenceLine.y,
212
- y2: numericMax,
213
- fill: theme.warning,
214
- fillOpacity: .06,
215
- ifOverflow: "extendDomain"
216
- }),
217
- referenceLine && /* @__PURE__ */ jsx(ReferenceLine, {
218
- y: referenceLine.y,
219
- stroke: theme.warning,
220
- strokeDasharray: "4 4",
221
- strokeOpacity: .6,
222
- label: referenceLine.label ? {
223
- value: referenceLine.label,
224
- fill: theme.warning,
225
- fontSize: 9,
226
- fontFamily: theme.fontMono,
227
- position: "insideBottomRight"
228
- } : void 0
138
+ renderReferenceLine({
139
+ referenceLine,
140
+ numericMax,
141
+ theme
229
142
  }),
230
143
  rendered.map((entry, slot) => /* @__PURE__ */ jsx(Area, {
231
144
  type: curveType,
@@ -237,30 +150,24 @@ function AreaChart({ data, index, series, variant = "stacked", curve = "monotone
237
150
  strokeDasharray: entry.dashed ? "5 3" : void 0,
238
151
  fill: fillFor(entry, slot),
239
152
  dot: false,
240
- activeDot: activeDotFor(entry),
241
- isAnimationActive: animated,
153
+ activeDot: makeActiveDot(entry, {
154
+ valueFlags,
155
+ theme,
156
+ valueFormatter
157
+ }),
158
+ isAnimationActive: false,
242
159
  animationDuration: 650,
243
160
  animationEasing: "ease-out",
244
161
  children: lastValueLabel && /* @__PURE__ */ jsx(LabelList, {
245
162
  dataKey: entry.key,
246
- content: renderLastLabel(entry.color)
163
+ content: makeLastValueLabel(entry.color, {
164
+ dataLength: data.length,
165
+ theme,
166
+ valueFormatter
167
+ })
247
168
  })
248
169
  }, entry.key)),
249
- markers?.map((marker) => /* @__PURE__ */ jsx(ReferenceDot, {
250
- x: marker.x,
251
- y: marker.y,
252
- r: 3.5,
253
- fill: marker.color ?? theme.foreground,
254
- stroke: theme.card,
255
- strokeWidth: 2,
256
- label: marker.label ? {
257
- value: marker.label,
258
- fill: marker.color ?? theme.foreground,
259
- fontSize: 9,
260
- fontFamily: theme.fontMono,
261
- position: "top"
262
- } : void 0
263
- }, `${marker.x}-${marker.y}`))
170
+ renderMarkers(markers, theme)
264
171
  ]
265
172
  })
266
173
  })
@@ -1,24 +1,12 @@
1
1
  //#region src/components/attachment-tile.d.ts
2
2
  interface AttachmentTileProps {
3
- /** Source URL for the attachment thumbnail */
4
3
  src?: string;
5
- /** Whether the attachment is an image */
6
4
  isImage?: boolean;
7
- /** Accessible label describing the attachment */
8
5
  label?: string;
9
- /** Called when the remove button is clicked */
10
6
  onRemove?: () => void;
11
- /** Called when the tile is clicked (e.g. to open a preview) */
12
7
  onClick?: () => void;
13
8
  className?: string;
14
9
  }
15
- declare function AttachmentTile({
16
- src,
17
- isImage,
18
- label,
19
- onRemove,
20
- onClick,
21
- className
22
- }: AttachmentTileProps): import("react").JSX.Element;
10
+ declare function AttachmentTile({ src, isImage, label, onRemove, onClick, className }: AttachmentTileProps): import("react").JSX.Element;
23
11
  //#endregion
24
12
  export { AttachmentTile, type AttachmentTileProps };
@@ -1,31 +1,18 @@
1
1
  import { VariantProps } from "class-variance-authority";
2
2
  import * as React$1 from "react";
3
3
  import * as AvatarPrimitive from "@radix-ui/react-avatar";
4
-
5
4
  //#region src/components/avatar.d.ts
6
5
  declare const avatarVariants: (props?: ({
7
- size?: "xs" | "sm" | "md" | "lg" | "xl" | null | undefined;
6
+ size?: "sm" | "lg" | "md" | "xl" | "xs" | null | undefined;
8
7
  } & import("class-variance-authority/types").ClassProp) | undefined) => string;
9
8
  type AvatarSize = NonNullable<VariantProps<typeof avatarVariants>["size"]>;
10
9
  type AvatarStatus = "online";
11
10
  interface AvatarProps extends React$1.ComponentProps<typeof AvatarPrimitive.Root>, VariantProps<typeof avatarVariants> {
12
11
  status?: AvatarStatus;
13
12
  }
14
- declare function Avatar({
15
- size,
16
- status,
17
- className,
18
- children,
19
- ...props
20
- }: AvatarProps): React$1.JSX.Element;
21
- declare function AvatarImage({
22
- className,
23
- ...props
24
- }: React$1.ComponentProps<typeof AvatarPrimitive.Image>): React$1.JSX.Element;
25
- declare function AvatarFallback({
26
- className,
27
- ...props
28
- }: React$1.ComponentProps<typeof AvatarPrimitive.Fallback>): React$1.JSX.Element;
13
+ declare function Avatar({ size, status, className, children, ...props }: AvatarProps): React$1.JSX.Element;
14
+ declare function AvatarImage({ className, ...props }: React$1.ComponentProps<typeof AvatarPrimitive.Image>): React$1.JSX.Element;
15
+ declare function AvatarFallback({ className, ...props }: React$1.ComponentProps<typeof AvatarPrimitive.Fallback>): React$1.JSX.Element;
29
16
  interface AvatarLabelGroupProps extends React$1.ComponentProps<"div"> {
30
17
  size?: "sm" | "md";
31
18
  src?: string;
@@ -35,16 +22,6 @@ interface AvatarLabelGroupProps extends React$1.ComponentProps<"div"> {
35
22
  label?: string;
36
23
  status?: AvatarStatus;
37
24
  }
38
- declare function AvatarLabelGroup({
39
- size,
40
- src,
41
- alt,
42
- fallback,
43
- name,
44
- label,
45
- status,
46
- className,
47
- ...props
48
- }: AvatarLabelGroupProps): React$1.JSX.Element;
25
+ declare function AvatarLabelGroup({ size, src, alt, fallback, name, label, status, className, ...props }: AvatarLabelGroupProps): React$1.JSX.Element;
49
26
  //#endregion
50
27
  export { Avatar, AvatarFallback, AvatarImage, AvatarLabelGroup, type AvatarSize, type AvatarStatus };
@@ -1,18 +1,11 @@
1
1
  import { VariantProps } from "class-variance-authority";
2
-
3
2
  //#region src/components/badge.d.ts
4
3
  declare const badgeVariants: (props?: ({
5
- variant?: "warning" | "success" | "secondary" | "primary" | "error" | null | undefined;
4
+ variant?: "primary" | "secondary" | "success" | "warning" | "error" | null | undefined;
6
5
  size?: "sm" | "md" | null | undefined;
7
6
  } & import("class-variance-authority/types").ClassProp) | undefined) => string;
8
7
  interface BadgeProps extends React.ComponentProps<"span">, VariantProps<typeof badgeVariants> {}
9
- declare function Badge({
10
- className,
11
- variant,
12
- size,
13
- children,
14
- ...props
15
- }: BadgeProps): import("react").JSX.Element;
8
+ declare function Badge({ className, variant, size, children, ...props }: BadgeProps): import("react").JSX.Element;
16
9
  type BadgeVariant = NonNullable<VariantProps<typeof badgeVariants>["variant"]>;
17
10
  //#endregion
18
11
  export { Badge, type BadgeVariant, badgeVariants };
@@ -2,9 +2,8 @@ import { ChartSeries } from "../lib/chart.mjs";
2
2
  import { ChartPaletteName } from "../lib/chart-palette.mjs";
3
3
  import { ChartMarker } from "./area-chart.mjs";
4
4
  import * as React$1 from "react";
5
-
6
5
  //#region src/components/bar-chart.d.ts
7
- interface BarChartProps {
6
+ export interface BarChartProps {
8
7
  data: ReadonlyArray<Record<string, string | number | null | undefined>>;
9
8
  index: string;
10
9
  series: ChartSeries[];
@@ -14,6 +13,8 @@ interface BarChartProps {
14
13
  valueLabels?: boolean;
15
14
  height?: number;
16
15
  yAxisWidth?: number;
16
+ bare?: boolean;
17
+ barCategoryGap?: number | string;
17
18
  palette?: ChartPaletteName;
18
19
  referenceLine?: {
19
20
  y: number;
@@ -22,29 +23,12 @@ interface BarChartProps {
22
23
  };
23
24
  markers?: ChartMarker[];
24
25
  texture?: boolean;
26
+ partialLastBar?: boolean;
25
27
  loading?: boolean;
26
28
  valueFormatter?: (value: number) => string;
27
29
  labelFormatter?: (label: string | number) => string;
28
30
  className?: string;
29
31
  }
30
- declare function BarChart({
31
- data,
32
- index,
33
- series,
34
- variant,
35
- legend,
36
- legendAlign,
37
- valueLabels,
38
- height,
39
- yAxisWidth,
40
- palette,
41
- referenceLine,
42
- markers,
43
- texture,
44
- loading,
45
- valueFormatter,
46
- labelFormatter,
47
- className
48
- }: BarChartProps): React$1.JSX.Element;
32
+ declare function BarChart({ data, index, series, variant, legend, legendAlign, valueLabels, height, yAxisWidth, bare, barCategoryGap, palette, referenceLine, markers, texture, partialLastBar, loading, valueFormatter, labelFormatter, className }: BarChartProps): React$1.JSX.Element;
49
33
  //#endregion
50
- export { BarChart, BarChartProps };
34
+ export { BarChart };