@stfrigerio/sito-template 0.1.6 → 0.1.8

package/dist/components/molecules/SearchBar/SearchBar.d.ts

@@ -1,5 +1,9 @@
 import React from 'react';
-export type SearchFilter = 'all' | 'projects' | 'clients' | 'contacts' | 'interactions' | 'team';
+export interface FilterOption {
+    value: string;
+    label: string;
+    icon: React.ElementType;
+}
 export interface SearchResult {
     id: string;
     type: string;
@@ -10,13 +14,18 @@ export interface SearchResult {
 export interface SearchBarProps {
     className?: string;
     placeholder?: string;
-    onSearch?: (query: string, filter: SearchFilter) => Promise<SearchResult[]>;
+    onSearch?: (query: string, filter: string) => Promise<SearchResult[]>;
     onResultClick?: (result: SearchResult) => void;
     onClear?: () => void;
     debounceDelay?: number;
     minSearchLength?: number;
     showFilter?: boolean;
     enableKeyboardShortcut?: boolean;
+    filterOptions?: FilterOption[];
+    entityIcons?: {
+        [key: string]: React.ElementType;
+    };
 }
+export type SearchFilter = 'all' | 'projects' | 'clients' | 'contacts' | 'interactions' | 'team';
 export declare const SearchBar: React.FC<SearchBarProps>;
 //# sourceMappingURL=SearchBar.d.ts.map

package/dist/components/molecules/SearchBar/SearchBar.d.ts.map

@@ -1 +1 @@
-{"version":3,"file":"SearchBar.d.ts","sourceRoot":"","sources":["../../../../src/components/molecules/SearchBar/SearchBar.tsx"],"names":[],"mappings":"AAAA,OAAO,KAAmD,MAAM,OAAO,CAAC;AAKxE,MAAM,MAAM,YAAY,GAAG,KAAK,GAAG,UAAU,GAAG,SAAS,GAAG,UAAU,GAAG,cAAc,GAAG,MAAM,CAAC;AAEjG,MAAM,WAAW,YAAY;IACzB,EAAE,EAAE,MAAM,CAAC;IACX,IAAI,EAAE,MAAM,CAAC;IACb,KAAK,CAAC,EAAE,MAAM,CAAC;IACf,QAAQ,CAAC,EAAE,MAAM,CAAC;IAClB,IAAI,CAAC,EAAE,MAAM,CAAC;CACjB;AAED,MAAM,WAAW,cAAc;IAC3B,SAAS,CAAC,EAAE,MAAM,CAAC;IACnB,WAAW,CAAC,EAAE,MAAM,CAAC;IACrB,QAAQ,CAAC,EAAE,CAAC,KAAK,EAAE,MAAM,EAAE,MAAM,EAAE,YAAY,KAAK,OAAO,CAAC,YAAY,EAAE,CAAC,CAAC;IAC5E,aAAa,CAAC,EAAE,CAAC,MAAM,EAAE,YAAY,KAAK,IAAI,CAAC;IAC/C,OAAO,CAAC,EAAE,MAAM,IAAI,CAAC;IACrB,aAAa,CAAC,EAAE,MAAM,CAAC;IACvB,eAAe,CAAC,EAAE,MAAM,CAAC;IACzB,UAAU,CAAC,EAAE,OAAO,CAAC;IACrB,sBAAsB,CAAC,EAAE,OAAO,CAAC;CACpC;AAmBD,eAAO,MAAM,SAAS,EAAE,KAAK,CAAC,EAAE,CAAC,cAAc,CAkV9C,CAAC"}
+{"version":3,"file":"SearchBar.d.ts","sourceRoot":"","sources":["../../../../src/components/molecules/SearchBar/SearchBar.tsx"],"names":[],"mappings":"AAAA,OAAO,KAAmD,MAAM,OAAO,CAAC;AAKxE,MAAM,WAAW,YAAY;IACzB,KAAK,EAAE,MAAM,CAAC;IACd,KAAK,EAAE,MAAM,CAAC;IACd,IAAI,EAAE,KAAK,CAAC,WAAW,CAAC;CAC3B;AAED,MAAM,WAAW,YAAY;IACzB,EAAE,EAAE,MAAM,CAAC;IACX,IAAI,EAAE,MAAM,CAAC;IACb,KAAK,CAAC,EAAE,MAAM,CAAC;IACf,QAAQ,CAAC,EAAE,MAAM,CAAC;IAClB,IAAI,CAAC,EAAE,MAAM,CAAC;CACjB;AAED,MAAM,WAAW,cAAc;IAC3B,SAAS,CAAC,EAAE,MAAM,CAAC;IACnB,WAAW,CAAC,EAAE,MAAM,CAAC;IACrB,QAAQ,CAAC,EAAE,CAAC,KAAK,EAAE,MAAM,EAAE,MAAM,EAAE,MAAM,KAAK,OAAO,CAAC,YAAY,EAAE,CAAC,CAAC;IACtE,aAAa,CAAC,EAAE,CAAC,MAAM,EAAE,YAAY,KAAK,IAAI,CAAC;IAC/C,OAAO,CAAC,EAAE,MAAM,IAAI,CAAC;IACrB,aAAa,CAAC,EAAE,MAAM,CAAC;IACvB,eAAe,CAAC,EAAE,MAAM,CAAC;IACzB,UAAU,CAAC,EAAE,OAAO,CAAC;IACrB,sBAAsB,CAAC,EAAE,OAAO,CAAC;IACjC,aAAa,CAAC,EAAE,YAAY,EAAE,CAAC;IAC/B,WAAW,CAAC,EAAE;QAAE,CAAC,GAAG,EAAE,MAAM,GAAG,KAAK,CAAC,WAAW,CAAA;KAAE,CAAC;CACtD;AAqBD,MAAM,MAAM,YAAY,GAAG,KAAK,GAAG,UAAU,GAAG,SAAS,GAAG,UAAU,GAAG,cAAc,GAAG,MAAM,CAAC;AAEjG,eAAO,MAAM,SAAS,EAAE,KAAK,CAAC,EAAE,CAAC,cAAc,CAuV9C,CAAC"}

package/dist/components/molecules/SearchBar/index.d.ts

@@ -1,3 +1,3 @@
 export { SearchBar } from './SearchBar';
-export type { SearchBarProps, SearchResult, SearchFilter } from './SearchBar';
+export type { SearchBarProps, SearchResult, SearchFilter, FilterOption } from './SearchBar';
 //# sourceMappingURL=index.d.ts.map

package/dist/components/molecules/SearchBar/index.d.ts.map

@@ -1 +1 @@
-{"version":3,"file":"index.d.ts","sourceRoot":"","sources":["../../../../src/components/molecules/SearchBar/index.ts"],"names":[],"mappings":"AAAA,OAAO,EAAE,SAAS,EAAE,MAAM,aAAa,CAAC;AACxC,YAAY,EAAE,cAAc,EAAE,YAAY,EAAE,YAAY,EAAE,MAAM,aAAa,CAAC"}
+{"version":3,"file":"index.d.ts","sourceRoot":"","sources":["../../../../src/components/molecules/SearchBar/index.ts"],"names":[],"mappings":"AAAA,OAAO,EAAE,SAAS,EAAE,MAAM,aAAa,CAAC;AACxC,YAAY,EAAE,cAAc,EAAE,YAAY,EAAE,YAAY,EAAE,YAAY,EAAE,MAAM,aAAa,CAAC"}

package/dist/components/molecules/Tabs/Tabs.d.ts

@@ -1,9 +1,15 @@
 import React from 'react';
-export type TabType = 'details' | 'github' | 'jira' | 'functional';
-interface TabsProps {
-    activeTab: TabType;
-    onTabChange: (tab: TabType) => void;
+export interface Tab {
+    id: string;
+    label: string;
+    icon?: React.ComponentType<any> | React.ReactNode;
+}
+export interface TabsProps {
+    activeTab: string;
+    onTabChange: (tab: string) => void;
+    tabs?: Tab[];
+    className?: string;
 }
+export type TabType = 'details' | 'github' | 'jira' | 'functional';
 export declare const Tabs: React.FC<TabsProps>;
-export {};
 //# sourceMappingURL=Tabs.d.ts.map

package/dist/components/molecules/Tabs/Tabs.d.ts.map

@@ -1 +1 @@
-{"version":3,"file":"Tabs.d.ts","sourceRoot":"","sources":["../../../../src/components/molecules/Tabs/Tabs.tsx"],"names":[],"mappings":"AAAA,OAAO,KAAK,MAAM,OAAO,CAAC;AAM1B,MAAM,MAAM,OAAO,GAAG,SAAS,GAAG,QAAQ,GAAG,MAAM,GAAG,YAAY,CAAC;AAEnE,UAAU,SAAS;IACf,SAAS,EAAE,OAAO,CAAC;IACnB,WAAW,EAAE,CAAC,GAAG,EAAE,OAAO,KAAK,IAAI,CAAC;CACvC;AASD,eAAO,MAAM,IAAI,EAAE,KAAK,CAAC,EAAE,CAAC,SAAS,CAkCpC,CAAC"}
+{"version":3,"file":"Tabs.d.ts","sourceRoot":"","sources":["../../../../src/components/molecules/Tabs/Tabs.tsx"],"names":[],"mappings":"AAAA,OAAO,KAAK,MAAM,OAAO,CAAC;AAM1B,MAAM,WAAW,GAAG;IAChB,EAAE,EAAE,MAAM,CAAC;IACX,KAAK,EAAE,MAAM,CAAC;IACd,IAAI,CAAC,EAAE,KAAK,CAAC,aAAa,CAAC,GAAG,CAAC,GAAG,KAAK,CAAC,SAAS,CAAC;CACrD;AAED,MAAM,WAAW,SAAS;IACtB,SAAS,EAAE,MAAM,CAAC;IAClB,WAAW,EAAE,CAAC,GAAG,EAAE,MAAM,KAAK,IAAI,CAAC;IACnC,IAAI,CAAC,EAAE,GAAG,EAAE,CAAC;IACb,SAAS,CAAC,EAAE,MAAM,CAAC;CACtB;AAWD,MAAM,MAAM,OAAO,GAAG,SAAS,GAAG,QAAQ,GAAG,MAAM,GAAG,YAAY,CAAC;AAEnE,eAAO,MAAM,IAAI,EAAE,KAAK,CAAC,EAAE,CAAC,SAAS,CAgDpC,CAAC"}

package/dist/components/molecules/ThemeSwitcher/ThemeSwitcher.d.ts

@@ -1,9 +1,16 @@
 import React from 'react';
-interface ThemeSwitcherProps {
+export interface ThemeOption {
+    value: string;
+    label: string;
+    icon: React.ReactNode;
+}
+export interface ThemeSwitcherProps {
     variant?: 'button' | 'dropdown' | 'toggle';
     showLabel?: boolean;
     className?: string;
+    currentTheme?: string;
+    onThemeChange?: (theme: string) => void;
+    themes?: ThemeOption[];
 }
 export declare const ThemeSwitcher: React.FC<ThemeSwitcherProps>;
-export {};
 //# sourceMappingURL=ThemeSwitcher.d.ts.map

package/dist/components/molecules/ThemeSwitcher/ThemeSwitcher.d.ts.map

@@ -1 +1 @@
-{"version":3,"file":"ThemeSwitcher.d.ts","sourceRoot":"","sources":["../../../../src/components/molecules/ThemeSwitcher/ThemeSwitcher.tsx"],"names":[],"mappings":"AAAA,OAAO,KAAK,MAAM,OAAO,CAAC;AAM1B,UAAU,kBAAkB;IACxB,OAAO,CAAC,EAAE,QAAQ,GAAG,UAAU,GAAG,QAAQ,CAAC;IAC3C,SAAS,CAAC,EAAE,OAAO,CAAC;IACpB,SAAS,CAAC,EAAE,MAAM,CAAC;CACtB;AAED,eAAO,MAAM,aAAa,EAAE,KAAK,CAAC,EAAE,CAAC,kBAAkB,CAuGtD,CAAC"}
+{"version":3,"file":"ThemeSwitcher.d.ts","sourceRoot":"","sources":["../../../../src/components/molecules/ThemeSwitcher/ThemeSwitcher.tsx"],"names":[],"mappings":"AAAA,OAAO,KAAK,MAAM,OAAO,CAAC;AAM1B,MAAM,WAAW,WAAW;IACxB,KAAK,EAAE,MAAM,CAAC;IACd,KAAK,EAAE,MAAM,CAAC;IACd,IAAI,EAAE,KAAK,CAAC,SAAS,CAAC;CACzB;AAED,MAAM,WAAW,kBAAkB;IAC/B,OAAO,CAAC,EAAE,QAAQ,GAAG,UAAU,GAAG,QAAQ,CAAC;IAC3C,SAAS,CAAC,EAAE,OAAO,CAAC;IACpB,SAAS,CAAC,EAAE,MAAM,CAAC;IACnB,YAAY,CAAC,EAAE,MAAM,CAAC;IACtB,aAAa,CAAC,EAAE,CAAC,KAAK,EAAE,MAAM,KAAK,IAAI,CAAC;IACxC,MAAM,CAAC,EAAE,WAAW,EAAE,CAAC;CAC1B;AAED,eAAO,MAAM,aAAa,EAAE,KAAK,CAAC,EAAE,CAAC,kBAAkB,CAsHtD,CAAC"}

package/dist/components/molecules/index.d.ts

@@ -1,10 +1,11 @@
 export { EditFAB } from './EditFAB';
 export type { EditFABProps } from './EditFAB';
 export { SearchBar } from './SearchBar';
-export type { SearchBarProps } from './SearchBar';
+export type { SearchBarProps, FilterOption, SearchResult, SearchFilter } from './SearchBar';
 export { TimeInput } from './TimeInput';
 export type { TimeInputProps } from './TimeInput';
 export { ThemeSwitcher } from './ThemeSwitcher/ThemeSwitcher';
+export type { ThemeSwitcherProps, ThemeOption } from './ThemeSwitcher/ThemeSwitcher';
 export { Tabs } from './Tabs/Tabs';
-export type { TabType } from './Tabs/Tabs';
+export type { TabsProps, Tab } from './Tabs/Tabs';
 //# sourceMappingURL=index.d.ts.map

package/dist/components/molecules/index.d.ts.map

@@ -1 +1 @@
-{"version":3,"file":"index.d.ts","sourceRoot":"","sources":["../../../src/components/molecules/index.ts"],"names":[],"mappings":"AACA,OAAO,EAAE,OAAO,EAAE,MAAM,WAAW,CAAC;AACpC,YAAY,EAAE,YAAY,EAAE,MAAM,WAAW,CAAC;AAE9C,OAAO,EAAE,SAAS,EAAE,MAAM,aAAa,CAAC;AACxC,YAAY,EAAE,cAAc,EAAE,MAAM,aAAa,CAAC;AAElD,OAAO,EAAE,SAAS,EAAE,MAAM,aAAa,CAAC;AACxC,YAAY,EAAE,cAAc,EAAE,MAAM,aAAa,CAAC;AAElD,OAAO,EAAE,aAAa,EAAE,MAAM,+BAA+B,CAAC;AAE9D,OAAO,EAAE,IAAI,EAAE,MAAM,aAAa,CAAC;AACnC,YAAY,EAAE,OAAO,EAAE,MAAM,aAAa,CAAC"}
+{"version":3,"file":"index.d.ts","sourceRoot":"","sources":["../../../src/components/molecules/index.ts"],"names":[],"mappings":"AACA,OAAO,EAAE,OAAO,EAAE,MAAM,WAAW,CAAC;AACpC,YAAY,EAAE,YAAY,EAAE,MAAM,WAAW,CAAC;AAE9C,OAAO,EAAE,SAAS,EAAE,MAAM,aAAa,CAAC;AACxC,YAAY,EAAE,cAAc,EAAE,YAAY,EAAE,YAAY,EAAE,YAAY,EAAE,MAAM,aAAa,CAAC;AAE5F,OAAO,EAAE,SAAS,EAAE,MAAM,aAAa,CAAC;AACxC,YAAY,EAAE,cAAc,EAAE,MAAM,aAAa,CAAC;AAElD,OAAO,EAAE,aAAa,EAAE,MAAM,+BAA+B,CAAC;AAC9D,YAAY,EAAE,kBAAkB,EAAE,WAAW,EAAE,MAAM,+BAA+B,CAAC;AAErF,OAAO,EAAE,IAAI,EAAE,MAAM,aAAa,CAAC;AACnC,YAAY,EAAE,SAAS,EAAE,GAAG,EAAE,MAAM,aAAa,CAAC"}

package/dist/components/organisms/charts/PieChart/PieChart.d.ts

@@ -10,6 +10,8 @@ interface PieChartProps {
     height?: number;
     title?: string;
     showLegend?: boolean;
+    unit?: string;
+    centerLabel?: string;
 }
 export declare const PieChart: React.FC<PieChartProps>;
 export {};

package/dist/components/organisms/charts/PieChart/PieChart.d.ts.map

@@ -1 +1 @@
-{"version":3,"file":"PieChart.d.ts","sourceRoot":"","sources":["../../../../../src/components/organisms/charts/PieChart/PieChart.tsx"],"names":[],"mappings":"AAAA,OAAO,KAA4B,MAAM,OAAO,CAAA;AAIhD,UAAU,YAAY;IAClB,IAAI,EAAE,MAAM,CAAA;IACZ,KAAK,EAAE,MAAM,CAAA;IACb,KAAK,CAAC,EAAE,MAAM,CAAA;CACjB;AAED,UAAU,aAAa;IACnB,IAAI,EAAE,YAAY,EAAE,CAAA;IACpB,KAAK,CAAC,EAAE,MAAM,CAAA;IACd,MAAM,CAAC,EAAE,MAAM,CAAA;IACf,KAAK,CAAC,EAAE,MAAM,CAAA;IACd,UAAU,CAAC,EAAE,OAAO,CAAA;CACvB;AASD,eAAO,MAAM,QAAQ,EAAE,KAAK,CAAC,EAAE,CAAC,aAAa,CAqI5C,CAAA"}
+{"version":3,"file":"PieChart.d.ts","sourceRoot":"","sources":["../../../../../src/components/organisms/charts/PieChart/PieChart.tsx"],"names":[],"mappings":"AAAA,OAAO,KAA4B,MAAM,OAAO,CAAA;AAIhD,UAAU,YAAY;IAClB,IAAI,EAAE,MAAM,CAAA;IACZ,KAAK,EAAE,MAAM,CAAA;IACb,KAAK,CAAC,EAAE,MAAM,CAAA;CACjB;AAED,UAAU,aAAa;IACnB,IAAI,EAAE,YAAY,EAAE,CAAA;IACpB,KAAK,CAAC,EAAE,MAAM,CAAA;IACd,MAAM,CAAC,EAAE,MAAM,CAAA;IACf,KAAK,CAAC,EAAE,MAAM,CAAA;IACd,UAAU,CAAC,EAAE,OAAO,CAAA;IACpB,IAAI,CAAC,EAAE,MAAM,CAAA;IACb,WAAW,CAAC,EAAE,MAAM,CAAA;CACvB;AAsBD,eAAO,MAAM,QAAQ,EAAE,KAAK,CAAC,EAAE,CAAC,aAAa,CAoL5C,CAAA"}

package/dist/components/organisms/charts/QuantifiableHabitsChart/QuantifiableHabitsChart.d.ts.map

@@ -1 +1 @@
-{"version":3,"file":"QuantifiableHabitsChart.d.ts","sourceRoot":"","sources":["../../../../../src/components/organisms/charts/QuantifiableHabitsChart/QuantifiableHabitsChart.tsx"],"names":[],"mappings":"AAAA,OAAO,KAA+C,MAAM,OAAO,CAAA;AAInE,MAAM,MAAM,QAAQ,GAAG,OAAO,GAAG,QAAQ,GAAG,SAAS,GAAG,WAAW,CAAA;AAOnE,UAAU,SAAS;IACf,KAAK,EAAE,MAAM,EAAE,CAAA;IACf,CAAC,KAAK,EAAE,MAAM,GAAG,MAAM,EAAE,GAAG,MAAM,EAAE,CAAA;CACvC;AAED,UAAU,4BAA4B;IAClC,IAAI,EAAE,SAAS,CAAA;IACf,KAAK,CAAC,EAAE,MAAM,CAAA;IACd,MAAM,CAAC,EAAE,MAAM,CAAA;IACf,eAAe,CAAC,EAAE,QAAQ,CAAA;IAC1B,UAAU,CAAC,EAAE,MAAM,GAAG,OAAO,GAAG,SAAS,GAAG,MAAM,GAAG,SAAS,CAAA;IAC9D,WAAW,CAAC,EAAE;QAAE,CAAC,GAAG,EAAE,MAAM,GAAG,MAAM,CAAA;KAAE,CAAA;IACvC,WAAW,CAAC,EAAE;QAAE,CAAC,GAAG,EAAE,MAAM,GAAG,MAAM,CAAA;KAAE,CAAA;CAC1C;AAcD,eAAO,MAAM,uBAAuB,EAAE,KAAK,CAAC,EAAE,CAAC,4BAA4B,CAuU1E,CAAA"}
+{"version":3,"file":"QuantifiableHabitsChart.d.ts","sourceRoot":"","sources":["../../../../../src/components/organisms/charts/QuantifiableHabitsChart/QuantifiableHabitsChart.tsx"],"names":[],"mappings":"AAAA,OAAO,KAA+C,MAAM,OAAO,CAAA;AAInE,MAAM,MAAM,QAAQ,GAAG,OAAO,GAAG,QAAQ,GAAG,SAAS,GAAG,WAAW,CAAA;AAOnE,UAAU,SAAS;IACf,KAAK,EAAE,MAAM,EAAE,CAAA;IACf,CAAC,KAAK,EAAE,MAAM,GAAG,MAAM,EAAE,GAAG,MAAM,EAAE,CAAA;CACvC;AAED,UAAU,4BAA4B;IAClC,IAAI,EAAE,SAAS,CAAA;IACf,KAAK,CAAC,EAAE,MAAM,CAAA;IACd,MAAM,CAAC,EAAE,MAAM,CAAA;IACf,eAAe,CAAC,EAAE,QAAQ,CAAA;IAC1B,UAAU,CAAC,EAAE,MAAM,GAAG,OAAO,GAAG,SAAS,GAAG,MAAM,GAAG,SAAS,CAAA;IAC9D,WAAW,CAAC,EAAE;QAAE,CAAC,GAAG,EAAE,MAAM,GAAG,MAAM,CAAA;KAAE,CAAA;IACvC,WAAW,CAAC,EAAE;QAAE,CAAC,GAAG,EAAE,MAAM,GAAG,MAAM,CAAA;KAAE,CAAA;CAC1C;AAcD,eAAO,MAAM,uBAAuB,EAAE,KAAK,CAAC,EAAE,CAAC,4BAA4B,CA8T1E,CAAA"}

package/dist/components/organisms/charts/SunburstChart/SunburstChart.d.ts

@@ -10,6 +10,8 @@ interface SunburstChartProps {
     height?: number;
     title?: string;
     tagColors?: Record<string, string>;
+    unit?: string;
+    centerLabel?: string;
 }
 export declare const SunburstChart: React.FC<SunburstChartProps>;
 export {};

package/dist/components/organisms/charts/SunburstChart/SunburstChart.d.ts.map

@@ -1 +1 @@
-{"version":3,"file":"SunburstChart.d.ts","sourceRoot":"","sources":["../../../../../src/components/organisms/charts/SunburstChart/SunburstChart.tsx"],"names":[],"mappings":"AAAA,OAAO,KAAqC,MAAM,OAAO,CAAA;AAIzD,MAAM,WAAW,cAAc;IAC3B,IAAI,EAAE,MAAM,CAAA;IACZ,IAAI,CAAC,EAAE,MAAM,CAAA;IACb,QAAQ,CAAC,EAAE,cAAc,EAAE,CAAA;CAC9B;AAED,UAAU,kBAAkB;IACxB,IAAI,EAAE,cAAc,CAAA;IACpB,KAAK,CAAC,EAAE,MAAM,CAAA;IACd,MAAM,CAAC,EAAE,MAAM,CAAA;IACf,KAAK,CAAC,EAAE,MAAM,CAAA;IACd,SAAS,CAAC,EAAE,MAAM,CAAC,MAAM,EAAE,MAAM,CAAC,CAAA;CACrC;AAQD,eAAO,MAAM,aAAa,EAAE,KAAK,CAAC,EAAE,CAAC,kBAAkB,CAwJtD,CAAA"}
+{"version":3,"file":"SunburstChart.d.ts","sourceRoot":"","sources":["../../../../../src/components/organisms/charts/SunburstChart/SunburstChart.tsx"],"names":[],"mappings":"AAAA,OAAO,KAAqC,MAAM,OAAO,CAAA;AAIzD,MAAM,WAAW,cAAc;IAC3B,IAAI,EAAE,MAAM,CAAA;IACZ,IAAI,CAAC,EAAE,MAAM,CAAA;IACb,QAAQ,CAAC,EAAE,cAAc,EAAE,CAAA;CAC9B;AAED,UAAU,kBAAkB;IACxB,IAAI,EAAE,cAAc,CAAA;IACpB,KAAK,CAAC,EAAE,MAAM,CAAA;IACd,MAAM,CAAC,EAAE,MAAM,CAAA;IACf,KAAK,CAAC,EAAE,MAAM,CAAA;IACd,SAAS,CAAC,EAAE,MAAM,CAAC,MAAM,EAAE,MAAM,CAAC,CAAA;IAClC,IAAI,CAAC,EAAE,MAAM,CAAA;IACb,WAAW,CAAC,EAAE,MAAM,CAAA;CACvB;AAqBD,eAAO,MAAM,aAAa,EAAE,KAAK,CAAC,EAAE,CAAC,kBAAkB,CAwNtD,CAAA"}

package/dist/index.esm.js

@@ -1178,7 +1178,8 @@ const EditFAB = ({ canEdit, isEditMode, hasUnsavedChanges = false, isSaving = fa
 
 var styles$a = {"searchContainer":"SearchBar-module_searchContainer__TdM1w","searchInputWrapper":"SearchBar-module_searchInputWrapper__kCZLU","searchIcon":"SearchBar-module_searchIcon__IIxEu","searchInput":"SearchBar-module_searchInput__V4gkE","clearButton":"SearchBar-module_clearButton__7fNIY","filterSelect":"SearchBar-module_filterSelect__xIVE4","resultsDropdown":"SearchBar-module_resultsDropdown__yh6NF","loadingState":"SearchBar-module_loadingState__4gidK","emptyState":"SearchBar-module_emptyState__RbI4s","spinner":"SearchBar-module_spinner__PMc6-","resultsGroups":"SearchBar-module_resultsGroups__U24DC","resultGroup":"SearchBar-module_resultGroup__SoTQH","groupHeader":"SearchBar-module_groupHeader__bFRHA","groupIcon":"SearchBar-module_groupIcon__9ENM-","groupTitle":"SearchBar-module_groupTitle__ZekZs","groupCount":"SearchBar-module_groupCount__PQIqw","groupResults":"SearchBar-module_groupResults__xTF52","resultItem":"SearchBar-module_resultItem__VaKKy","highlighted":"SearchBar-module_highlighted__Q-3sH","resultTitle":"SearchBar-module_resultTitle__i1uqL","resultSubtitle":"SearchBar-module_resultSubtitle__LQOJ1","resultMeta":"SearchBar-module_resultMeta__Kmkrn","resultContent":"SearchBar-module_resultContent__TzVzL","highlight":"SearchBar-module_highlight__Q3PSP"};
 
-const filterOptions = [
+// Default filter options for backwards compatibility
+const defaultFilterOptions = [
     { value: 'all', label: 'All', icon: FiSearch },
     { value: 'projects', label: 'Projects', icon: FiFolder },
     { value: 'clients', label: 'Clients', icon: FiUsers },
@@ -1186,16 +1187,18 @@ const filterOptions = [
     { value: 'interactions', label: 'Interactions', icon: FiMessageSquare },
     { value: 'team', label: 'Team', icon: FiUserPlus },
 ];
-const entityIcons = {
+const defaultEntityIcons = {
     projects: FiFolder,
     clients: FiUsers,
     contacts: FiBook,
     interactions: FiMessageSquare,
     team: FiUserPlus,
 };
-const SearchBar = ({ className, placeholder = "Search (Ctrl+Space)...", onSearch, onResultClick, onClear, debounceDelay = 300, minSearchLength = 2, showFilter = true, enableKeyboardShortcut = true }) => {
+const SearchBar = ({ className, placeholder = "Search (Ctrl+Space)...", onSearch, onResultClick, onClear, debounceDelay = 300, minSearchLength = 2, showFilter = true, enableKeyboardShortcut = true, filterOptions: customFilterOptions, entityIcons: customEntityIcons }) => {
+    const filterOptions = customFilterOptions ?? defaultFilterOptions;
+    const entityIcons = customEntityIcons ?? defaultEntityIcons;
     const [query, setQuery] = useState('');
-    const [filter, setFilter] = useState('all');
+    const [filter, setFilter] = useState(filterOptions[0]?.value ?? 'all');
     const [results, setResults] = useState([]);
     const [isLoading, setIsLoading] = useState(false);
     const [isDropdownOpen, setIsDropdownOpen] = useState(false);
@@ -1479,9 +1482,19 @@ const useTheme = () => {
 
 var styles$7 = {"button":"ThemeSwitcher-module_button__VfRjU","iconWrapper":"ThemeSwitcher-module_iconWrapper__FpHo8","label":"ThemeSwitcher-module_label__2Hfkp","toggle":"ThemeSwitcher-module_toggle__ATXx4","toggleTrack":"ThemeSwitcher-module_toggleTrack__x28Rv","toggleThumb":"ThemeSwitcher-module_toggleThumb__V8QeN","dropdown":"ThemeSwitcher-module_dropdown__3qLdt","dropdownTrigger":"ThemeSwitcher-module_dropdownTrigger__UzYV5","dropdownMenu":"ThemeSwitcher-module_dropdownMenu__3L5hT","dropdownItem":"ThemeSwitcher-module_dropdownItem__inw-K","active":"ThemeSwitcher-module_active__OHP19","icon":"ThemeSwitcher-module_icon__iRZiJ","text":"ThemeSwitcher-module_text__OCOoA"};
 
-const ThemeSwitcher = ({ variant = 'button', showLabel = false, className = '', }) => {
-    const { theme, setTheme } = useTheme();
-    const themes = [
+const ThemeSwitcher = ({ variant = 'button', showLabel = false, className = '', currentTheme, onThemeChange, themes: customThemes, }) => {
+    // Try to use internal context if available, otherwise use props
+    const contextTheme = (() => {
+        try {
+            return useTheme();
+        }
+        catch {
+            return null;
+        }
+    })();
+    const theme = currentTheme ?? contextTheme?.theme ?? 'light';
+    const setTheme = onThemeChange ?? contextTheme?.setTheme ?? (() => { });
+    const defaultThemes = [
         { value: 'light', label: 'Light', icon: jsx(FiSun, {}) },
         { value: 'dark', label: 'Dark', icon: jsx(FiMoon, {}) },
         { value: 'lossito', label: 'Lossito Light', icon: '✨' },
@@ -1489,21 +1502,22 @@ const ThemeSwitcher = ({ variant = 'button', showLabel = false, className = '',
         { value: 'dmood', label: 'Dmood Light', icon: '💙' },
         { value: 'dmood-dark', label: 'Dmood Dark', icon: '🌌' },
     ];
+    const themes = customThemes ?? defaultThemes;
     const currentThemeIndex = themes.findIndex(t => t.value === theme);
-    const currentTheme = themes[currentThemeIndex];
+    const currentThemeData = themes[currentThemeIndex] ?? themes[0];
     if (variant === 'toggle') {
         // Simple toggle between light and dark
         const isDark = theme.includes('dark');
         return (jsxs(motion.button, { className: `${styles$7.toggle} ${className}`, onClick: () => setTheme(isDark ? 'light' : 'dark'), whileTap: { scale: 0.95 }, "aria-label": "Toggle theme", children: [jsx(motion.div, { className: styles$7.toggleTrack, animate: { backgroundColor: isDark ? 'var(--color-primary)' : 'var(--color-border)' }, children: jsx(motion.div, { className: styles$7.toggleThumb, animate: { x: isDark ? 24 : 0 }, transition: { type: 'spring', stiffness: 500, damping: 30 }, children: isDark ? jsx(FiMoon, { size: 14 }) : jsx(FiSun, { size: 14 }) }) }), showLabel && jsx("span", { className: styles$7.label, children: isDark ? 'Dark' : 'Light' })] }));
     }
     if (variant === 'dropdown') {
-        return (jsxs("div", { className: `${styles$7.dropdown} ${className}`, children: [jsxs(motion.button, { className: styles$7.dropdownTrigger, whileTap: { scale: 0.98 }, children: [currentTheme.icon, showLabel && jsx("span", { className: styles$7.label, children: currentTheme.label })] }), jsx(motion.div, { className: styles$7.dropdownMenu, initial: { opacity: 0, y: -10 }, animate: { opacity: 1, y: 0 }, children: themes.map((t) => (jsxs(motion.button, { className: `${styles$7.dropdownItem} ${theme === t.value ? styles$7.active : ''}`, onClick: () => setTheme(t.value), whileHover: { x: 4 }, whileTap: { scale: 0.98 }, children: [jsx("span", { className: styles$7.icon, children: t.icon }), jsx("span", { className: styles$7.text, children: t.label })] }, t.value))) })] }));
+        return (jsxs("div", { className: `${styles$7.dropdown} ${className}`, children: [jsxs(motion.button, { className: styles$7.dropdownTrigger, whileTap: { scale: 0.98 }, children: [currentThemeData.icon, showLabel && jsx("span", { className: styles$7.label, children: currentThemeData.label })] }), jsx(motion.div, { className: styles$7.dropdownMenu, initial: { opacity: 0, y: -10 }, animate: { opacity: 1, y: 0 }, children: themes.map((t) => (jsxs(motion.button, { className: `${styles$7.dropdownItem} ${theme === t.value ? styles$7.active : ''}`, onClick: () => setTheme(t.value), whileHover: { x: 4 }, whileTap: { scale: 0.98 }, children: [jsx("span", { className: styles$7.icon, children: t.icon }), jsx("span", { className: styles$7.text, children: t.label })] }, t.value))) })] }));
     }
     // Default button variant - cycles through themes
     return (jsxs(motion.button, { className: `${styles$7.button} ${className}`, onClick: () => {
             const nextIndex = (currentThemeIndex + 1) % themes.length;
             setTheme(themes[nextIndex].value);
-        }, whileTap: { scale: 0.95 }, whileHover: { scale: 1.05 }, "aria-label": `Current theme: ${currentTheme.label}. Click to change.`, children: [jsx(motion.div, { initial: { rotate: -180, opacity: 0 }, animate: { rotate: 0, opacity: 1 }, exit: { rotate: 180, opacity: 0 }, transition: { duration: 0.3 }, className: styles$7.iconWrapper, children: currentTheme.icon }, theme), showLabel && jsx("span", { className: styles$7.label, children: currentTheme.label })] }));
+        }, whileTap: { scale: 0.95 }, whileHover: { scale: 1.05 }, "aria-label": `Current theme: ${currentThemeData.label}. Click to change.`, children: [jsx(motion.div, { initial: { rotate: -180, opacity: 0 }, animate: { rotate: 0, opacity: 1 }, exit: { rotate: 180, opacity: 0 }, transition: { duration: 0.3 }, className: styles$7.iconWrapper, children: currentThemeData.icon }, theme), showLabel && jsx("span", { className: styles$7.label, children: currentThemeData.label })] }));
 };
 
 // THIS FILE IS AUTO GENERATED
@@ -1513,15 +1527,16 @@ function SiJira (props) {
 
 var styles$6 = {"tabs":"Tabs-module_tabs__Vlvn7","tab":"Tabs-module_tab__uQKim","tabIcon":"Tabs-module_tabIcon__AgN-O"};
 
-const tabs = [
+// Default tabs for backwards compatibility
+const defaultTabs = [
     { id: 'details', icon: FiInfo, label: 'Dettagli' },
     { id: 'github', icon: FiGithub, label: 'GitHub' },
     { id: 'jira', icon: SiJira, label: 'Jira' },
     { id: 'functional', icon: FiInfo, label: 'Analisi funzionale' }
 ];
-const Tabs = ({ activeTab, onTabChange }) => {
-    return (jsx("div", { className: styles$6.tabs, children: tabs.map((tab) => {
-            const Icon = tab.icon;
+const Tabs = ({ activeTab, onTabChange, tabs: customTabs, className = '' }) => {
+    const tabs = customTabs ?? defaultTabs;
+    return (jsx("div", { className: `${styles$6.tabs} ${className}`, children: tabs.map((tab) => {
             const isActive = activeTab === tab.id;
             return (jsxs(motion.button, { className: styles$6.tab, "data-active": isActive, onClick: () => onTabChange(tab.id), style: { position: 'relative' }, children: [jsx(motion.div, { animate: {
                             rotate: isActive ? [0, -10, 10, -5, 5, 0] : 0,
@@ -1530,7 +1545,7 @@ const Tabs = ({ activeTab, onTabChange }) => {
                                 duration: 0.5,
                                 ease: 'easeInOut'
                             }
-                        }, children: jsx(Icon, { className: styles$6.tabIcon }) }), jsx("span", { children: tab.label })] }, tab.id));
+                        }, children: tab.icon && (typeof tab.icon === 'function' ? (jsx("span", { className: styles$6.tabIcon, children: React.createElement(tab.icon) })) : (jsx("span", { className: styles$6.tabIcon, children: tab.icon }))) }), jsx("span", { children: tab.label })] }, tab.id));
         }) }));
 };
 
@@ -2214,11 +2229,22 @@ const BooleansHeatmap = ({ data, habitName, width = 800, height = 200, habitColo
 var styles$1 = {"container":"SunburstChart-module_container__w1ZYc","title":"SunburstChart-module_title__T6Ak7","chart":"SunburstChart-module_chart__BFM6E","tooltip":"SunburstChart-module_tooltip__TuTAN"};
 
 const COLOR_PALETTE = [
-    '#d4af37', '#FFD700', '#FFA500', '#FF8C00',
-    '#FF6347', '#DC143C', '#8B4513', '#A0522D',
-    '#DEB887', '#F4A460', '#D2691E', '#CD853F'
+    '#6366f1', '#8b5cf6', '#06b6d4', '#10b981',
+    '#f59e0b', '#ef4444', '#ec4899', '#84cc16',
+    '#f97316', '#3b82f6', '#14b8a6', '#f59e0b'
 ];
-const SunburstChart = ({ data, width = 500, height = 500, title = 'Sunburst Chart', tagColors = {} }) => {
+// Calculate text color based on background luminance for optimal contrast
+const getTextColor$1 = (backgroundColor) => {
+    const color = d3.color(backgroundColor);
+    if (!color)
+        return '#ffffff';
+    const rgb = color.rgb();
+    // Calculate relative luminance using WCAG formula
+    const luminance = (0.299 * rgb.r + 0.587 * rgb.g + 0.114 * rgb.b) / 255;
+    // Return white text for dark backgrounds, black for light backgrounds
+    return luminance > 0.5 ? '#000000' : '#ffffff';
+};
+const SunburstChart = ({ data, width = 500, height = 500, title = 'Sunburst Chart', tagColors = {}, unit = 'items', centerLabel }) => {
     const svgRef = useRef(null);
     const colorMap = useRef(new Map()).current;
     const colorIndex = useRef(0);
@@ -2261,7 +2287,8 @@ const SunburstChart = ({ data, width = 500, height = 500, title = 'Sunburst Char
             .startAngle(d => d.x0)
             .endAngle(d => d.x1)
             .innerRadius(d => Math.sqrt(d.y0))
-            .outerRadius(d => Math.sqrt(d.y1));
+            .outerRadius(d => Math.sqrt(d.y1))
+            .cornerRadius(3);
         const tooltip = d3.select('body').append('div')
             .attr('class', styles$1.tooltip)
             .style('opacity', 0)
@@ -2280,11 +2307,20 @@ const SunburstChart = ({ data, width = 500, height = 500, title = 'Sunburst Char
             .attr('stroke', 'var(--bg-primary)')
             .attr('stroke-width', 2)
             .style('cursor', 'pointer')
+            .style('filter', 'drop-shadow(0 1px 3px rgba(0,0,0,0.12))')
             .on('mouseover', function (event, d) {
+            const hoverArc = d3.arc()
+                .startAngle(d => d.x0)
+                .endAngle(d => d.x1)
+                .innerRadius(d => Math.sqrt(d.y0) - 2)
+                .outerRadius(d => Math.sqrt(d.y1) + 4)
+                .cornerRadius(3);
             d3.select(this)
                 .transition()
-                .duration(200)
-                .style('opacity', 0.8);
+                .duration(150)
+                .attr('d', d => hoverArc(d))
+                .style('filter', 'drop-shadow(0 2px 8px rgba(0,0,0,0.2))')
+                .style('opacity', 0.9);
             tooltip.transition()
                 .duration(200)
                 .style('opacity', 1);
@@ -2298,10 +2334,12 @@ const SunburstChart = ({ data, width = 500, height = 500, title = 'Sunburst Char
                 .style('left', (event.pageX + 10) + 'px')
                 .style('top', (event.pageY - 28) + 'px');
         })
-            .on('mouseout', function () {
+            .on('mouseout', function (event, d) {
             d3.select(this)
                 .transition()
-                .duration(200)
+                .duration(150)
+                .attr('d', d => arc(d))
+                .style('filter', 'drop-shadow(0 1px 3px rgba(0,0,0,0.12))')
                 .style('opacity', 1);
             tooltip.transition()
                 .duration(500)
@@ -2311,9 +2349,32 @@ const SunburstChart = ({ data, width = 500, height = 500, title = 'Sunburst Char
             const angle = d.x1 - d.x0;
             return angle > 0.15 && d.depth <= 2;
         };
-        g.selectAll('text')
+        // Calculate average background color for center text contrast
+        const allSegments = nodes.filter(d => d.depth === 1);
+        const avgColor = allSegments.length > 0 ? d3.interpolateRgb.gamma(2.2)(...allSegments.map(d => getColor(d.data.name, 1)))(0.5) : '#ffffff';
+        const centerTextColor = getTextColor$1(avgColor);
+        // Add center text
+        g.append('text')
+            .attr('text-anchor', 'middle')
+            .attr('alignment-baseline', 'middle')
+            .attr('font-size', '18px')
+            .attr('font-weight', 'bold')
+            .attr('fill', centerTextColor)
+            .style('text-shadow', centerTextColor === '#ffffff' ? '0 1px 3px rgba(0,0,0,0.5)' : '0 1px 3px rgba(255,255,255,0.5)')
+            .text(centerLabel || data.name || 'Total');
+        g.append('text')
+            .attr('text-anchor', 'middle')
+            .attr('alignment-baseline', 'middle')
+            .attr('y', 20)
+            .attr('font-size', '14px')
+            .attr('font-weight', '500')
+            .attr('fill', centerTextColor)
+            .style('text-shadow', centerTextColor === '#ffffff' ? '0 1px 2px rgba(0,0,0,0.4)' : '0 1px 2px rgba(255,255,255,0.4)')
+            .text(`${(root.value || 0).toLocaleString()} ${unit}`);
+        g.selectAll('text.segment-label')
             .data(nodes.filter(d => d.depth > 0 && d.value && d.value > 0 && shouldDisplayLabel(d)))
             .enter().append('text')
+            .attr('class', 'segment-label')
             .attr('transform', d => {
             const angle = (d.x0 + d.x1) / 2;
             const radius = (Math.sqrt(d.y0) + Math.sqrt(d.y1)) / 2;
@@ -2323,11 +2384,32 @@ const SunburstChart = ({ data, width = 500, height = 500, title = 'Sunburst Char
         })
             .attr('text-anchor', 'middle')
             .attr('alignment-baseline', 'middle')
-            .attr('font-size', '12px')
-            .attr('fill', 'var(--text-inverse)')
-            .attr('font-weight', 'var(--font-medium)')
+            .attr('font-size', d => d.depth === 1 ? '13px' : '11px')
+            .attr('fill', d => {
+            let ancestor = d;
+            while (ancestor.depth > 1 && ancestor.parent) {
+                ancestor = ancestor.parent;
+            }
+            const segmentColor = getColor(ancestor.data.name, d.depth);
+            return getTextColor$1(segmentColor);
+        })
+            .attr('font-weight', '600')
             .style('pointer-events', 'none')
-            .text(d => d.data.name.substring(0, 10));
+            .style('text-shadow', d => {
+            let ancestor = d;
+            while (ancestor.depth > 1 && ancestor.parent) {
+                ancestor = ancestor.parent;
+            }
+            const segmentColor = getColor(ancestor.data.name, d.depth);
+            const textColor = getTextColor$1(segmentColor);
+            // Use contrasting shadow color
+            const shadowColor = textColor === '#ffffff' ? 'rgba(0,0,0,0.5)' : 'rgba(255,255,255,0.5)';
+            return `0 1px 2px ${shadowColor}`;
+        })
+            .text(d => {
+            const maxLength = d.depth === 1 ? 12 : 8;
+            return d.data.name.substring(0, maxLength);
+        });
         return () => {
             tooltip.remove();
         };
@@ -2338,12 +2420,23 @@ const SunburstChart = ({ data, width = 500, height = 500, title = 'Sunburst Char
 var styles = {"container":"PieChart-module_container__tXjbe","title":"PieChart-module_title__61o0R","chartContainer":"PieChart-module_chartContainer__uLmOz","chart":"PieChart-module_chart__3nqON","legend":"PieChart-module_legend__rAWgh","legendItem":"PieChart-module_legendItem__Nb031","legendColor":"PieChart-module_legendColor__fLuv9","legendLabel":"PieChart-module_legendLabel__xbjBr","legendValue":"PieChart-module_legendValue__h2WS2","tooltip":"PieChart-module_tooltip__140RU"};
 
 const DEFAULT_COLORS = [
-    '#d4af37', '#FFD700', '#FFA500', '#FF8C00',
-    '#FF6347', '#DC143C', '#8B4513', '#A0522D',
-    '#DEB887', '#F4A460', '#D2691E', '#CD853F',
-    '#B8860B', '#DAA520', '#F0E68C', '#BDB76B'
+    '#6366f1', '#8b5cf6', '#06b6d4', '#10b981',
+    '#f59e0b', '#ef4444', '#ec4899', '#84cc16',
+    '#f97316', '#3b82f6', '#8b5cf6', '#14b8a6',
+    '#f59e0b', '#ef4444', '#06b6d4', '#10b981'
 ];
-const PieChart = ({ data, width = 400, height = 400, title = 'Distribution', showLegend = true }) => {
+// Calculate text color based on background luminance for optimal contrast
+const getTextColor = (backgroundColor) => {
+    const color = d3.color(backgroundColor);
+    if (!color)
+        return '#ffffff';
+    const rgb = color.rgb();
+    // Calculate relative luminance using WCAG formula
+    const luminance = (0.299 * rgb.r + 0.587 * rgb.g + 0.114 * rgb.b) / 255;
+    // Return white text for dark backgrounds, black for light backgrounds
+    return luminance > 0.5 ? '#000000' : '#ffffff';
+};
+const PieChart = ({ data, width = 400, height = 400, title = 'Distribution', showLegend = true, unit = 'items', centerLabel }) => {
     const svgRef = useRef(null);
     const radius = Math.min(width, height) / 2 - 20;
     useEffect(() => {
@@ -2357,8 +2450,9 @@ const PieChart = ({ data, width = 400, height = 400, title = 'Distribution', sho
             .value(d => d.value)
             .sort(null);
         const arc = d3.arc()
-            .innerRadius(0)
-            .outerRadius(radius);
+            .innerRadius(radius * 0.4)
+            .outerRadius(radius)
+            .cornerRadius(4);
         const labelArc = d3.arc()
             .innerRadius(radius * 0.7)
             .outerRadius(radius * 0.7);
@@ -2376,13 +2470,19 @@ const PieChart = ({ data, width = 400, height = 400, title = 'Distribution', sho
             .attr('d', d => arc(d))
             .attr('fill', (d, i) => d.data.color || DEFAULT_COLORS[i % DEFAULT_COLORS.length])
             .attr('stroke', 'var(--bg-primary)')
-            .attr('stroke-width', 2)
+            .attr('stroke-width', 3)
             .style('cursor', 'pointer')
+            .style('filter', 'drop-shadow(0 2px 8px rgba(0,0,0,0.15))')
             .on('mouseover', function (event, d) {
+            const hoverArc = d3.arc()
+                .innerRadius(radius * 0.4)
+                .outerRadius(radius * 1.05)
+                .cornerRadius(4);
             d3.select(this)
                 .transition()
                 .duration(200)
-                .style('opacity', 0.8);
+                .attr('d', d => hoverArc(d))
+                .style('filter', 'drop-shadow(0 4px 12px rgba(0,0,0,0.25))');
             tooltip.transition()
                 .duration(200)
                 .style('opacity', 1);
@@ -2395,27 +2495,59 @@ const PieChart = ({ data, width = 400, height = 400, title = 'Distribution', sho
                 .style('left', (event.pageX + 10) + 'px')
                 .style('top', (event.pageY - 28) + 'px');
         })
-            .on('mouseout', function () {
+            .on('mouseout', function (event, d) {
             d3.select(this)
                 .transition()
                 .duration(200)
-                .style('opacity', 1);
+                .attr('d', d => arc(d))
+                .style('filter', 'drop-shadow(0 2px 8px rgba(0,0,0,0.15))');
             tooltip.transition()
                 .duration(500)
                 .style('opacity', 0);
         });
-        arcs.filter(d => (d.endAngle - d.startAngle) > 0.3)
+        // Calculate average background color for center text contrast
+        const avgColor = data.length > 0 ? d3.interpolateRgb.gamma(2.2)(...data.map((d, i) => d.color || DEFAULT_COLORS[i % DEFAULT_COLORS.length]))(0.5) : '#ffffff';
+        const centerTextColor = getTextColor(avgColor);
+        // Add center text for donut
+        g.append('text')
+            .attr('text-anchor', 'middle')
+            .attr('alignment-baseline', 'middle')
+            .attr('font-size', '20px')
+            .attr('font-weight', 'bold')
+            .attr('fill', centerTextColor)
+            .style('text-shadow', centerTextColor === '#ffffff' ? '0 1px 3px rgba(0,0,0,0.5)' : '0 1px 3px rgba(255,255,255,0.5)')
+            .text(centerLabel || 'Total');
+        g.append('text')
+            .attr('text-anchor', 'middle')
+            .attr('alignment-baseline', 'middle')
+            .attr('y', 22)
+            .attr('font-size', '16px')
+            .attr('font-weight', '600')
+            .attr('fill', centerTextColor)
+            .style('text-shadow', centerTextColor === '#ffffff' ? '0 1px 2px rgba(0,0,0,0.4)' : '0 1px 2px rgba(255,255,255,0.4)')
+            .text(`${total.toLocaleString()} ${unit}`);
+        arcs.filter(d => (d.endAngle - d.startAngle) > 0.2)
             .append('text')
             .attr('transform', d => `translate(${labelArc.centroid(d)})`)
             .attr('text-anchor', 'middle')
             .attr('alignment-baseline', 'middle')
-            .attr('font-size', '12px')
-            .attr('fill', 'var(--text-inverse)')
-            .attr('font-weight', 'var(--font-semibold)')
+            .attr('font-size', '13px')
+            .attr('fill', (d, i) => {
+            const segmentColor = d.data.color || DEFAULT_COLORS[i % DEFAULT_COLORS.length];
+            return getTextColor(segmentColor);
+        })
+            .attr('font-weight', '600')
             .style('pointer-events', 'none')
+            .style('text-shadow', (d, i) => {
+            const segmentColor = d.data.color || DEFAULT_COLORS[i % DEFAULT_COLORS.length];
+            const textColor = getTextColor(segmentColor);
+            // Use contrasting shadow color
+            const shadowColor = textColor === '#ffffff' ? 'rgba(0,0,0,0.4)' : 'rgba(255,255,255,0.4)';
+            return `0 1px 2px ${shadowColor}`;
+        })
             .text(d => {
             const percentage = ((d.data.value / total) * 100);
-            return percentage > 5 ? `${percentage.toFixed(1)}%` : '';
+            return percentage > 8 ? `${percentage.toFixed(0)}%` : '';
         });
         return () => {
             tooltip.remove();