@entropix/data 0.0.0 → 1.0.1

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 (50) hide show
  1. package/dist/area-chart.cjs +14 -0
  2. package/dist/area-chart.css +144 -0
  3. package/dist/area-chart.d.cts +19 -0
  4. package/dist/area-chart.d.ts +19 -0
  5. package/dist/area-chart.js +5 -0
  6. package/dist/bar-chart.cjs +14 -0
  7. package/dist/bar-chart.css +144 -0
  8. package/dist/bar-chart.d.cts +18 -0
  9. package/dist/bar-chart.d.ts +18 -0
  10. package/dist/bar-chart.js +5 -0
  11. package/dist/chunk-42HKJHUY.js +96 -0
  12. package/dist/chunk-4WXLJDQU.js +74 -0
  13. package/dist/chunk-6YAOO76S.cjs +142 -0
  14. package/dist/chunk-CMAQ7DZD.js +135 -0
  15. package/dist/chunk-FQACLZYR.js +137 -0
  16. package/dist/chunk-GCZSXJAA.cjs +77 -0
  17. package/dist/chunk-K6ZRQYSZ.cjs +131 -0
  18. package/dist/chunk-QBI5NOHT.cjs +126 -0
  19. package/dist/chunk-SDCNTA7E.cjs +275 -0
  20. package/dist/chunk-VCSKHJLZ.js +124 -0
  21. package/dist/chunk-VGT2QF7D.cjs +98 -0
  22. package/dist/chunk-WOVSQALY.cjs +137 -0
  23. package/dist/chunk-X7GZD7KZ.js +129 -0
  24. package/dist/chunk-YINCJQN6.js +271 -0
  25. package/dist/data-table.cjs +20 -0
  26. package/dist/data-table.css +227 -0
  27. package/dist/data-table.d.cts +20 -0
  28. package/dist/data-table.d.ts +20 -0
  29. package/dist/data-table.js +3 -0
  30. package/dist/index.cjs +36 -269
  31. package/dist/index.css +144 -0
  32. package/dist/index.d.cts +8 -21
  33. package/dist/index.d.ts +8 -21
  34. package/dist/index.js +7 -269
  35. package/dist/line-chart.cjs +14 -0
  36. package/dist/line-chart.css +144 -0
  37. package/dist/line-chart.d.cts +19 -0
  38. package/dist/line-chart.d.ts +19 -0
  39. package/dist/line-chart.js +5 -0
  40. package/dist/pie-chart.cjs +13 -0
  41. package/dist/pie-chart.css +144 -0
  42. package/dist/pie-chart.d.cts +15 -0
  43. package/dist/pie-chart.d.ts +15 -0
  44. package/dist/pie-chart.js +4 -0
  45. package/dist/styles/chart.css +1 -0
  46. package/dist/styles/data-table.css +1 -304
  47. package/package.json +54 -3
  48. package/dist/index.cjs.map +0 -1
  49. package/dist/index.css.map +0 -1
  50. package/dist/index.js.map +0 -1
package/dist/index.css CHANGED
@@ -224,4 +224,148 @@
224
224
  font-size: 16px;
225
225
  }
226
226
  }
227
+
228
+ /* src/styles/chart.css */
229
+ :root {
230
+ --chart-bg: var(--entropix-color-bg-primary, #ffffff);
231
+ --chart-border-color: var(--entropix-color-border-default, #e5e7eb);
232
+ --chart-grid-color: var(--entropix-color-border-subtle, #f3f4f6);
233
+ --chart-text-color: var(--entropix-color-text-secondary, #6b7280);
234
+ --chart-tooltip-bg: var(--entropix-color-bg-inverse, #1f2937);
235
+ --chart-tooltip-text: var(--entropix-color-text-inverse, #ffffff);
236
+ --chart-font-size: var(--entropix-font-size-xs, 0.75rem);
237
+ --chart-series-1: var(--entropix-color-action-primary-default, #3b82f6);
238
+ --chart-series-2: var(--entropix-color-chart-2, #ef4444);
239
+ --chart-series-3: var(--entropix-color-chart-3, #22c55e);
240
+ --chart-series-4: var(--entropix-color-chart-4, #f59e0b);
241
+ --chart-series-5: var(--entropix-color-chart-5, #a855f7);
242
+ --chart-series-6: var(--entropix-color-chart-6, #06b6d4);
243
+ --chart-series-7: var(--entropix-color-chart-7, #f97316);
244
+ --chart-series-8: var(--entropix-color-chart-8, #ec4899);
245
+ }
246
+ .entropix-chart {
247
+ position: relative;
248
+ width: 100%;
249
+ background: var(--chart-bg);
250
+ font-family: var(--entropix-font-family-sans, system-ui, sans-serif);
251
+ font-size: var(--chart-font-size);
252
+ color: var(--chart-text-color);
253
+ }
254
+ .entropix-chart__svg {
255
+ display: block;
256
+ overflow: visible;
257
+ }
258
+ .entropix-chart__axis-text {
259
+ fill: var(--chart-text-color);
260
+ font-size: var(--chart-font-size);
261
+ font-family: inherit;
262
+ user-select: none;
263
+ }
264
+ .entropix-chart__grid-line {
265
+ stroke: var(--chart-grid-color);
266
+ stroke-width: 1;
267
+ shape-rendering: crispEdges;
268
+ }
269
+ .entropix-chart__tooltip {
270
+ position: absolute;
271
+ background: var(--chart-tooltip-bg);
272
+ color: var(--chart-tooltip-text);
273
+ padding: 6px 10px;
274
+ border-radius: 6px;
275
+ font-size: var(--chart-font-size);
276
+ line-height: 1.4;
277
+ white-space: nowrap;
278
+ pointer-events: none;
279
+ z-index: 10;
280
+ box-shadow: 0 2px 8px rgba(0, 0, 0, 0.15);
281
+ opacity: 0;
282
+ transition: opacity 0.15s ease-in-out;
283
+ }
284
+ .entropix-chart__tooltip--visible {
285
+ opacity: 1;
286
+ }
287
+ .entropix-chart__tooltip-row {
288
+ display: flex;
289
+ align-items: center;
290
+ gap: 6px;
291
+ }
292
+ .entropix-chart__tooltip-swatch {
293
+ display: inline-block;
294
+ width: 8px;
295
+ height: 8px;
296
+ border-radius: 50%;
297
+ flex-shrink: 0;
298
+ }
299
+ .entropix-chart__legend {
300
+ display: flex;
301
+ flex-wrap: wrap;
302
+ gap: 12px;
303
+ padding: 8px 0 0;
304
+ justify-content: center;
305
+ }
306
+ .entropix-chart__legend-item {
307
+ display: inline-flex;
308
+ align-items: center;
309
+ gap: 6px;
310
+ cursor: pointer;
311
+ user-select: none;
312
+ font-size: var(--chart-font-size);
313
+ color: var(--chart-text-color);
314
+ transition: opacity 0.15s ease-in-out;
315
+ }
316
+ .entropix-chart__legend-item--inactive {
317
+ opacity: 0.4;
318
+ }
319
+ .entropix-chart__legend-swatch {
320
+ display: inline-block;
321
+ width: 10px;
322
+ height: 10px;
323
+ border-radius: 50%;
324
+ flex-shrink: 0;
325
+ }
326
+ .entropix-chart__bar {
327
+ transition: opacity 0.15s ease-in-out;
328
+ }
329
+ .entropix-chart__bar:hover {
330
+ opacity: 0.8;
331
+ }
332
+ .entropix-chart__line {
333
+ fill: none;
334
+ stroke-width: 2;
335
+ stroke-linejoin: round;
336
+ stroke-linecap: round;
337
+ }
338
+ .entropix-chart__area {
339
+ stroke: none;
340
+ stroke-linejoin: round;
341
+ }
342
+ .entropix-chart__point {
343
+ stroke: var(--chart-bg);
344
+ stroke-width: 2;
345
+ transition: r 0.15s ease-in-out;
346
+ }
347
+ .entropix-chart__point:hover {
348
+ r: 5;
349
+ }
350
+ .entropix-chart__arc {
351
+ transition: opacity 0.15s ease-in-out, transform 0.15s ease-in-out;
352
+ transform-origin: center;
353
+ }
354
+ .entropix-chart__arc:hover {
355
+ opacity: 0.85;
356
+ transform: scale(1.03);
357
+ }
358
+ @container (max-width: 400px) {
359
+ .entropix-chart {
360
+ font-size: 0.625rem;
361
+ }
362
+ }
363
+ @media (max-width: 480px) {
364
+ .entropix-chart {
365
+ font-size: 0.625rem;
366
+ }
367
+ .entropix-chart__legend {
368
+ gap: 8px;
369
+ }
370
+ }
227
371
  /*# sourceMappingURL=index.css.map */
package/dist/index.d.cts CHANGED
@@ -1,21 +1,8 @@
1
- import * as react_jsx_runtime from 'react/jsx-runtime';
2
- import * as React from 'react';
3
- import React__default from 'react';
4
- import { UseTableOptions, ColumnDef, UseTableReturn } from '@entropix/core';
5
- export { ColumnDef, SortDirection, SortState, UseTableOptions, UseTableReturn } from '@entropix/core';
6
-
7
- interface DataTableProps<TData = unknown> extends UseTableOptions<TData> {
8
- className?: string;
9
- emptyMessage?: string;
10
- renderCell?: (value: unknown, row: TData, column: ColumnDef<TData>) => React__default.ReactNode;
11
- }
12
- declare function DataTable<TData = unknown>(props: DataTableProps<TData>): react_jsx_runtime.JSX.Element;
13
-
14
- interface DataTableContextValue<TData = unknown> extends UseTableReturn<TData> {
15
- columns: ColumnDef<TData>[];
16
- getRowKey: (row: TData, index: number) => string;
17
- }
18
- declare const DataTableContext: React.Context<DataTableContextValue<unknown> | null>;
19
- declare function useDataTableContext<TData = unknown>(): DataTableContextValue<TData>;
20
-
21
- export { DataTable, DataTableContext, type DataTableContextValue, type DataTableProps, useDataTableContext };
1
+ export { DataTable, DataTableContext, DataTableContextValue, DataTableProps, useDataTableContext } from './data-table.cjs';
2
+ export { BarChart, BarChartProps } from './bar-chart.cjs';
3
+ export { LineChart, LineChartProps } from './line-chart.cjs';
4
+ export { AreaChart, AreaChartProps } from './area-chart.cjs';
5
+ export { PieChart, PieChartProps } from './pie-chart.cjs';
6
+ export { ArcSlice, AxisConfig, BandScale, BarRect, ChartData, ChartDataPoint, ChartMargins, ChartSeries, ColumnDef, LegendItem, LinePoint, LinearScale, NormalizedSeries, SortDirection, SortState, TooltipData, UseTableOptions, UseTableReturn } from '@entropix/core';
7
+ import 'react/jsx-runtime';
8
+ import 'react';
package/dist/index.d.ts CHANGED
@@ -1,21 +1,8 @@
1
- import * as react_jsx_runtime from 'react/jsx-runtime';
2
- import * as React from 'react';
3
- import React__default from 'react';
4
- import { UseTableOptions, ColumnDef, UseTableReturn } from '@entropix/core';
5
- export { ColumnDef, SortDirection, SortState, UseTableOptions, UseTableReturn } from '@entropix/core';
6
-
7
- interface DataTableProps<TData = unknown> extends UseTableOptions<TData> {
8
- className?: string;
9
- emptyMessage?: string;
10
- renderCell?: (value: unknown, row: TData, column: ColumnDef<TData>) => React__default.ReactNode;
11
- }
12
- declare function DataTable<TData = unknown>(props: DataTableProps<TData>): react_jsx_runtime.JSX.Element;
13
-
14
- interface DataTableContextValue<TData = unknown> extends UseTableReturn<TData> {
15
- columns: ColumnDef<TData>[];
16
- getRowKey: (row: TData, index: number) => string;
17
- }
18
- declare const DataTableContext: React.Context<DataTableContextValue<unknown> | null>;
19
- declare function useDataTableContext<TData = unknown>(): DataTableContextValue<TData>;
20
-
21
- export { DataTable, DataTableContext, type DataTableContextValue, type DataTableProps, useDataTableContext };
1
+ export { DataTable, DataTableContext, DataTableContextValue, DataTableProps, useDataTableContext } from './data-table.js';
2
+ export { BarChart, BarChartProps } from './bar-chart.js';
3
+ export { LineChart, LineChartProps } from './line-chart.js';
4
+ export { AreaChart, AreaChartProps } from './area-chart.js';
5
+ export { PieChart, PieChartProps } from './pie-chart.js';
6
+ export { ArcSlice, AxisConfig, BandScale, BarRect, ChartData, ChartDataPoint, ChartMargins, ChartSeries, ColumnDef, LegendItem, LinePoint, LinearScale, NormalizedSeries, SortDirection, SortState, TooltipData, UseTableOptions, UseTableReturn } from '@entropix/core';
7
+ import 'react/jsx-runtime';
8
+ import 'react';
package/dist/index.js CHANGED
@@ -1,271 +1,9 @@
1
- import { createContext, useContext, useMemo } from 'react';
2
- import { useTable } from '@entropix/core';
3
- import { jsx, jsxs } from 'react/jsx-runtime';
4
-
5
- // src/components/data-table/data-table.tsx
6
- var DataTableContext = createContext(
7
- null
8
- );
9
- function useDataTableContext() {
10
- const ctx = useContext(DataTableContext);
11
- if (!ctx) {
12
- throw new Error(
13
- "useDataTableContext must be used within a <DataTable /> component."
14
- );
15
- }
16
- return ctx;
17
- }
18
- function mapA11yToAria(a) {
19
- const result = {};
20
- if (a.role) result.role = a.role;
21
- if (a.label) result["aria-label"] = a.label;
22
- if (a.labelledBy) result["aria-labelledby"] = a.labelledBy;
23
- if (a.describedBy) result["aria-describedby"] = a.describedBy;
24
- if (a.disabled != null) result["aria-disabled"] = a.disabled;
25
- if (a.expanded != null) result["aria-expanded"] = a.expanded;
26
- if (a.selected != null) result["aria-selected"] = a.selected;
27
- if (a.checked != null) result["aria-checked"] = a.checked;
28
- if (a.busy != null) result["aria-busy"] = a.busy;
29
- if (a.hidden != null) result["aria-hidden"] = a.hidden;
30
- if (a.tabIndex != null) result.tabIndex = a.tabIndex;
31
- if (a.controls) result["aria-controls"] = a.controls;
32
- if (a.orientation) result["aria-orientation"] = a.orientation;
33
- if (a.required != null) result["aria-required"] = a.required;
34
- if (a.invalid != null) result["aria-invalid"] = a.invalid;
35
- return result;
36
- }
37
- function DataTable(props) {
38
- const {
39
- className,
40
- emptyMessage = "No data",
41
- renderCell,
42
- stickyHeader = false,
43
- ...tableOptions
44
- } = props;
45
- const table = useTable(tableOptions);
46
- const {
47
- columns,
48
- getRowKey = (_, i) => String(i),
49
- selectionMode = "none"
50
- } = tableOptions;
51
- const contextValue = useMemo(
52
- () => ({
53
- ...table,
54
- columns,
55
- getRowKey
56
- }),
57
- [table, columns, getRowKey]
58
- );
59
- const tableAriaProps = mapA11yToAria(table.getTableProps().accessibility);
60
- const getSortDir = (colKey) => {
61
- const s = table.sortState.find((st) => st.columnKey === colKey);
62
- return s ? s.direction : "none";
63
- };
64
- const hasFilters = columns.some((c) => c.filterable);
65
- return /* @__PURE__ */ jsx(DataTableContext.Provider, { value: contextValue, children: /* @__PURE__ */ jsxs("div", { className: `entropix-datatable ${className ?? ""}`.trim(), children: [
66
- /* @__PURE__ */ jsxs("table", { className: "entropix-datatable__table", ...tableAriaProps, children: [
67
- /* @__PURE__ */ jsxs(
68
- "thead",
69
- {
70
- className: "entropix-datatable__thead",
71
- "data-sticky": stickyHeader ? "true" : void 0,
72
- ...mapA11yToAria(table.getHeaderRowProps().accessibility),
73
- children: [
74
- hasFilters && /* @__PURE__ */ jsxs("tr", { className: "entropix-datatable__filter-row", children: [
75
- selectionMode !== "none" && /* @__PURE__ */ jsx("th", { className: "entropix-datatable__th entropix-datatable__th--checkbox" }),
76
- columns.map((col) => /* @__PURE__ */ jsx(
77
- "th",
78
- {
79
- className: "entropix-datatable__th entropix-datatable__th--filter",
80
- children: col.filterable ? /* @__PURE__ */ jsx(
81
- "input",
82
- {
83
- type: "text",
84
- className: "entropix-datatable__filter",
85
- placeholder: `Filter ${col.header}...`,
86
- value: table.columnFilters[col.key] ?? "",
87
- onChange: (e) => table.setColumnFilter(col.key, e.target.value),
88
- "aria-label": `Filter by ${col.header}`
89
- }
90
- ) : null
91
- },
92
- `filter-${col.key}`
93
- ))
94
- ] }),
95
- /* @__PURE__ */ jsxs("tr", { className: "entropix-datatable__tr entropix-datatable__tr--header", children: [
96
- selectionMode !== "none" && /* @__PURE__ */ jsx("th", { className: "entropix-datatable__th entropix-datatable__th--checkbox", children: selectionMode === "multi" && /* @__PURE__ */ jsx(
97
- "input",
98
- {
99
- type: "checkbox",
100
- className: "entropix-datatable__checkbox",
101
- checked: table.isAllSelected,
102
- ref: (el) => {
103
- if (el) el.indeterminate = table.isIndeterminate;
104
- },
105
- onChange: table.toggleAllSelection,
106
- "aria-label": "Select all rows"
107
- }
108
- ) }),
109
- columns.map((col) => {
110
- const headerProps = table.getHeaderCellProps(col.key);
111
- const ariaProps = mapA11yToAria(headerProps.accessibility);
112
- const sortDir = getSortDir(col.key);
113
- return /* @__PURE__ */ jsx(
114
- "th",
115
- {
116
- className: `entropix-datatable__th${col.sortable ? " entropix-datatable__th--sortable" : ""}`,
117
- "data-sort": col.sortable ? sortDir : void 0,
118
- onClick: headerProps.onAction,
119
- onKeyDown: col.sortable ? (e) => {
120
- if (e.key === "Enter" || e.key === " ") {
121
- e.preventDefault();
122
- headerProps.onAction?.();
123
- }
124
- } : void 0,
125
- style: col.width ? {
126
- width: typeof col.width === "number" ? `${col.width}px` : col.width
127
- } : void 0,
128
- ...ariaProps,
129
- children: /* @__PURE__ */ jsxs("span", { className: "entropix-datatable__th-content", children: [
130
- col.header,
131
- col.sortable && sortDir !== "none" && /* @__PURE__ */ jsx(
132
- "span",
133
- {
134
- className: "entropix-datatable__sort-icon",
135
- "aria-hidden": "true",
136
- children: sortDir === "asc" ? " \u25B2" : " \u25BC"
137
- }
138
- )
139
- ] })
140
- },
141
- col.key
142
- );
143
- })
144
- ] })
145
- ]
146
- }
147
- ),
148
- /* @__PURE__ */ jsx(
149
- "tbody",
150
- {
151
- className: "entropix-datatable__tbody",
152
- ...mapA11yToAria(table.getBodyProps().accessibility),
153
- children: table.isLoading ? /* @__PURE__ */ jsx("tr", { className: "entropix-datatable__tr entropix-datatable__tr--loading", children: /* @__PURE__ */ jsx(
154
- "td",
155
- {
156
- className: "entropix-datatable__td entropix-datatable__td--loading",
157
- colSpan: columns.length + (selectionMode !== "none" ? 1 : 0),
158
- children: /* @__PURE__ */ jsx("div", { className: "entropix-datatable__loading", children: "Loading..." })
159
- }
160
- ) }) : table.rows.length === 0 ? /* @__PURE__ */ jsx("tr", { className: "entropix-datatable__tr entropix-datatable__tr--empty", children: /* @__PURE__ */ jsx(
161
- "td",
162
- {
163
- className: "entropix-datatable__td entropix-datatable__td--empty",
164
- colSpan: columns.length + (selectionMode !== "none" ? 1 : 0),
165
- children: /* @__PURE__ */ jsx("div", { className: "entropix-datatable__empty", children: emptyMessage })
166
- }
167
- ) }) : table.rows.map((row, i) => {
168
- const globalIndex = table.page * table.pageSize + i;
169
- const rowKey = getRowKey(row, globalIndex);
170
- const rowProps = table.getRowProps(rowKey, i);
171
- const isSelected = table.selectedKeys.has(rowKey);
172
- return /* @__PURE__ */ jsxs(
173
- "tr",
174
- {
175
- className: "entropix-datatable__tr",
176
- "data-selected": isSelected ? "true" : void 0,
177
- ...mapA11yToAria(rowProps.accessibility),
178
- children: [
179
- selectionMode !== "none" && /* @__PURE__ */ jsx("td", { className: "entropix-datatable__td entropix-datatable__td--checkbox", children: /* @__PURE__ */ jsx(
180
- "input",
181
- {
182
- type: "checkbox",
183
- className: "entropix-datatable__checkbox",
184
- checked: isSelected,
185
- onChange: () => table.toggleRowSelection(rowKey),
186
- "aria-label": `Select row ${rowKey}`
187
- }
188
- ) }),
189
- columns.map((col) => {
190
- const cellValue = col.accessor ? col.accessor(row) : row[col.key];
191
- return /* @__PURE__ */ jsx(
192
- "td",
193
- {
194
- className: "entropix-datatable__td",
195
- ...mapA11yToAria(
196
- table.getCellProps(col.key, rowKey).accessibility
197
- ),
198
- children: renderCell ? renderCell(cellValue, row, col) : String(cellValue ?? "")
199
- },
200
- col.key
201
- );
202
- })
203
- ]
204
- },
205
- rowKey
206
- );
207
- })
208
- }
209
- )
210
- ] }),
211
- table.pageCount > 1 && /* @__PURE__ */ jsxs(
212
- "nav",
213
- {
214
- className: "entropix-datatable__pagination",
215
- "aria-label": "Table pagination",
216
- children: [
217
- /* @__PURE__ */ jsx(
218
- "button",
219
- {
220
- className: "entropix-datatable__pagination-btn",
221
- onClick: table.firstPage,
222
- disabled: !table.canPreviousPage,
223
- "aria-label": "First page",
224
- children: "\u27E8\u27E8"
225
- }
226
- ),
227
- /* @__PURE__ */ jsx(
228
- "button",
229
- {
230
- className: "entropix-datatable__pagination-btn",
231
- onClick: table.previousPage,
232
- disabled: !table.canPreviousPage,
233
- "aria-label": "Previous page",
234
- children: "\u27E8"
235
- }
236
- ),
237
- /* @__PURE__ */ jsxs("span", { className: "entropix-datatable__pagination-info", children: [
238
- "Page ",
239
- table.page + 1,
240
- " of ",
241
- table.pageCount
242
- ] }),
243
- /* @__PURE__ */ jsx(
244
- "button",
245
- {
246
- className: "entropix-datatable__pagination-btn",
247
- onClick: table.nextPage,
248
- disabled: !table.canNextPage,
249
- "aria-label": "Next page",
250
- children: "\u27E9"
251
- }
252
- ),
253
- /* @__PURE__ */ jsx(
254
- "button",
255
- {
256
- className: "entropix-datatable__pagination-btn",
257
- onClick: table.lastPage,
258
- disabled: !table.canNextPage,
259
- "aria-label": "Last page",
260
- children: "\u27E9\u27E9"
261
- }
262
- )
263
- ]
264
- }
265
- )
266
- ] }) });
267
- }
268
-
269
- export { DataTable, DataTableContext, useDataTableContext };
1
+ export { DataTable, DataTableContext, useDataTableContext } from './chunk-YINCJQN6.js';
2
+ export { BarChart } from './chunk-X7GZD7KZ.js';
3
+ export { LineChart } from './chunk-VCSKHJLZ.js';
4
+ export { AreaChart } from './chunk-CMAQ7DZD.js';
5
+ import './chunk-4WXLJDQU.js';
6
+ export { PieChart } from './chunk-42HKJHUY.js';
7
+ import './chunk-FQACLZYR.js';
270
8
  //# sourceMappingURL=index.js.map
271
9
  //# sourceMappingURL=index.js.map
@@ -0,0 +1,14 @@
1
+ 'use strict';
2
+
3
+ var chunkQBI5NOHT_cjs = require('./chunk-QBI5NOHT.cjs');
4
+ require('./chunk-GCZSXJAA.cjs');
5
+ require('./chunk-6YAOO76S.cjs');
6
+
7
+
8
+
9
+ Object.defineProperty(exports, "LineChart", {
10
+ enumerable: true,
11
+ get: function () { return chunkQBI5NOHT_cjs.LineChart; }
12
+ });
13
+ //# sourceMappingURL=line-chart.cjs.map
14
+ //# sourceMappingURL=line-chart.cjs.map
@@ -0,0 +1,144 @@
1
+ /* src/styles/chart.css */
2
+ :root {
3
+ --chart-bg: var(--entropix-color-bg-primary, #ffffff);
4
+ --chart-border-color: var(--entropix-color-border-default, #e5e7eb);
5
+ --chart-grid-color: var(--entropix-color-border-subtle, #f3f4f6);
6
+ --chart-text-color: var(--entropix-color-text-secondary, #6b7280);
7
+ --chart-tooltip-bg: var(--entropix-color-bg-inverse, #1f2937);
8
+ --chart-tooltip-text: var(--entropix-color-text-inverse, #ffffff);
9
+ --chart-font-size: var(--entropix-font-size-xs, 0.75rem);
10
+ --chart-series-1: var(--entropix-color-action-primary-default, #3b82f6);
11
+ --chart-series-2: var(--entropix-color-chart-2, #ef4444);
12
+ --chart-series-3: var(--entropix-color-chart-3, #22c55e);
13
+ --chart-series-4: var(--entropix-color-chart-4, #f59e0b);
14
+ --chart-series-5: var(--entropix-color-chart-5, #a855f7);
15
+ --chart-series-6: var(--entropix-color-chart-6, #06b6d4);
16
+ --chart-series-7: var(--entropix-color-chart-7, #f97316);
17
+ --chart-series-8: var(--entropix-color-chart-8, #ec4899);
18
+ }
19
+ .entropix-chart {
20
+ position: relative;
21
+ width: 100%;
22
+ background: var(--chart-bg);
23
+ font-family: var(--entropix-font-family-sans, system-ui, sans-serif);
24
+ font-size: var(--chart-font-size);
25
+ color: var(--chart-text-color);
26
+ }
27
+ .entropix-chart__svg {
28
+ display: block;
29
+ overflow: visible;
30
+ }
31
+ .entropix-chart__axis-text {
32
+ fill: var(--chart-text-color);
33
+ font-size: var(--chart-font-size);
34
+ font-family: inherit;
35
+ user-select: none;
36
+ }
37
+ .entropix-chart__grid-line {
38
+ stroke: var(--chart-grid-color);
39
+ stroke-width: 1;
40
+ shape-rendering: crispEdges;
41
+ }
42
+ .entropix-chart__tooltip {
43
+ position: absolute;
44
+ background: var(--chart-tooltip-bg);
45
+ color: var(--chart-tooltip-text);
46
+ padding: 6px 10px;
47
+ border-radius: 6px;
48
+ font-size: var(--chart-font-size);
49
+ line-height: 1.4;
50
+ white-space: nowrap;
51
+ pointer-events: none;
52
+ z-index: 10;
53
+ box-shadow: 0 2px 8px rgba(0, 0, 0, 0.15);
54
+ opacity: 0;
55
+ transition: opacity 0.15s ease-in-out;
56
+ }
57
+ .entropix-chart__tooltip--visible {
58
+ opacity: 1;
59
+ }
60
+ .entropix-chart__tooltip-row {
61
+ display: flex;
62
+ align-items: center;
63
+ gap: 6px;
64
+ }
65
+ .entropix-chart__tooltip-swatch {
66
+ display: inline-block;
67
+ width: 8px;
68
+ height: 8px;
69
+ border-radius: 50%;
70
+ flex-shrink: 0;
71
+ }
72
+ .entropix-chart__legend {
73
+ display: flex;
74
+ flex-wrap: wrap;
75
+ gap: 12px;
76
+ padding: 8px 0 0;
77
+ justify-content: center;
78
+ }
79
+ .entropix-chart__legend-item {
80
+ display: inline-flex;
81
+ align-items: center;
82
+ gap: 6px;
83
+ cursor: pointer;
84
+ user-select: none;
85
+ font-size: var(--chart-font-size);
86
+ color: var(--chart-text-color);
87
+ transition: opacity 0.15s ease-in-out;
88
+ }
89
+ .entropix-chart__legend-item--inactive {
90
+ opacity: 0.4;
91
+ }
92
+ .entropix-chart__legend-swatch {
93
+ display: inline-block;
94
+ width: 10px;
95
+ height: 10px;
96
+ border-radius: 50%;
97
+ flex-shrink: 0;
98
+ }
99
+ .entropix-chart__bar {
100
+ transition: opacity 0.15s ease-in-out;
101
+ }
102
+ .entropix-chart__bar:hover {
103
+ opacity: 0.8;
104
+ }
105
+ .entropix-chart__line {
106
+ fill: none;
107
+ stroke-width: 2;
108
+ stroke-linejoin: round;
109
+ stroke-linecap: round;
110
+ }
111
+ .entropix-chart__area {
112
+ stroke: none;
113
+ stroke-linejoin: round;
114
+ }
115
+ .entropix-chart__point {
116
+ stroke: var(--chart-bg);
117
+ stroke-width: 2;
118
+ transition: r 0.15s ease-in-out;
119
+ }
120
+ .entropix-chart__point:hover {
121
+ r: 5;
122
+ }
123
+ .entropix-chart__arc {
124
+ transition: opacity 0.15s ease-in-out, transform 0.15s ease-in-out;
125
+ transform-origin: center;
126
+ }
127
+ .entropix-chart__arc:hover {
128
+ opacity: 0.85;
129
+ transform: scale(1.03);
130
+ }
131
+ @container (max-width: 400px) {
132
+ .entropix-chart {
133
+ font-size: 0.625rem;
134
+ }
135
+ }
136
+ @media (max-width: 480px) {
137
+ .entropix-chart {
138
+ font-size: 0.625rem;
139
+ }
140
+ .entropix-chart__legend {
141
+ gap: 8px;
142
+ }
143
+ }
144
+ /*# sourceMappingURL=line-chart.css.map */
@@ -0,0 +1,19 @@
1
+ import * as react_jsx_runtime from 'react/jsx-runtime';
2
+ import { ChartData, AxisConfig } from '@entropix/core';
3
+
4
+ interface LineChartProps {
5
+ data: ChartData;
6
+ height?: number;
7
+ colors?: string[];
8
+ curved?: boolean;
9
+ showPoints?: boolean;
10
+ showGrid?: boolean;
11
+ showTooltip?: boolean;
12
+ showLegend?: boolean;
13
+ xAxis?: AxisConfig;
14
+ yAxis?: AxisConfig;
15
+ className?: string;
16
+ }
17
+ declare function LineChart({ data, height, colors, curved, showPoints, showGrid, showTooltip, showLegend, xAxis, yAxis, className, }: LineChartProps): react_jsx_runtime.JSX.Element;
18
+
19
+ export { LineChart, type LineChartProps };
@@ -0,0 +1,19 @@
1
+ import * as react_jsx_runtime from 'react/jsx-runtime';
2
+ import { ChartData, AxisConfig } from '@entropix/core';
3
+
4
+ interface LineChartProps {
5
+ data: ChartData;
6
+ height?: number;
7
+ colors?: string[];
8
+ curved?: boolean;
9
+ showPoints?: boolean;
10
+ showGrid?: boolean;
11
+ showTooltip?: boolean;
12
+ showLegend?: boolean;
13
+ xAxis?: AxisConfig;
14
+ yAxis?: AxisConfig;
15
+ className?: string;
16
+ }
17
+ declare function LineChart({ data, height, colors, curved, showPoints, showGrid, showTooltip, showLegend, xAxis, yAxis, className, }: LineChartProps): react_jsx_runtime.JSX.Element;
18
+
19
+ export { LineChart, type LineChartProps };