karsten-design-system 1.2.0 → 1.2.1

package/dist/index.d.ts

@@ -9,6 +9,7 @@ export * from './stories/components/card';
 export * from './stories/components/cardButton';
 export * from './stories/components/cardIconsButton';
 export * from './stories/components/chart';
+export * from './stories/components/charts';
 export * from './stories/components/dialog';
 export * from './stories/components/divider';
 export * from './stories/components/emptyContent';

package/dist/index.js

@@ -377,6 +377,55 @@ function Chart(props) {
     return jsx(Chart$1, { ...props });
 }
 
+function Charts({ type, labels, datasets, title, stacked = false, horizontal = false, legendaLateral = false, className, }) {
+    const chartData = {
+        labels,
+        datasets: datasets.map((ds) => ({
+            ...ds,
+            backgroundColor: ds.backgroundColor || '#13294B',
+            borderColor: type === 'pie' || type === 'doughnut'
+                ? '#fff'
+                : ds.borderColor || '#13294B',
+            tension: type === 'filledLine' || type === 'line' ? 0.4 : 0,
+            fill: type === 'filledLine' ? true : false,
+            borderRadius: 4,
+        })),
+    };
+    const chartType = type === 'filledLine' ? 'line' : type;
+    const chartOptions = {
+        indexAxis: horizontal ? 'y' : 'x',
+        plugins: {
+            legend: {
+                position: legendaLateral ? 'right' : 'top',
+                labels: {
+                    color: '#495057',
+                    usePointStyle: true,
+                    pointStyle: 'circle',
+                },
+            },
+            title: title
+                ? {
+                    display: true,
+                    text: title,
+                }
+                : undefined,
+        },
+        scales: {
+            x: {
+                stacked: stacked,
+                ticks: { color: '#495057' },
+                grid: { color: '#ebedef' },
+            },
+            y: {
+                stacked: stacked,
+                ticks: { color: '#495057' },
+                grid: { color: '#ebedef' },
+            },
+        },
+    };
+    return (jsx(Chart$1, { type: chartType, data: chartData, options: chartOptions, className: className, "aria-label": "chart" }));
+}
+
 function Dialog({ title, description, labelConfirmButton, onClose, onClick, }) {
     return (jsx("div", { className: "fixed inset-0 bg-black bg-opacity-50 z-20 flex justify-center items-center", children: jsxs(Card, { className: "flex flex-col", children: [jsxs("div", { className: "flex flex-row items-center justify-between px-4 pt-4 pb-6 border-b border-b-stone", children: [jsx("h2", { className: "text-primary font-semibold", children: title }), jsx("i", { className: "pi pi-times", style: { color: '#606060', cursor: 'pointer' }, onClick: onClose })] }), jsxs("div", { className: "flex flex-col items-center p-6", children: [jsx("span", { className: "text-primary", children: description }), jsxs("div", { className: "w-100 flex flex-row justify-end pt-10 gap-4", children: [jsx("div", { className: "w-1/3", children: jsx(Button, { label: "Cancelar", variant: "outline", onClick: onClose }) }), jsx("div", { className: "w-1/3", children: jsx(Button, { label: labelConfirmButton, variant: "primary", onClick: onClick }) })] })] })] }) }));
 }
@@ -4605,5 +4654,5 @@ function Toast({ messages }) {
                 : ''), "aria-label": "toast", children: [severity === 'success' && jsx(SuccessIcon, {}), severity === 'info' && jsx(InfoIcon, {}), severity === 'error' && jsx(ErrorIcon, {}), jsxs("div", { children: [jsx("strong", { children: summary }), jsx("p", { children: detail })] })] }, id))) }));
 }
 
-export { Accordion, AutoComplete, BasicHeader, Breadcrumb, Button, CalendarInput, Card, CardButton, CardIconsButton, Chart, Dialog, Divider, EmptyContent, ExpandablePanel, FileUpload, FilterButton, Header, IconButton, InfoCard, Input, InputSwitch, InputTextArea, InternalMenu, Link, MegaMenu, Modal, MultiSelect, Notification, Paginator, RadioButton, Select, Sidebar, Skeleton, Spinner, Table, Tabs, TagStatus, Toast, Tooltip };
+export { Accordion, AutoComplete, BasicHeader, Breadcrumb, Button, CalendarInput, Card, CardButton, CardIconsButton, Chart, Charts, Dialog, Divider, EmptyContent, ExpandablePanel, FileUpload, FilterButton, Header, IconButton, InfoCard, Input, InputSwitch, InputTextArea, InternalMenu, Link, MegaMenu, Modal, MultiSelect, Notification, Paginator, RadioButton, Select, Sidebar, Skeleton, Spinner, Table, Tabs, TagStatus, Toast, Tooltip };
 //# sourceMappingURL=index.js.map