@hybridcore/ui 1.6.3 → 1.6.5

package/dist/main.d.ts

@@ -229,6 +229,7 @@ export declare type ChartNameType =
 | "XYChart"
 | "MultipleValueAxes"
 | "PieChart"
+| "DonutChart"
 | "StackedAreaRadar"
 | "StackedColumnChart"
 | "LineChart"
@@ -248,6 +249,12 @@ export declare interface ChartProps {
     initDelay?: number;
     interval?: string;
     baseInterval?: BaseInterval;
+    /**
+     * When `true`, the chart is still waiting on its async config/data. The wrapper
+     * holds back rendering (and the "missing config" validation error) until this
+     * clears, so a misconfiguration only surfaces once the data has settled.
+     */
+    loading?: boolean;
     /**
      * Color palette used for series. Defaults to the lib's built-in viridis-cool
      * palette. Pass `theme.palette.viridisCool` (or any sequential palette) from
@@ -337,13 +344,13 @@ declare interface ConditionalWrapperProps {
      */
     condition: boolean;
     /**
-     * @param children React.ReactElement
+     * @param children React.ReactNode
      */
-    wrapper(children: default_2.ReactElement): default_2.ReactElement;
+    wrapper(children: default_2.ReactNode): default_2.ReactNode;
     /**
      * Child components to wrap
      */
-    children: default_2.ReactElement;
+    children: default_2.ReactNode;
 }
 
 declare function confirm_2(title: string, description: string, options?: OptionsType): Promise<unknown>;
@@ -569,6 +576,15 @@ export declare interface DocumentViewerProps {
     sx?: SxProps<Theme>;
 }
 
+export declare const DonutChart: (inProps: DonutChartProps) => JSX_2.Element;
+
+export declare type DonutChartComponentOverride<Theme = unknown> = {
+    defaultProps?: Partial<DonutChartProps>;
+    styleOverrides?: ComponentsOverrides_2<Theme>["HCDonutChart"];
+};
+
+export declare type DonutChartProps = ChartProps;
+
 export declare const DrillDownTreemap: (inProps: DrillDownTreemapProps) => JSX_2.Element;
 
 export declare type DrillDownTreemapComponentOverride<Theme = unknown> = {
@@ -1124,6 +1140,15 @@ export declare interface MetricCardProps {
     variant?: MetricVariant;
     loading?: boolean;
 
+    // "overlay" (default) = chart bleeds behind the value; "panel" = value/badge on the
+    // left, chart inset on the right, wrapped in a nested card.
+    layout?: MetricLayout;
+
+    // Rendered verbatim around the formatted number, e.g. valuePrefix "€ " → "€ 1,577",
+    // valueSuffix " kg" → "1,577 kg". Include any spacing in the string itself.
+    valuePrefix?: string;
+    valueSuffix?: string;
+
     showChange?: boolean;
     changeType?: MetricChangeType;
 
@@ -1158,6 +1183,8 @@ export declare type MetricIconPosition =
 | "bottom-left"
 | "bottom-right";
 
+declare type MetricLayout = "overlay" | "panel";
+
 export declare type MetricTrend = "up" | "down" | "neutral";
 
 export declare type MetricVariant =
@@ -2250,6 +2277,22 @@ declare module "@mui/material/styles" {
 
 
 
+declare module "@mui/material/styles" {
+  interface ComponentNameToClassKey {
+    HCDonutChart: "root";
+  }
+
+  interface ComponentsPropsList {
+    HCDonutChart: Partial<DonutChartProps>;
+  }
+
+  interface Components<Theme = unknown> {
+    HCDonutChart?: DonutChartComponentOverride<Theme>;
+  }
+}
+
+
+
 declare module "@mui/material/styles" {
   interface ComponentNameToClassKey {
     HCDrillDownTreemap: "root";
@@ -3190,11 +3233,12 @@ declare module "@mui/material/styles" {
       | "label"
       | "value"
       | "trendContainer"
-      | "trendValue"
       | "description"
       | "icon"
       | "cornerIcon"
-      | "chart";
+      | "chart"
+      | "panel"
+      | "sideChart";
   }
 
   interface ComponentsPropsList {

package/dist/main.js

@@ -6,173 +6,175 @@ import { Card as n } from "./components/card/index.js";
 import { CardAlternate as s } from "./components/card-alternate/index.js";
 import { ChartWrapper as C } from "./components/charts/chart-wrapper/index.js";
 import { CandlestickChart as T } from "./components/charts/candlestick/index.js";
-import { ColumnLineMix as L } from "./components/charts/column-line-mix/index.js";
-import { DrillDownTreemap as u } from "./components/charts/drill-down-treemap/index.js";
-import { DrillDownVoronoiTreemap as I } from "./components/charts/drill-down-voronoi-treemap/index.js";
-import { Heatmap as y } from "./components/charts/heatmap/index.js";
-import { HighlightLineChart as F } from "./components/charts/highlighting-line-data/index.js";
-import { LineChart as k } from "./components/charts/line/index.js";
-import { LogaritmicScale as R } from "./components/charts/logaritmic-scale/index.js";
-import { MultipleValueAxes as v } from "./components/charts/multiple-value-axes/index.js";
-import { NestedPie as E } from "./components/charts/nested-pie/index.js";
-import { PackedCircles as H } from "./components/charts/packed-circles/index.js";
-import { PieChart as W } from "./components/charts/pie-chart/index.js";
-import { StackedAreaRadar as O } from "./components/charts/stacked-area-radar/index.js";
-import { StackedColumnChart as N } from "./components/charts/stacked-column-chart/index.js";
-import { XYChart as z } from "./components/charts/xy-chart/index.js";
-import { DEFAULT_VIRIDIS_COOL as Y } from "./components/charts/_common/utils.js";
-import { Button as J } from "./components/button/index.js";
-import { ColorPicker as Q } from "./components/color-picker/index.js";
-import { CollapsibleCard as $ } from "./components/collapsible-card/index.js";
-import { ConditionalWrapper as or } from "./components/conditional-wrapper/index.js";
-import { alert as tr, confirm as pr } from "./components/confirm/index.js";
-import { HCNotificationProvider as ar } from "./components/notification/index.js";
-import { Container as fr } from "./components/container/index.js";
-import { ContextMenu as lr } from "./components/context-menu/index.js";
-import { DataGrid as cr } from "./components/data-grid/index.js";
-import { DataMap as dr } from "./components/data-map/index.js";
-import { DisseminationList as Pr } from "./components/data-security-selectors/dissemination-list/index.js";
-import { SecurityLevel as Dr } from "./components/data-security-selectors/security-level/index.js";
-import { A as hr, D as ur } from "./index-e9xTIYWt.js";
-import { DEFAULT_RELATIVE_PRESET_LABELS as Ir } from "./components/date-picker-with-custom-range/logic.js";
-import { DateTimePicker as yr } from "./components/date-time-picker/index.js";
-import { Divider as Fr } from "./components/divider/index.js";
-import { DateRangePicker as kr } from "./components/date-range-picker/index.js";
-import { DocumentViewer as Rr } from "./components/document-viewer/index.js";
-import { DurationSelect as vr } from "./components/duration-select/index.js";
-import { EditableText as Er } from "./components/editable-text/index.js";
-import { GeometryPicker as Hr } from "./components/geometry-picker/index.js";
-import { Geometry as Wr } from "./components/geometry-picker/geometry/index.js";
-import { Parser as Or } from "./components/geometry-picker/parser/index.js";
-import { HeatMap as Nr } from "./components/heat-map/index.js";
-import { IconButton as zr } from "./components/icon-button/index.js";
-import { InstanceForm as Yr } from "./components/instance-form/index.js";
-import { InstanceHierarchyTable as Jr } from "./components/instance-hierarchy-table/index.js";
-import { InstanceTable as Qr } from "./components/instance-table/index.js";
-import { InstanceVariableList as $r } from "./components/instance-variable-list/index.js";
-import { LinearIndicator as oo } from "./components/linear-indicator/index.js";
-import { Loading as to } from "./components/loading/index.js";
-import { Map as mo } from "./components/map/index.js";
-import { MetricCard as xo } from "./components/metric-card/index.js";
-import { ObjectProfileCard as io } from "./components/object-profile-card/index.js";
-import { PaginatedList as no } from "./components/paginated-list/index.js";
-import { PhoneInput as so } from "./components/phone-input/index.js";
-import { Placeholder as Po } from "./components/placeholder/index.js";
-import { PositionalTooltip as Do } from "./components/positional-tooltip/index.js";
-import { PrrMap as ho } from "./components/prr-map/index.js";
-import { RangeSelector as So } from "./components/range-selector/index.js";
-import { RasterGridMap as go } from "./components/raster-grid-map/index.js";
-import { SearchInput as Ao } from "./components/search-input/index.js";
-import { ScrollDrag as bo } from "./components/scroll-drag/index.js";
-import { SimplePivotTable as Mo } from "./components/simple-pivot-table/index.js";
-import { SortableList as Vo } from "./components/sortable-list/index.js";
-import { StatsBox as wo } from "./components/stats-box/index.js";
-import { StaticText as Go } from "./components/static-text/index.js";
-import { Tabs as Bo } from "./components/tabs/index.js";
-import { TextOverflow as _o } from "./components/text-overflow/index.js";
-import { TemplateFilters as Uo } from "./components/template-filters/index.js";
-import { TemplateForm as jo } from "./components/template-form/index.js";
-import { TemplatePropertyFilters as Xo } from "./components/template-property-filters/index.js";
-import { Property as qo } from "./components/template-property-filters/property.js";
-import { TimelineWidget as Ko } from "./components/timeline/index.js";
-import { ToggleViewButton as Zo } from "./components/toggle-view-button/index.js";
-import { TreeSelect as re } from "./components/tree-select/index.js";
-import { TreeViewFilter as ee } from "./components/treeview-filter/index.js";
-import { Uploader as pe } from "./components/uploader/index.js";
-import { VisuallyHiddenInput as ae } from "./components/visually-hidden-input/styled.js";
-import { Widget as fe } from "./components/widget/styled.js";
-import { FlexCol as le } from "./components/flex-col/index.js";
-import { FlexRow as ce } from "./components/flex-row/index.js";
-import { notify as de, removeNotification as Ce } from "./components/notification/store.js";
+import { ColumnLineMix as h } from "./components/charts/column-line-mix/index.js";
+import { DonutChart as L } from "./components/charts/donut-chart/index.js";
+import { DrillDownTreemap as I } from "./components/charts/drill-down-treemap/index.js";
+import { DrillDownVoronoiTreemap as y } from "./components/charts/drill-down-voronoi-treemap/index.js";
+import { Heatmap as F } from "./components/charts/heatmap/index.js";
+import { HighlightLineChart as k } from "./components/charts/highlighting-line-data/index.js";
+import { LineChart as R } from "./components/charts/line/index.js";
+import { LogaritmicScale as v } from "./components/charts/logaritmic-scale/index.js";
+import { MultipleValueAxes as E } from "./components/charts/multiple-value-axes/index.js";
+import { NestedPie as H } from "./components/charts/nested-pie/index.js";
+import { PackedCircles as W } from "./components/charts/packed-circles/index.js";
+import { PieChart as O } from "./components/charts/pie-chart/index.js";
+import { StackedAreaRadar as N } from "./components/charts/stacked-area-radar/index.js";
+import { StackedColumnChart as z } from "./components/charts/stacked-column-chart/index.js";
+import { XYChart as Y } from "./components/charts/xy-chart/index.js";
+import { DEFAULT_VIRIDIS_COOL as J } from "./components/charts/_common/utils.js";
+import { Button as Q } from "./components/button/index.js";
+import { ColorPicker as $ } from "./components/color-picker/index.js";
+import { CollapsibleCard as or } from "./components/collapsible-card/index.js";
+import { ConditionalWrapper as tr } from "./components/conditional-wrapper/index.js";
+import { alert as mr, confirm as ar } from "./components/confirm/index.js";
+import { HCNotificationProvider as fr } from "./components/notification/index.js";
+import { Container as lr } from "./components/container/index.js";
+import { ContextMenu as cr } from "./components/context-menu/index.js";
+import { DataGrid as dr } from "./components/data-grid/index.js";
+import { DataMap as Pr } from "./components/data-map/index.js";
+import { DisseminationList as Dr } from "./components/data-security-selectors/dissemination-list/index.js";
+import { SecurityLevel as ur } from "./components/data-security-selectors/security-level/index.js";
+import { A as Sr, D as Ir } from "./index-e9xTIYWt.js";
+import { DEFAULT_RELATIVE_PRESET_LABELS as yr } from "./components/date-picker-with-custom-range/logic.js";
+import { DateTimePicker as Fr } from "./components/date-time-picker/index.js";
+import { Divider as kr } from "./components/divider/index.js";
+import { DateRangePicker as Rr } from "./components/date-range-picker/index.js";
+import { DocumentViewer as vr } from "./components/document-viewer/index.js";
+import { DurationSelect as Er } from "./components/duration-select/index.js";
+import { EditableText as Hr } from "./components/editable-text/index.js";
+import { GeometryPicker as Wr } from "./components/geometry-picker/index.js";
+import { Geometry as Or } from "./components/geometry-picker/geometry/index.js";
+import { Parser as Nr } from "./components/geometry-picker/parser/index.js";
+import { HeatMap as zr } from "./components/heat-map/index.js";
+import { IconButton as Yr } from "./components/icon-button/index.js";
+import { InstanceForm as Jr } from "./components/instance-form/index.js";
+import { InstanceHierarchyTable as Qr } from "./components/instance-hierarchy-table/index.js";
+import { InstanceTable as $r } from "./components/instance-table/index.js";
+import { InstanceVariableList as oo } from "./components/instance-variable-list/index.js";
+import { LinearIndicator as to } from "./components/linear-indicator/index.js";
+import { Loading as mo } from "./components/loading/index.js";
+import { Map as xo } from "./components/map/index.js";
+import { MetricCard as io } from "./components/metric-card/index.js";
+import { ObjectProfileCard as no } from "./components/object-profile-card/index.js";
+import { PaginatedList as so } from "./components/paginated-list/index.js";
+import { PhoneInput as Po } from "./components/phone-input/index.js";
+import { Placeholder as Do } from "./components/placeholder/index.js";
+import { PositionalTooltip as uo } from "./components/positional-tooltip/index.js";
+import { PrrMap as So } from "./components/prr-map/index.js";
+import { RangeSelector as go } from "./components/range-selector/index.js";
+import { RasterGridMap as Ao } from "./components/raster-grid-map/index.js";
+import { SearchInput as bo } from "./components/search-input/index.js";
+import { ScrollDrag as Mo } from "./components/scroll-drag/index.js";
+import { SimplePivotTable as Vo } from "./components/simple-pivot-table/index.js";
+import { SortableList as wo } from "./components/sortable-list/index.js";
+import { StatsBox as Go } from "./components/stats-box/index.js";
+import { StaticText as Bo } from "./components/static-text/index.js";
+import { Tabs as _o } from "./components/tabs/index.js";
+import { TextOverflow as Uo } from "./components/text-overflow/index.js";
+import { TemplateFilters as jo } from "./components/template-filters/index.js";
+import { TemplateForm as Xo } from "./components/template-form/index.js";
+import { TemplatePropertyFilters as qo } from "./components/template-property-filters/index.js";
+import { Property as Ko } from "./components/template-property-filters/property.js";
+import { TimelineWidget as Zo } from "./components/timeline/index.js";
+import { ToggleViewButton as re } from "./components/toggle-view-button/index.js";
+import { TreeSelect as ee } from "./components/tree-select/index.js";
+import { TreeViewFilter as pe } from "./components/treeview-filter/index.js";
+import { Uploader as ae } from "./components/uploader/index.js";
+import { VisuallyHiddenInput as fe } from "./components/visually-hidden-input/styled.js";
+import { Widget as le } from "./components/widget/styled.js";
+import { FlexCol as ce } from "./components/flex-col/index.js";
+import { FlexRow as de } from "./components/flex-row/index.js";
+import { notify as Pe, removeNotification as Te } from "./components/notification/store.js";
 export {
   x as Access,
   i as AccessUtils,
-  hr as AdapterDayjs,
-  J as Button,
+  Sr as AdapterDayjs,
+  Q as Button,
   T as CandlestickChart,
   n as Card,
   s as CardAlternate,
   C as ChartWrapper,
-  $ as CollapsibleCard,
-  Q as ColorPicker,
-  L as ColumnLineMix,
-  or as ConditionalWrapper,
-  fr as Container,
-  lr as ContextMenu,
-  Ir as DEFAULT_RELATIVE_PRESET_LABELS,
-  Y as DEFAULT_VIRIDIS_COOL,
-  cr as DataGrid,
-  dr as DataMap,
-  ur as DatePickerWithCustomRange,
-  kr as DateRangePicker,
-  yr as DateTimePicker,
-  Pr as DisseminationList,
-  Fr as Divider,
-  Rr as DocumentViewer,
-  u as DrillDownTreemap,
-  I as DrillDownVoronoiTreemap,
-  vr as DurationSelect,
-  Er as EditableText,
-  le as FlexCol,
-  ce as FlexRow,
-  Wr as GeometryDraw,
-  Or as GeometryParser,
-  Hr as GeometryPicker,
-  ar as HCNotificationProvider,
-  Nr as HeatMap,
-  y as Heatmap,
-  F as HighlightLineChart,
-  zr as IconButton,
-  Yr as InstanceForm,
-  Jr as InstanceHierarchyTable,
-  Qr as InstanceTable,
-  $r as InstanceVariableList,
-  k as LineChart,
-  oo as LinearIndicator,
-  to as Loading,
+  or as CollapsibleCard,
+  $ as ColorPicker,
+  h as ColumnLineMix,
+  tr as ConditionalWrapper,
+  lr as Container,
+  cr as ContextMenu,
+  yr as DEFAULT_RELATIVE_PRESET_LABELS,
+  J as DEFAULT_VIRIDIS_COOL,
+  dr as DataGrid,
+  Pr as DataMap,
+  Ir as DatePickerWithCustomRange,
+  Rr as DateRangePicker,
+  Fr as DateTimePicker,
+  Dr as DisseminationList,
+  kr as Divider,
+  vr as DocumentViewer,
+  L as DonutChart,
+  I as DrillDownTreemap,
+  y as DrillDownVoronoiTreemap,
+  Er as DurationSelect,
+  Hr as EditableText,
+  ce as FlexCol,
+  de as FlexRow,
+  Or as GeometryDraw,
+  Nr as GeometryParser,
+  Wr as GeometryPicker,
+  fr as HCNotificationProvider,
+  zr as HeatMap,
+  F as Heatmap,
+  k as HighlightLineChart,
+  Yr as IconButton,
+  Jr as InstanceForm,
+  Qr as InstanceHierarchyTable,
+  $r as InstanceTable,
+  oo as InstanceVariableList,
+  R as LineChart,
+  to as LinearIndicator,
+  mo as Loading,
   m as LocalizationProvider,
-  R as LogaritmicScale,
-  mo as Map,
-  xo as MetricCard,
-  v as MultipleValueAxes,
-  E as NestedPie,
-  io as ObjectProfileCard,
-  H as PackedCircles,
-  no as PaginatedList,
-  so as PhoneInput,
-  W as PieChart,
-  Po as Placeholder,
-  Do as PositionalTooltip,
-  qo as PropertyFilterInput,
-  ho as PrrMap,
-  So as RangeSelector,
-  go as RasterGridMap,
-  bo as ScrollDrag,
-  Ao as SearchInput,
-  Dr as SecurityLevel,
-  Mo as SimplePivotTable,
-  Vo as SortableList,
-  O as StackedAreaRadar,
-  N as StackedColumnChart,
-  Go as StaticText,
-  wo as StatsBox,
-  Bo as Tabs,
-  Uo as TemplateFilters,
-  jo as TemplateForm,
-  Xo as TemplatePropertyFilters,
-  _o as TextOverflow,
+  v as LogaritmicScale,
+  xo as Map,
+  io as MetricCard,
+  E as MultipleValueAxes,
+  H as NestedPie,
+  no as ObjectProfileCard,
+  W as PackedCircles,
+  so as PaginatedList,
+  Po as PhoneInput,
+  O as PieChart,
+  Do as Placeholder,
+  uo as PositionalTooltip,
+  Ko as PropertyFilterInput,
+  So as PrrMap,
+  go as RangeSelector,
+  Ao as RasterGridMap,
+  Mo as ScrollDrag,
+  bo as SearchInput,
+  ur as SecurityLevel,
+  Vo as SimplePivotTable,
+  wo as SortableList,
+  N as StackedAreaRadar,
+  z as StackedColumnChart,
+  Bo as StaticText,
+  Go as StatsBox,
+  _o as Tabs,
+  jo as TemplateFilters,
+  Xo as TemplateForm,
+  qo as TemplatePropertyFilters,
+  Uo as TextOverflow,
   e as ThemeProvider,
-  Ko as TimelineWidget,
-  Zo as ToggleViewButton,
-  re as TreeSelect,
-  ee as TreeViewFilter,
-  pe as Uploader,
-  ae as VisuallyHiddenInput,
-  fe as Widget,
-  z as XYChart,
-  tr as alert,
-  pr as confirm,
+  Zo as TimelineWidget,
+  re as ToggleViewButton,
+  ee as TreeSelect,
+  pe as TreeViewFilter,
+  ae as Uploader,
+  fe as VisuallyHiddenInput,
+  le as Widget,
+  Y as XYChart,
+  mr as alert,
+  ar as confirm,
   t as createTheme,
-  de as notify,
-  Ce as removeNotification
+  Pe as notify,
+  Te as removeNotification
 };

package/package.json

@@ -1,7 +1,7 @@
 {
   "name": "@hybridcore/ui",
   "description": "Hybrid Core UI Library",
-  "version": "1.6.3",
+  "version": "1.6.5",
   "author": "Hybrid Core",
   "license": "ISC",
   "type": "module",
@@ -55,7 +55,8 @@
     "react-number-format": "^5.3.4",
     "react-phone-number-input": "^3.3.7",
     "react-select": "^5.8.0",
-    "react-sortablejs": "^6.1.4"
+    "react-sortablejs": "^6.1.4",
+    "sortablejs": "^1"
   },
   "dependencies": {
     "@amcharts/amcharts5": "^5.14.4",
@@ -98,6 +99,7 @@
     "@types/react": "^18.3.10",
     "@types/react-color": "^3.0.12",
     "@types/react-dom": "^18.3.0",
+    "@types/sortablejs": "^1",
     "@types/terraformer__wkt": "^2",
     "@vitejs/plugin-react": "^4.3.2",
     "@wojtekmaj/react-daterange-picker": "^5.5.0",
@@ -123,6 +125,7 @@
     "react-phone-number-input": "^3.3.7",
     "react-select": "^5.8.0",
     "react-sortablejs": "^6.1.4",
+    "sortablejs": "^1",
     "storybook": "^8.3.5",
     "typescript": "^5.5.3",
     "typescript-eslint": "^8.7.0",