@litelens/design-system 1.7.6 → 1.7.11

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.
@@ -79,20 +79,15 @@ var DonutChart = ({
79
79
  pending = 0,
80
80
  failed = 0,
81
81
  items,
82
- onNavigate
82
+ onNavigate,
83
+ isLoading = false
83
84
  }) => {
84
85
  const runRatio = total === 0 ? 0 : running / total;
85
86
  const pendingRatio = total === 0 ? 0 : pending / total;
86
87
  const failRatio = total === 0 ? 0 : failed / total;
87
88
  return /* @__PURE__ */ jsxs("div", { className: "flex flex-col items-center gap-1", children: [
88
- /* @__PURE__ */ jsx("span", { className: "text-xs", children: /* @__PURE__ */ jsxs(ResourceLink, { onClick: onNavigate, children: [
89
- label,
90
- " (",
91
- total,
92
- ")"
93
- ] }) }),
89
+ /* @__PURE__ */ jsx("span", { className: "text-xs", children: /* @__PURE__ */ jsx(ResourceLink, { onClick: onNavigate, children: isLoading ? label : `${label} (${total})` }) }),
94
90
  /* @__PURE__ */ jsxs("svg", { width: "88", height: "88", viewBox: "0 0 88 88", children: [
95
- /* @__PURE__ */ jsx("circle", { cx: "44", cy: "44", r: RADIUS, fill: "none", strokeWidth: "8", className: "stroke-muted" }),
96
91
  /* @__PURE__ */ jsx(
97
92
  "circle",
98
93
  {
@@ -101,42 +96,55 @@ var DonutChart = ({
101
96
  r: RADIUS,
102
97
  fill: "none",
103
98
  strokeWidth: "8",
104
- strokeDasharray: `${runRatio * CIRCUMFERENCE} ${CIRCUMFERENCE}`,
105
- strokeLinecap: "round",
106
- className: "stroke-success",
107
- transform: "rotate(-90 44 44)"
99
+ className: isLoading ? "animate-pulse stroke-muted" : "stroke-muted"
108
100
  }
109
101
  ),
110
- pending > 0 && /* @__PURE__ */ jsx(
111
- "circle",
112
- {
113
- cx: "44",
114
- cy: "44",
115
- r: RADIUS,
116
- fill: "none",
117
- strokeWidth: "8",
118
- strokeDasharray: `${pendingRatio * CIRCUMFERENCE} ${CIRCUMFERENCE}`,
119
- strokeLinecap: "round",
120
- className: "stroke-warning",
121
- transform: `rotate(${ -90 + runRatio * 360} 44 44)`
122
- }
123
- ),
124
- failed > 0 && /* @__PURE__ */ jsx(
125
- "circle",
126
- {
127
- cx: "44",
128
- cy: "44",
129
- r: RADIUS,
130
- fill: "none",
131
- strokeWidth: "8",
132
- strokeDasharray: `${failRatio * CIRCUMFERENCE} ${CIRCUMFERENCE}`,
133
- strokeLinecap: "round",
134
- className: "stroke-destructive",
135
- transform: `rotate(${ -90 + (runRatio + pendingRatio) * 360} 44 44)`
136
- }
137
- )
102
+ !isLoading && /* @__PURE__ */ jsxs(Fragment, { children: [
103
+ /* @__PURE__ */ jsx(
104
+ "circle",
105
+ {
106
+ cx: "44",
107
+ cy: "44",
108
+ r: RADIUS,
109
+ fill: "none",
110
+ strokeWidth: "8",
111
+ strokeDasharray: `${runRatio * CIRCUMFERENCE} ${CIRCUMFERENCE}`,
112
+ strokeLinecap: "round",
113
+ className: "stroke-success",
114
+ transform: "rotate(-90 44 44)"
115
+ }
116
+ ),
117
+ pending > 0 && /* @__PURE__ */ jsx(
118
+ "circle",
119
+ {
120
+ cx: "44",
121
+ cy: "44",
122
+ r: RADIUS,
123
+ fill: "none",
124
+ strokeWidth: "8",
125
+ strokeDasharray: `${pendingRatio * CIRCUMFERENCE} ${CIRCUMFERENCE}`,
126
+ strokeLinecap: "round",
127
+ className: "stroke-warning",
128
+ transform: `rotate(${ -90 + runRatio * 360} 44 44)`
129
+ }
130
+ ),
131
+ failed > 0 && /* @__PURE__ */ jsx(
132
+ "circle",
133
+ {
134
+ cx: "44",
135
+ cy: "44",
136
+ r: RADIUS,
137
+ fill: "none",
138
+ strokeWidth: "8",
139
+ strokeDasharray: `${failRatio * CIRCUMFERENCE} ${CIRCUMFERENCE}`,
140
+ strokeLinecap: "round",
141
+ className: "stroke-destructive",
142
+ transform: `rotate(${ -90 + (runRatio + pendingRatio) * 360} 44 44)`
143
+ }
144
+ )
145
+ ] })
138
146
  ] }),
139
- /* @__PURE__ */ jsx("div", { className: "mt-1 flex flex-col gap-1", children: items.flatMap(
147
+ /* @__PURE__ */ jsx("div", { className: "mt-1 flex flex-col gap-1", children: isLoading ? /* @__PURE__ */ jsx("div", { className: "h-3 w-16 animate-pulse rounded-sm bg-muted" }) : items.flatMap(
140
148
  (i) => i.count > 0 ? [
141
149
  /* @__PURE__ */ jsxs("div", { className: "flex items-center gap-1.5 text-xs", children: [
142
150
  /* @__PURE__ */ jsx("span", { className: `h-2 w-2 shrink-0 rounded-sm ${colorClass[i.color]}` }),
@@ -24,6 +24,7 @@ interface DonutChartProps {
24
24
  failed?: number;
25
25
  items: LegendItem[];
26
26
  onNavigate?: () => void;
27
+ isLoading?: boolean;
27
28
  }
28
29
  declare const DonutChart: FC<DonutChartProps>;
29
30
 
@@ -1,4 +1,4 @@
1
- export { AnnotationBadge, ButtonGroup, ConfirmationModal, Divider, DonutChart, EmptyState, ErrorBoundary, ErrorToast, FormModal, LineIcon, LoadingSpinner, Markdown, ResourceBulkDeletionButton, ResourceCell, ResourceCreationButton, ResourceDeletionButton, ResourceDetailDrawer, ResourceDetailDrawerBody, ResourceDetailDrawerHeader, ResourceDetailEmptyBody, ResourceLink, ResourceModificationButton, ResourceRestartButton, ResourceScaleButton, SearchInput, SuccessToast, TOAST_STYLE, TableSkeletonLoader, TableSkeletonRow, TimezoneSelect, TruncatedText, renderErrorToast, renderSuccessToast } from '../chunk-5BURJRJL.js';
1
+ export { AnnotationBadge, ButtonGroup, ConfirmationModal, Divider, DonutChart, EmptyState, ErrorBoundary, ErrorToast, FormModal, LineIcon, LoadingSpinner, Markdown, ResourceBulkDeletionButton, ResourceCell, ResourceCreationButton, ResourceDeletionButton, ResourceDetailDrawer, ResourceDetailDrawerBody, ResourceDetailDrawerHeader, ResourceDetailEmptyBody, ResourceLink, ResourceModificationButton, ResourceRestartButton, ResourceScaleButton, SearchInput, SuccessToast, TOAST_STYLE, TableSkeletonLoader, TableSkeletonRow, TimezoneSelect, TruncatedText, renderErrorToast, renderSuccessToast } from '../chunk-4PJ44ICV.js';
2
2
  import '../chunk-P3JHHECV.js';
3
3
  import '../chunk-H5LPB7HL.js';
4
4
  import '../chunk-QUNCRUSO.js';
package/dist/index.js CHANGED
@@ -1,5 +1,5 @@
1
1
  export { Checkbox, Collapsible, CollapsiblePanel, CollapsibleTrigger, ContextMenu, ContextMenuContent, ContextMenuItem, ContextMenuPortal, ContextMenuSeparator, ContextMenuTrigger, Drawer, DrawerContent, DrawerPopup, DrawerPortal, DrawerViewport, Select, SelectContent, SelectGroup, SelectItem, SelectLabel, SelectScrollDownButton, SelectScrollUpButton, SelectSeparator, SelectTrigger, SelectValue, Separator, Slider, Switch, Tabs, TabsContent, TabsIndicator, TabsList, TabsTrigger, Textarea, Toaster, textareaVariants } from './chunk-ENO55SX2.js';
2
- export { AnnotationBadge, ButtonGroup, ConfirmationModal, Divider, DonutChart, EmptyState, ErrorBoundary, ErrorToast, FormModal, LineIcon, LoadingSpinner, Markdown, ResourceBulkDeletionButton, ResourceCell, ResourceCreationButton, ResourceDeletionButton, ResourceDetailDrawer, ResourceDetailDrawerBody, ResourceDetailDrawerHeader, ResourceDetailEmptyBody, ResourceLink, ResourceModificationButton, ResourceRestartButton, ResourceScaleButton, SearchInput, SuccessToast, TOAST_STYLE, TableSkeletonLoader, TableSkeletonRow, TimezoneSelect, TruncatedText, renderErrorToast, renderSuccessToast } from './chunk-5BURJRJL.js';
2
+ export { AnnotationBadge, ButtonGroup, ConfirmationModal, Divider, DonutChart, EmptyState, ErrorBoundary, ErrorToast, FormModal, LineIcon, LoadingSpinner, Markdown, ResourceBulkDeletionButton, ResourceCell, ResourceCreationButton, ResourceDeletionButton, ResourceDetailDrawer, ResourceDetailDrawerBody, ResourceDetailDrawerHeader, ResourceDetailEmptyBody, ResourceLink, ResourceModificationButton, ResourceRestartButton, ResourceScaleButton, SearchInput, SuccessToast, TOAST_STYLE, TableSkeletonLoader, TableSkeletonRow, TimezoneSelect, TruncatedText, renderErrorToast, renderSuccessToast } from './chunk-4PJ44ICV.js';
3
3
  export { Badge, Button, Dialog, DialogClose, DialogContent, DialogDescription, DialogFooter, DialogHeader, DialogOverlay, DialogPortal, DialogTitle, DialogTrigger, DropdownMenu, DropdownMenuCheckboxItem, DropdownMenuContent, DropdownMenuGroup, DropdownMenuItem, DropdownMenuLabel, DropdownMenuPortal, DropdownMenuRadioGroup, DropdownMenuRadioItem, DropdownMenuSeparator, DropdownMenuShortcut, DropdownMenuSub, DropdownMenuSubContent, DropdownMenuSubTrigger, DropdownMenuTrigger, ScrollArea, ScrollBar, Sheet, SheetClose, SheetContent, SheetDescription, SheetFooter, SheetHeader, SheetTitle, SheetTrigger, Table, TableBody, TableCaption, TableCell, TableFooter, TableHead, TableHeader, TableRow, Tooltip, TooltipContent, TooltipProvider, TooltipTrigger, buttonVariants, toast } from './chunk-P3JHHECV.js';
4
4
  export { BREAKPOINTS, useBreakpoint, useMediaQuery } from './chunk-XLB44BWQ.js';
5
5
  export { useCopyToClipboard } from './chunk-3ZL7QROP.js';
package/package.json CHANGED
@@ -1,6 +1,6 @@
1
1
  {
2
2
  "name": "@litelens/design-system",
3
- "version": "1.7.6",
3
+ "version": "1.7.11",
4
4
  "description": "Design system components, utilities, and hooks for litelens",
5
5
  "private": false,
6
6
  "repository": {