hazo_config 1.2.0 → 1.3.1

package/.cursor/rules/general.mdc

@@ -48,4 +48,29 @@ alwaysApply: true
 - When error messages are shown to the user, they should always be logged verbatem in the serverside log file as well
 - pretty print the json output
 - don't import the logger in the client side code
-- whenever there's any actions on the database, or any API calls, please add details of the payload and update as well as the resulsts in the log file to help debug issues.  For API calls, don't save any base64 data as it is too large.
+- whenever there's any actions on the database, or any API calls, please add details of the payload and update as well as the resulsts in the log file to help debug issues.  For API calls, don't save any base64 data as it is too large.
+
+[For Packages ES Module Exports]
+- When creating npm packages that will be consumed by ES module bundlers (Next.js, Vite, etc.), ALL export statements MUST use explicit file paths with .js extensions
+- Directory imports like `export * from './components'` are INVALID in ES modules and will fail at runtime
+- ALWAYS use explicit paths: `export * from './components/index.js'` instead of `export * from './components'`
+- Even though source files are .ts, TypeScript requires .js extensions in import/export paths for ES module output
+- This applies to all export statements in index.ts files and any barrel export files
+
+[For packages: TypeScript Configuration]
+- For package builds (tsconfig.build.json), set moduleResolution to "node16" or "node" (not "bundler") when shipping compiled output
+- Ensure module is set to "ESNext" or "ES2020" for modern ES module output
+- Add "type": "module" to package.json if shipping pure ESM packages
+
+[For Packages: Export Path Rules]
+- ✅ CORRECT: `export * from './lib/index.js'`
+- ✅ CORRECT: `export * from './components/index.js'`
+- ✅ CORRECT: `export { Something } from './utils.js'`
+- ❌ WRONG: `export * from './lib'`
+- ❌ WRONG: `export * from './components'`
+- ❌ WRONG: `export { Something } from './utils'` (without extension)
+
+[Verification]
+- After building, check dist/index.js and ensure all export paths have .js extensions
+- Test the built package in a consuming Next.js or ES module project to verify imports work
+- If using TypeScript path aliases (@/...), ensure they are resolved to relative paths in the compiled output (not left as aliases)

package/.cursor/rules/package_development.mdc

@@ -0,0 +1,34 @@
+---
+description: Rules for package/library development to ensure ES module compatibility
+globs: 
+  - "src/**/*.ts"
+  - "src/**/*.tsx"
+  - "tsconfig*.json"
+  - "package.json"
+alwaysApply: true
+---
+
+[Package Development - ES Module Exports]
+- When creating npm packages that will be consumed by ES module bundlers (Next.js, Vite, etc.), ALL export statements MUST use explicit file paths with .js extensions
+- Directory imports like `export * from './components'` are INVALID in ES modules and will fail at runtime
+- ALWAYS use explicit paths: `export * from './components/index.js'` instead of `export * from './components'`
+- Even though source files are .ts, TypeScript requires .js extensions in import/export paths for ES module output
+- This applies to all export statements in index.ts files and any barrel export files
+
+[TypeScript Configuration for Packages]
+- For package builds (tsconfig.build.json), set moduleResolution to "node16" or "node" (not "bundler") when shipping compiled output
+- Ensure module is set to "ESNext" or "ES2020" for modern ES module output
+- Add "type": "module" to package.json if shipping pure ESM packages
+
+[Export Path Rules]
+- ✅ CORRECT: `export * from './lib/index.js'`
+- ✅ CORRECT: `export * from './components/index.js'`
+- ✅ CORRECT: `export { Something } from './utils.js'`
+- ❌ WRONG: `export * from './lib'`
+- ❌ WRONG: `export * from './components'`
+- ❌ WRONG: `export { Something } from './utils'` (without extension)
+
+[Verification]
+- After building, check dist/index.js and ensure all export paths have .js extensions
+- Test the built package in a consuming Next.js or ES module project to verify imports work
+- If using TypeScript path aliases (@/...), ensure they are resolved to relative paths in the compiled output (not left as aliases)

package/dist/components/config_editor.d.ts

@@ -1,5 +1,5 @@
 import React from 'react';
-import type { ConfigProvider } from '@/lib/types';
+import type { ConfigProvider } from '../lib/types';
 /**
  * Config editor component props
  */

package/dist/components/config_editor.d.ts.map

@@ -1 +1 @@
-{"version":3,"file":"config_editor.d.ts","sourceRoot":"","sources":["../../src/components/config_editor.tsx"],"names":[],"mappings":"AAGA,OAAO,KAA8B,MAAM,OAAO,CAAA;AAElD,OAAO,KAAK,EAAE,cAAc,EAAE,MAAM,aAAa,CAAA;AAGjD;;GAEG;AACH,MAAM,WAAW,iBAAiB;IAChC;;OAEG;IACH,eAAe,EAAE,cAAc,CAAA;IAC/B;;OAEG;IACH,SAAS,CAAC,EAAE,MAAM,CAAA;IAClB;;OAEG;IACH,SAAS,CAAC,EAAE,MAAM,IAAI,CAAA;CACvB;AAED;;;;;GAKG;AACH,eAAO,MAAM,YAAY,EAAE,KAAK,CAAC,EAAE,CAAC,iBAAiB,CAmLpD,CAAA"}
+{"version":3,"file":"config_editor.d.ts","sourceRoot":"","sources":["../../src/components/config_editor.tsx"],"names":[],"mappings":"AAGA,OAAO,KAA8B,MAAM,OAAO,CAAA;AAElD,OAAO,KAAK,EAAE,cAAc,EAAE,MAAM,cAAc,CAAA;AAGlD;;GAEG;AACH,MAAM,WAAW,iBAAiB;IAChC;;OAEG;IACH,eAAe,EAAE,cAAc,CAAA;IAC/B;;OAEG;IACH,SAAS,CAAC,EAAE,MAAM,CAAA;IAClB;;OAEG;IACH,SAAS,CAAC,EAAE,MAAM,IAAI,CAAA;CACvB;AAED;;;;;GAKG;AACH,eAAO,MAAM,YAAY,EAAE,KAAK,CAAC,EAAE,CAAC,iBAAiB,CAmLpD,CAAA"}

package/dist/components/config_editor.js

@@ -1,20 +1,23 @@
-import { jsx as _jsx, jsxs as _jsxs, Fragment as _Fragment } from "react/jsx-runtime";
+"use strict";
+Object.defineProperty(exports, "__esModule", { value: true });
+exports.ConfigEditor = void 0;
+const jsx_runtime_1 = require("react/jsx-runtime");
 // Config editor component for managing configuration
 // Provides a more advanced interface for editing configuration values
-import { useState, useEffect } from 'react';
-import { cn } from '@/lib/utils';
-import { RefreshCw, Save } from 'lucide-react';
+const react_1 = require("react");
+const utils_1 = require("../lib/utils");
+const lucide_react_1 = require("lucide-react");
 /**
  * Config editor component
  * Provides interface for viewing and editing configuration with refresh and save capabilities
  * @param props - Component props
  * @returns React component
  */
-export const ConfigEditor = ({ config_provider, className, on_update, }) => {
-    const [sections, set_sections] = useState({});
-    const [selected_section, set_selected_section] = useState(null);
-    const [new_key, set_new_key] = useState('');
-    const [new_value, set_new_value] = useState('');
+const ConfigEditor = ({ config_provider, className, on_update, }) => {
+    const [sections, set_sections] = (0, react_1.useState)({});
+    const [selected_section, set_selected_section] = (0, react_1.useState)(null);
+    const [new_key, set_new_key] = (0, react_1.useState)('');
+    const [new_value, set_new_value] = (0, react_1.useState)('');
     /**
      * Load configuration from provider
      */
@@ -29,7 +32,7 @@ export const ConfigEditor = ({ config_provider, className, on_update, }) => {
             set_selected_section(Object.keys(all_sections)[0]);
         }
     };
-    useEffect(() => {
+    (0, react_1.useEffect)(() => {
         load_config();
     }, [config_provider]);
     /**
@@ -74,8 +77,9 @@ export const ConfigEditor = ({ config_provider, className, on_update, }) => {
         load_config();
     };
     const current_section_data = selected_section ? sections[selected_section] : null;
-    return (_jsxs("div", { className: cn('cls_config_editor space-y-4', className), children: [_jsxs("div", { className: "cls_config_editor_header flex items-center justify-between border-b pb-2", children: [_jsx("h2", { className: "text-xl font-semibold", children: "Configuration Editor" }), _jsxs("div", { className: "flex gap-2", children: [_jsxs("button", { onClick: handle_refresh, className: "px-3 py-1 border rounded hover:bg-muted flex items-center gap-2", "aria-label": "Refresh", children: [_jsx(RefreshCw, { size: 16 }), "Refresh"] }), _jsxs("button", { onClick: handle_save, className: "px-3 py-1 bg-primary text-primary-foreground rounded hover:bg-primary/90 flex items-center gap-2", "aria-label": "Save", children: [_jsx(Save, { size: 16 }), "Save"] })] })] }), _jsxs("div", { className: "cls_config_editor_content grid grid-cols-1 md:grid-cols-3 gap-4", children: [_jsxs("div", { className: "cls_config_sections_list border rounded p-4", children: [_jsx("h3", { className: "font-semibold mb-2", children: "Sections" }), _jsx("div", { className: "space-y-1", children: Object.keys(sections).map((section_name) => (_jsx("button", { onClick: () => set_selected_section(section_name), className: cn('w-full text-left px-2 py-1 rounded text-sm', selected_section === section_name
+    return ((0, jsx_runtime_1.jsxs)("div", { className: (0, utils_1.cn)('cls_config_editor space-y-4', className), children: [(0, jsx_runtime_1.jsxs)("div", { className: "cls_config_editor_header flex items-center justify-between border-b pb-2", children: [(0, jsx_runtime_1.jsx)("h2", { className: "text-xl font-semibold", children: "Configuration Editor" }), (0, jsx_runtime_1.jsxs)("div", { className: "flex gap-2", children: [(0, jsx_runtime_1.jsxs)("button", { onClick: handle_refresh, className: "px-3 py-1 border rounded hover:bg-muted flex items-center gap-2", "aria-label": "Refresh", children: [(0, jsx_runtime_1.jsx)(lucide_react_1.RefreshCw, { size: 16 }), "Refresh"] }), (0, jsx_runtime_1.jsxs)("button", { onClick: handle_save, className: "px-3 py-1 bg-primary text-primary-foreground rounded hover:bg-primary/90 flex items-center gap-2", "aria-label": "Save", children: [(0, jsx_runtime_1.jsx)(lucide_react_1.Save, { size: 16 }), "Save"] })] })] }), (0, jsx_runtime_1.jsxs)("div", { className: "cls_config_editor_content grid grid-cols-1 md:grid-cols-3 gap-4", children: [(0, jsx_runtime_1.jsxs)("div", { className: "cls_config_sections_list border rounded p-4", children: [(0, jsx_runtime_1.jsx)("h3", { className: "font-semibold mb-2", children: "Sections" }), (0, jsx_runtime_1.jsx)("div", { className: "space-y-1", children: Object.keys(sections).map((section_name) => ((0, jsx_runtime_1.jsx)("button", { onClick: () => set_selected_section(section_name), className: (0, utils_1.cn)('w-full text-left px-2 py-1 rounded text-sm', selected_section === section_name
                                         ? 'bg-primary text-primary-foreground'
-                                        : 'hover:bg-muted'), children: section_name }, section_name))) })] }), _jsx("div", { className: "cls_config_section_content md:col-span-2 border rounded p-4", children: selected_section ? (_jsxs(_Fragment, { children: [_jsx("h3", { className: "font-semibold mb-4", children: selected_section }), _jsxs("div", { className: "space-y-3", children: [current_section_data &&
-                                            Object.entries(current_section_data).map(([key, value]) => (_jsxs("div", { className: "cls_config_item", children: [_jsx("label", { className: "block text-sm font-medium mb-1", children: key }), _jsx("input", { type: "text", value: value, onChange: (e) => handle_update_value(selected_section, key, e.target.value), className: "w-full px-2 py-1 border rounded" })] }, key))), _jsxs("div", { className: "cls_add_new_key border-t pt-3 mt-3", children: [_jsx("h4", { className: "text-sm font-medium mb-2", children: "Add New Key" }), _jsxs("div", { className: "space-y-2", children: [_jsx("input", { type: "text", placeholder: "Key name", value: new_key, onChange: (e) => set_new_key(e.target.value), className: "w-full px-2 py-1 border rounded text-sm" }), _jsx("input", { type: "text", placeholder: "Value", value: new_value, onChange: (e) => set_new_value(e.target.value), className: "w-full px-2 py-1 border rounded text-sm" }), _jsx("button", { onClick: handle_add_key, className: "px-3 py-1 bg-primary text-primary-foreground rounded hover:bg-primary/90 text-sm", children: "Add Key" })] })] })] })] })) : (_jsx("div", { className: "text-center text-muted-foreground py-8", children: "Select a section to view/edit" })) })] })] }));
+                                        : 'hover:bg-muted'), children: section_name }, section_name))) })] }), (0, jsx_runtime_1.jsx)("div", { className: "cls_config_section_content md:col-span-2 border rounded p-4", children: selected_section ? ((0, jsx_runtime_1.jsxs)(jsx_runtime_1.Fragment, { children: [(0, jsx_runtime_1.jsx)("h3", { className: "font-semibold mb-4", children: selected_section }), (0, jsx_runtime_1.jsxs)("div", { className: "space-y-3", children: [current_section_data &&
+                                            Object.entries(current_section_data).map(([key, value]) => ((0, jsx_runtime_1.jsxs)("div", { className: "cls_config_item", children: [(0, jsx_runtime_1.jsx)("label", { className: "block text-sm font-medium mb-1", children: key }), (0, jsx_runtime_1.jsx)("input", { type: "text", value: value, onChange: (e) => handle_update_value(selected_section, key, e.target.value), className: "w-full px-2 py-1 border rounded" })] }, key))), (0, jsx_runtime_1.jsxs)("div", { className: "cls_add_new_key border-t pt-3 mt-3", children: [(0, jsx_runtime_1.jsx)("h4", { className: "text-sm font-medium mb-2", children: "Add New Key" }), (0, jsx_runtime_1.jsxs)("div", { className: "space-y-2", children: [(0, jsx_runtime_1.jsx)("input", { type: "text", placeholder: "Key name", value: new_key, onChange: (e) => set_new_key(e.target.value), className: "w-full px-2 py-1 border rounded text-sm" }), (0, jsx_runtime_1.jsx)("input", { type: "text", placeholder: "Value", value: new_value, onChange: (e) => set_new_value(e.target.value), className: "w-full px-2 py-1 border rounded text-sm" }), (0, jsx_runtime_1.jsx)("button", { onClick: handle_add_key, className: "px-3 py-1 bg-primary text-primary-foreground rounded hover:bg-primary/90 text-sm", children: "Add Key" })] })] })] })] })) : ((0, jsx_runtime_1.jsx)("div", { className: "text-center text-muted-foreground py-8", children: "Select a section to view/edit" })) })] })] }));
 };
+exports.ConfigEditor = ConfigEditor;

package/dist/components/config_viewer.d.ts

@@ -1,5 +1,5 @@
 import React from 'react';
-import type { ConfigProvider } from '@/lib/types';
+import type { ConfigProvider } from '../lib/types';
 /**
  * Config viewer component props
  */

package/dist/components/config_viewer.d.ts.map

@@ -1 +1 @@
-{"version":3,"file":"config_viewer.d.ts","sourceRoot":"","sources":["../../src/components/config_viewer.tsx"],"names":[],"mappings":"AAGA,OAAO,KAA8B,MAAM,OAAO,CAAA;AAElD,OAAO,KAAK,EAAE,cAAc,EAAE,MAAM,aAAa,CAAA;AAGjD;;GAEG;AACH,MAAM,WAAW,iBAAiB;IAChC;;OAEG;IACH,eAAe,EAAE,cAAc,CAAA;IAC/B;;OAEG;IACH,SAAS,CAAC,EAAE,MAAM,CAAA;IAClB;;OAEG;IACH,SAAS,CAAC,EAAE,MAAM,IAAI,CAAA;CACvB;AAED;;;;;GAKG;AACH,eAAO,MAAM,YAAY,EAAE,KAAK,CAAC,EAAE,CAAC,iBAAiB,CAwIpD,CAAA"}
+{"version":3,"file":"config_viewer.d.ts","sourceRoot":"","sources":["../../src/components/config_viewer.tsx"],"names":[],"mappings":"AAGA,OAAO,KAA8B,MAAM,OAAO,CAAA;AAElD,OAAO,KAAK,EAAE,cAAc,EAAE,MAAM,cAAc,CAAA;AAGlD;;GAEG;AACH,MAAM,WAAW,iBAAiB;IAChC;;OAEG;IACH,eAAe,EAAE,cAAc,CAAA;IAC/B;;OAEG;IACH,SAAS,CAAC,EAAE,MAAM,CAAA;IAClB;;OAEG;IACH,SAAS,CAAC,EAAE,MAAM,IAAI,CAAA;CACvB;AAED;;;;;GAKG;AACH,eAAO,MAAM,YAAY,EAAE,KAAK,CAAC,EAAE,CAAC,iBAAiB,CAwIpD,CAAA"}

package/dist/components/config_viewer.js

@@ -1,19 +1,22 @@
-import { jsx as _jsx, jsxs as _jsxs } from "react/jsx-runtime";
+"use strict";
+Object.defineProperty(exports, "__esModule", { value: true });
+exports.ConfigViewer = void 0;
+const jsx_runtime_1 = require("react/jsx-runtime");
 // Config viewer component for displaying configuration data
 // Displays configuration sections and values in a readable format
-import { useState, useEffect } from 'react';
-import { cn } from '@/lib/utils';
-import { Pencil, CheckCircle2, XCircle } from 'lucide-react';
+const react_1 = require("react");
+const utils_1 = require("../lib/utils");
+const lucide_react_1 = require("lucide-react");
 /**
  * Config viewer component
  * Displays configuration sections and allows viewing/editing values
  * @param props - Component props
  * @returns React component
  */
-export const ConfigViewer = ({ config_provider, className, on_update, }) => {
-    const [sections, set_sections] = useState({});
-    const [editing, set_editing] = useState(null);
-    const [edit_value, set_edit_value] = useState('');
+const ConfigViewer = ({ config_provider, className, on_update, }) => {
+    const [sections, set_sections] = (0, react_1.useState)({});
+    const [editing, set_editing] = (0, react_1.useState)(null);
+    const [edit_value, set_edit_value] = (0, react_1.useState)('');
     /**
      * Load configuration from provider
      */
@@ -36,7 +39,7 @@ export const ConfigViewer = ({ config_provider, className, on_update, }) => {
         }
         set_sections(all_sections);
     };
-    useEffect(() => {
+    (0, react_1.useEffect)(() => {
         load_config();
     }, [config_provider]);
     /**
@@ -69,8 +72,9 @@ export const ConfigViewer = ({ config_provider, className, on_update, }) => {
             }
         }
     };
-    return (_jsx("div", { className: cn('cls_config_viewer space-y-4', className), children: Object.keys(sections).length === 0 ? (_jsx("div", { className: "p-4 text-center text-muted-foreground", children: "No configuration sections found" })) : (Object.entries(sections).map(([section_name, section_data]) => (_jsxs("div", { className: "cls_config_section border rounded-lg p-4", children: [_jsx("h3", { className: "text-lg font-semibold mb-3", children: section_name }), _jsx("div", { className: "space-y-2", children: Object.entries(section_data).map(([key, value]) => {
+    return ((0, jsx_runtime_1.jsx)("div", { className: (0, utils_1.cn)('cls_config_viewer space-y-4', className), children: Object.keys(sections).length === 0 ? ((0, jsx_runtime_1.jsx)("div", { className: "p-4 text-center text-muted-foreground", children: "No configuration sections found" })) : (Object.entries(sections).map(([section_name, section_data]) => ((0, jsx_runtime_1.jsxs)("div", { className: "cls_config_section border rounded-lg p-4", children: [(0, jsx_runtime_1.jsx)("h3", { className: "text-lg font-semibold mb-3", children: section_name }), (0, jsx_runtime_1.jsx)("div", { className: "space-y-2", children: Object.entries(section_data).map(([key, value]) => {
                         const is_editing = editing?.section === section_name && editing?.key === key;
-                        return (_jsx("div", { className: "cls_config_item flex items-center gap-2", children: _jsxs("div", { className: "flex-1", children: [_jsx("div", { className: "text-sm font-medium text-muted-foreground", children: key }), is_editing ? (_jsxs("div", { className: "flex items-center gap-2 mt-1", children: [_jsx("input", { type: "text", value: edit_value, onChange: (e) => set_edit_value(e.target.value), className: "flex-1 px-2 py-1 border rounded text-sm", autoFocus: true }), _jsx("button", { onClick: save_edit, className: "text-green-600 hover:text-green-700", "aria-label": "Save", children: _jsx(CheckCircle2, { size: 20 }) }), _jsx("button", { onClick: cancel_edit, className: "text-red-600 hover:text-red-700", "aria-label": "Cancel", children: _jsx(XCircle, { size: 20 }) })] })) : (_jsxs("div", { className: "flex items-center gap-2 mt-1", children: [_jsx("div", { className: "flex-1 px-2 py-1 bg-muted rounded text-sm", children: value || '(empty)' }), _jsx("button", { onClick: () => start_edit(section_name, key), className: "text-blue-600 hover:text-blue-700", "aria-label": "Edit", children: _jsx(Pencil, { size: 18 }) })] }))] }) }, key));
+                        return ((0, jsx_runtime_1.jsx)("div", { className: "cls_config_item flex items-center gap-2", children: (0, jsx_runtime_1.jsxs)("div", { className: "flex-1", children: [(0, jsx_runtime_1.jsx)("div", { className: "text-sm font-medium text-muted-foreground", children: key }), is_editing ? ((0, jsx_runtime_1.jsxs)("div", { className: "flex items-center gap-2 mt-1", children: [(0, jsx_runtime_1.jsx)("input", { type: "text", value: edit_value, onChange: (e) => set_edit_value(e.target.value), className: "flex-1 px-2 py-1 border rounded text-sm", autoFocus: true }), (0, jsx_runtime_1.jsx)("button", { onClick: save_edit, className: "text-green-600 hover:text-green-700", "aria-label": "Save", children: (0, jsx_runtime_1.jsx)(lucide_react_1.CheckCircle2, { size: 20 }) }), (0, jsx_runtime_1.jsx)("button", { onClick: cancel_edit, className: "text-red-600 hover:text-red-700", "aria-label": "Cancel", children: (0, jsx_runtime_1.jsx)(lucide_react_1.XCircle, { size: 20 }) })] })) : ((0, jsx_runtime_1.jsxs)("div", { className: "flex items-center gap-2 mt-1", children: [(0, jsx_runtime_1.jsx)("div", { className: "flex-1 px-2 py-1 bg-muted rounded text-sm", children: value || '(empty)' }), (0, jsx_runtime_1.jsx)("button", { onClick: () => start_edit(section_name, key), className: "text-blue-600 hover:text-blue-700", "aria-label": "Edit", children: (0, jsx_runtime_1.jsx)(lucide_react_1.Pencil, { size: 18 }) })] }))] }) }, key));
                     }) })] }, section_name)))) }));
 };
+exports.ConfigViewer = ConfigViewer;

package/dist/components/example_component.js

@@ -1,10 +1,14 @@
-import { jsx as _jsx, jsxs as _jsxs } from "react/jsx-runtime";
-import { cn } from '@/lib/utils';
+"use strict";
+Object.defineProperty(exports, "__esModule", { value: true });
+exports.ExampleComponent = void 0;
+const jsx_runtime_1 = require("react/jsx-runtime");
+const utils_1 = require("../lib/utils");
 /**
  * Example component for demonstrating the component library setup
  * @param props - Component props
  * @returns React component
  */
-export const ExampleComponent = ({ title = 'Example Component', className, }) => {
-    return (_jsxs("div", { className: cn('cls_example_component p-4 border rounded-lg', className), children: [_jsx("h2", { className: "text-xl font-semibold", children: title }), _jsx("p", { className: "text-muted-foreground mt-2", children: "This is an example component for the config management library." })] }));
+const ExampleComponent = ({ title = 'Example Component', className, }) => {
+    return ((0, jsx_runtime_1.jsxs)("div", { className: (0, utils_1.cn)('cls_example_component p-4 border rounded-lg', className), children: [(0, jsx_runtime_1.jsx)("h2", { className: "text-xl font-semibold", children: title }), (0, jsx_runtime_1.jsx)("p", { className: "text-muted-foreground mt-2", children: "This is an example component for the config management library." })] }));
 };
+exports.ExampleComponent = ExampleComponent;

package/dist/components/index.d.ts

@@ -1,6 +1,6 @@
-export { ExampleComponent } from './example_component';
-export { ConfigViewer } from './config_viewer';
-export { ConfigEditor } from './config_editor';
-export type { ConfigViewerProps } from './config_viewer';
-export type { ConfigEditorProps } from './config_editor';
+export { ExampleComponent } from './example_component.js';
+export { ConfigViewer } from './config_viewer.js';
+export { ConfigEditor } from './config_editor.js';
+export type { ConfigViewerProps } from './config_viewer.js';
+export type { ConfigEditorProps } from './config_editor.js';
 //# sourceMappingURL=index.d.ts.map

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

@@ -1 +1 @@
-{"version":3,"file":"index.d.ts","sourceRoot":"","sources":["../../src/components/index.ts"],"names":[],"mappings":"AAGA,OAAO,EAAE,gBAAgB,EAAE,MAAM,qBAAqB,CAAA;AACtD,OAAO,EAAE,YAAY,EAAE,MAAM,iBAAiB,CAAA;AAC9C,OAAO,EAAE,YAAY,EAAE,MAAM,iBAAiB,CAAA;AAC9C,YAAY,EAAE,iBAAiB,EAAE,MAAM,iBAAiB,CAAA;AACxD,YAAY,EAAE,iBAAiB,EAAE,MAAM,iBAAiB,CAAA"}
+{"version":3,"file":"index.d.ts","sourceRoot":"","sources":["../../src/components/index.ts"],"names":[],"mappings":"AAGA,OAAO,EAAE,gBAAgB,EAAE,MAAM,wBAAwB,CAAA;AACzD,OAAO,EAAE,YAAY,EAAE,MAAM,oBAAoB,CAAA;AACjD,OAAO,EAAE,YAAY,EAAE,MAAM,oBAAoB,CAAA;AACjD,YAAY,EAAE,iBAAiB,EAAE,MAAM,oBAAoB,CAAA;AAC3D,YAAY,EAAE,iBAAiB,EAAE,MAAM,oBAAoB,CAAA"}

package/dist/components/index.js

@@ -1,5 +1,11 @@
+"use strict";
 // Component exports
 // Export all components from this file for easy importing
-export { ExampleComponent } from './example_component';
-export { ConfigViewer } from './config_viewer';
-export { ConfigEditor } from './config_editor';
+Object.defineProperty(exports, "__esModule", { value: true });
+exports.ConfigEditor = exports.ConfigViewer = exports.ExampleComponent = void 0;
+var example_component_js_1 = require("./example_component.js");
+Object.defineProperty(exports, "ExampleComponent", { enumerable: true, get: function () { return example_component_js_1.ExampleComponent; } });
+var config_viewer_js_1 = require("./config_viewer.js");
+Object.defineProperty(exports, "ConfigViewer", { enumerable: true, get: function () { return config_viewer_js_1.ConfigViewer; } });
+var config_editor_js_1 = require("./config_editor.js");
+Object.defineProperty(exports, "ConfigEditor", { enumerable: true, get: function () { return config_editor_js_1.ConfigEditor; } });

package/dist/index.d.ts

@@ -1,4 +1,4 @@
-export * from './components';
-export * from './lib/utils';
-export * from './lib';
+export * from './components/index.js';
+export * from './lib/utils.js';
+export * from './lib/index.js';
 //# sourceMappingURL=index.d.ts.map

package/dist/index.d.ts.map

@@ -1 +1 @@
-{"version":3,"file":"index.d.ts","sourceRoot":"","sources":["../src/index.ts"],"names":[],"mappings":"AAGA,cAAc,cAAc,CAAA;AAC5B,cAAc,aAAa,CAAA;AAC3B,cAAc,OAAO,CAAA"}
+{"version":3,"file":"index.d.ts","sourceRoot":"","sources":["../src/index.ts"],"names":[],"mappings":"AAGA,cAAc,uBAAuB,CAAA;AACrC,cAAc,gBAAgB,CAAA;AAC9B,cAAc,gBAAgB,CAAA"}

package/dist/index.js

@@ -1,5 +1,21 @@
+"use strict";
 // Main entry point for the component library
 // Export all components and utilities from this file
-export * from './components';
-export * from './lib/utils';
-export * from './lib';
+var __createBinding = (this && this.__createBinding) || (Object.create ? (function(o, m, k, k2) {
+    if (k2 === undefined) k2 = k;
+    var desc = Object.getOwnPropertyDescriptor(m, k);
+    if (!desc || ("get" in desc ? !m.__esModule : desc.writable || desc.configurable)) {
+      desc = { enumerable: true, get: function() { return m[k]; } };
+    }
+    Object.defineProperty(o, k2, desc);
+}) : (function(o, m, k, k2) {
+    if (k2 === undefined) k2 = k;
+    o[k2] = m[k];
+}));
+var __exportStar = (this && this.__exportStar) || function(m, exports) {
+    for (var p in m) if (p !== "default" && !Object.prototype.hasOwnProperty.call(exports, p)) __createBinding(exports, m, p);
+};
+Object.defineProperty(exports, "__esModule", { value: true });
+__exportStar(require("./components/index.js"), exports);
+__exportStar(require("./lib/utils.js"), exports);
+__exportStar(require("./lib/index.js"), exports);

package/dist/lib/config-loader.js

@@ -1,3 +1,4 @@
+"use strict";
 /**
  * Purpose: Main implementation of HazoConfig
  *
@@ -6,10 +7,15 @@
  * in-memory caching, sync operations, and preservation of file formatting.
  * Zero dependencies - only Node.js built-ins and the 'ini' package.
  */
-import fs from 'fs';
-import path from 'path';
-import ini from 'ini';
-import { ConfigErrorCode as EC } from './types';
+var __importDefault = (this && this.__importDefault) || function (mod) {
+    return (mod && mod.__esModule) ? mod : { "default": mod };
+};
+Object.defineProperty(exports, "__esModule", { value: true });
+exports.HazoConfig = void 0;
+const fs_1 = __importDefault(require("fs"));
+const path_1 = __importDefault(require("path"));
+const ini_1 = __importDefault(require("ini"));
+const types_1 = require("./types");
 /**
  * No-op logger implementation (default when no logger provided)
  */
@@ -25,7 +31,7 @@ const no_op_logger = {
  * Implements ConfigProvider interface for managing INI configuration files.
  * Provides sync read/write operations with in-memory caching.
  */
-export class HazoConfig {
+class HazoConfig {
     /**
      * Constructor
      * @param options - Configuration options including filePath and optional logger
@@ -50,12 +56,12 @@ export class HazoConfig {
             writable: true,
             value: {}
         });
-        this.filePath = path.resolve(options.filePath);
+        this.filePath = path_1.default.resolve(options.filePath);
         this.logger = options.logger || no_op_logger;
         // Validate file exists
-        if (!fs.existsSync(this.filePath)) {
+        if (!fs_1.default.existsSync(this.filePath)) {
             const error = new Error(`Configuration file not found: ${this.filePath}`);
-            error.code = EC.FILE_NOT_FOUND;
+            error.code = types_1.ConfigErrorCode.FILE_NOT_FOUND;
             this.logger.error(`[HazoConfig] Configuration file not found: ${this.filePath}`);
             throw error;
         }
@@ -99,17 +105,17 @@ export class HazoConfig {
     save() {
         try {
             // Convert config object back to INI format
-            const iniContent = ini.stringify(this.config, {
+            const iniContent = ini_1.default.stringify(this.config, {
                 section: '[',
                 whitespace: true
             });
             // Write to file
-            fs.writeFileSync(this.filePath, iniContent, 'utf-8');
+            fs_1.default.writeFileSync(this.filePath, iniContent, 'utf-8');
             this.logger.info(`[HazoConfig] Configuration saved to: ${this.filePath}`);
         }
         catch (error) {
             const configError = new Error(`Failed to save configuration: ${error.message || String(error)}`);
-            configError.code = EC.WRITE_ERROR;
+            configError.code = types_1.ConfigErrorCode.WRITE_ERROR;
             configError.originalError = error;
             this.logger.error(`[HazoConfig] Failed to save configuration: ${this.filePath}`, { error: String(error) });
             throw configError;
@@ -122,9 +128,9 @@ export class HazoConfig {
     refresh() {
         try {
             // Read file content
-            const content = fs.readFileSync(this.filePath, 'utf-8');
+            const content = fs_1.default.readFileSync(this.filePath, 'utf-8');
             // Parse INI content
-            const parsed = ini.parse(content);
+            const parsed = ini_1.default.parse(content);
             // Convert to our internal format (ensure all values are strings)
             this.config = {};
             for (const [section, values] of Object.entries(parsed)) {
@@ -143,13 +149,13 @@ export class HazoConfig {
             // Handle file read errors
             if (error.code === 'ENOENT') {
                 const configError = new Error(`Configuration file not found: ${this.filePath}`);
-                configError.code = EC.FILE_NOT_FOUND;
+                configError.code = types_1.ConfigErrorCode.FILE_NOT_FOUND;
                 this.logger.error(`[HazoConfig] Configuration file not found: ${this.filePath}`);
                 throw configError;
             }
             // Handle parse errors
             const configError = new Error(`Failed to parse configuration: ${error.message || String(error)}`);
-            configError.code = EC.PARSE_ERROR;
+            configError.code = types_1.ConfigErrorCode.PARSE_ERROR;
             configError.originalError = error;
             this.logger.error(`[HazoConfig] Failed to parse configuration: ${this.filePath}`, { error: String(error) });
             throw configError;
@@ -175,3 +181,4 @@ export class HazoConfig {
         return result;
     }
 }
+exports.HazoConfig = HazoConfig;

package/dist/lib/index.d.ts

@@ -5,8 +5,8 @@
  * configuration management utility. It serves as the primary entry point
  * for consumers of the library.
  */
-export { HazoConfig } from './config-loader';
-export { MockConfigProvider } from './mock_config_provider';
-export { ConfigErrorCode } from './types';
-export type { ConfigProvider, HazoConfigOptions, Logger, HazoConfigError } from './types';
+export { HazoConfig } from './config-loader.js';
+export { MockConfigProvider } from './mock_config_provider.js';
+export { ConfigErrorCode } from './types.js';
+export type { ConfigProvider, HazoConfigOptions, Logger, HazoConfigError } from './types.js';
 //# sourceMappingURL=index.d.ts.map

package/dist/lib/index.d.ts.map

@@ -1 +1 @@
-{"version":3,"file":"index.d.ts","sourceRoot":"","sources":["../../src/lib/index.ts"],"names":[],"mappings":"AAAA;;;;;;GAMG;AAEH,OAAO,EAAE,UAAU,EAAE,MAAM,iBAAiB,CAAA;AAC5C,OAAO,EAAE,kBAAkB,EAAE,MAAM,wBAAwB,CAAA;AAC3D,OAAO,EAAE,eAAe,EAAE,MAAM,SAAS,CAAA;AACzC,YAAY,EACV,cAAc,EACd,iBAAiB,EACjB,MAAM,EACN,eAAe,EAChB,MAAM,SAAS,CAAA"}
+{"version":3,"file":"index.d.ts","sourceRoot":"","sources":["../../src/lib/index.ts"],"names":[],"mappings":"AAAA;;;;;;GAMG;AAEH,OAAO,EAAE,UAAU,EAAE,MAAM,oBAAoB,CAAA;AAC/C,OAAO,EAAE,kBAAkB,EAAE,MAAM,2BAA2B,CAAA;AAC9D,OAAO,EAAE,eAAe,EAAE,MAAM,YAAY,CAAA;AAC5C,YAAY,EACV,cAAc,EACd,iBAAiB,EACjB,MAAM,EACN,eAAe,EAChB,MAAM,YAAY,CAAA"}

package/dist/lib/index.js

@@ -1,3 +1,4 @@
+"use strict";
 /**
  * Purpose: Main export for the HazoConfig library.
  *
@@ -5,6 +6,11 @@
  * configuration management utility. It serves as the primary entry point
  * for consumers of the library.
  */
-export { HazoConfig } from './config-loader';
-export { MockConfigProvider } from './mock_config_provider';
-export { ConfigErrorCode } from './types';
+Object.defineProperty(exports, "__esModule", { value: true });
+exports.ConfigErrorCode = exports.MockConfigProvider = exports.HazoConfig = void 0;
+var config_loader_js_1 = require("./config-loader.js");
+Object.defineProperty(exports, "HazoConfig", { enumerable: true, get: function () { return config_loader_js_1.HazoConfig; } });
+var mock_config_provider_js_1 = require("./mock_config_provider.js");
+Object.defineProperty(exports, "MockConfigProvider", { enumerable: true, get: function () { return mock_config_provider_js_1.MockConfigProvider; } });
+var types_js_1 = require("./types.js");
+Object.defineProperty(exports, "ConfigErrorCode", { enumerable: true, get: function () { return types_js_1.ConfigErrorCode; } });

package/dist/lib/mock_config_provider.js

@@ -1,10 +1,13 @@
+"use strict";
 // Mock config provider for browser/Storybook testing
 // Implements ConfigProvider interface using in-memory storage instead of file system
+Object.defineProperty(exports, "__esModule", { value: true });
+exports.MockConfigProvider = void 0;
 /**
  * Mock config provider that stores configuration in memory
  * Useful for testing and Storybook demonstrations where file system is not available
  */
-export class MockConfigProvider {
+class MockConfigProvider {
     /**
      * Constructor
      * @param initial_config - Optional initial configuration data
@@ -85,3 +88,4 @@ export class MockConfigProvider {
         }
     }
 }
+exports.MockConfigProvider = MockConfigProvider;

package/dist/lib/types.js

@@ -1,3 +1,4 @@
+"use strict";
 /**
  * Purpose: Core interfaces and types for the HazoConfig component.
  *
@@ -6,14 +7,16 @@
  * ConfigProvider pattern, configuration options, and error types, ensuring
  * loose coupling and reusability across different projects.
  */
+Object.defineProperty(exports, "__esModule", { value: true });
+exports.ConfigErrorCode = void 0;
 /**
  * Error codes for configuration operations
  */
-export var ConfigErrorCode;
+var ConfigErrorCode;
 (function (ConfigErrorCode) {
     ConfigErrorCode["FILE_NOT_FOUND"] = "HAZO_CONFIG_FILE_NOT_FOUND";
     ConfigErrorCode["READ_ERROR"] = "HAZO_CONFIG_READ_ERROR";
     ConfigErrorCode["WRITE_ERROR"] = "HAZO_CONFIG_WRITE_ERROR";
     ConfigErrorCode["PARSE_ERROR"] = "HAZO_CONFIG_PARSE_ERROR";
     ConfigErrorCode["VALIDATION_ERROR"] = "HAZO_CONFIG_VALIDATION_ERROR";
-})(ConfigErrorCode || (ConfigErrorCode = {}));
+})(ConfigErrorCode || (exports.ConfigErrorCode = ConfigErrorCode = {}));

package/dist/lib/utils.js

@@ -1,12 +1,15 @@
+"use strict";
 // Utility functions for the component library
 // Provides class name merging functionality using clsx and tailwind-merge
-import { clsx } from "clsx";
-import { twMerge } from "tailwind-merge";
+Object.defineProperty(exports, "__esModule", { value: true });
+exports.cn = cn;
+const clsx_1 = require("clsx");
+const tailwind_merge_1 = require("tailwind-merge");
 /**
  * Merges class names using clsx and tailwind-merge
  * @param inputs - Class values to merge
  * @returns Merged class string
  */
-export function cn(...inputs) {
-    return twMerge(clsx(inputs));
+function cn(...inputs) {
+    return (0, tailwind_merge_1.twMerge)((0, clsx_1.clsx)(inputs));
 }

package/package.json

@@ -1,6 +1,6 @@
 {
   "name": "hazo_config",
-  "version": "1.2.0",
+  "version": "1.3.1",
   "description": "Config wrapper with error handling",
   "main": "dist/index.js",
   "types": "dist/index.d.ts",

package/src/components/config_editor.stories.tsx

@@ -3,7 +3,7 @@
 
 import type { Meta, StoryObj } from '@storybook/react'
 import { ConfigEditor } from './config_editor'
-import { MockConfigProvider } from '@/lib/mock_config_provider'
+import { MockConfigProvider } from '../lib/mock_config_provider'
 
 /**
  * Sample configuration data for testing

package/src/components/config_editor.tsx

@@ -2,8 +2,8 @@
 // Provides a more advanced interface for editing configuration values
 
 import React, { useState, useEffect } from 'react'
-import { cn } from '@/lib/utils'
-import type { ConfigProvider } from '@/lib/types'
+import { cn } from '../lib/utils'
+import type { ConfigProvider } from '../lib/types'
 import { RefreshCw, Save } from 'lucide-react'
 
 /**

package/src/components/config_viewer.stories.tsx

@@ -3,7 +3,7 @@
 
 import type { Meta, StoryObj } from '@storybook/react'
 import { ConfigViewer } from './config_viewer'
-import { MockConfigProvider } from '@/lib/mock_config_provider'
+import { MockConfigProvider } from '../lib/mock_config_provider'
 
 /**
  * Sample configuration data for testing

package/src/components/config_viewer.tsx

@@ -2,8 +2,8 @@
 // Displays configuration sections and values in a readable format
 
 import React, { useState, useEffect } from 'react'
-import { cn } from '@/lib/utils'
-import type { ConfigProvider } from '@/lib/types'
+import { cn } from '../lib/utils'
+import type { ConfigProvider } from '../lib/types'
 import { Pencil, CheckCircle2, XCircle } from 'lucide-react'
 
 /**

package/src/components/example_component.tsx

@@ -2,7 +2,7 @@
 // This is a placeholder component to demonstrate the setup
 
 import React from 'react'
-import { cn } from '@/lib/utils'
+import { cn } from '../lib/utils'
 
 /**
  * Example component props interface

package/src/components/index.ts

@@ -1,9 +1,9 @@
 // Component exports
 // Export all components from this file for easy importing
 
-export { ExampleComponent } from './example_component'
-export { ConfigViewer } from './config_viewer'
-export { ConfigEditor } from './config_editor'
-export type { ConfigViewerProps } from './config_viewer'
-export type { ConfigEditorProps } from './config_editor'
+export { ExampleComponent } from './example_component.js'
+export { ConfigViewer } from './config_viewer.js'
+export { ConfigEditor } from './config_editor.js'
+export type { ConfigViewerProps } from './config_viewer.js'
+export type { ConfigEditorProps } from './config_editor.js'
 

package/src/index.ts

@@ -1,7 +1,7 @@
 // Main entry point for the component library
 // Export all components and utilities from this file
 
-export * from './components'
-export * from './lib/utils'
-export * from './lib'
+export * from './components/index.js'
+export * from './lib/utils.js'
+export * from './lib/index.js'
 

package/src/lib/index.ts

@@ -6,13 +6,13 @@
  * for consumers of the library.
  */
 
-export { HazoConfig } from './config-loader'
-export { MockConfigProvider } from './mock_config_provider'
-export { ConfigErrorCode } from './types'
+export { HazoConfig } from './config-loader.js'
+export { MockConfigProvider } from './mock_config_provider.js'
+export { ConfigErrorCode } from './types.js'
 export type {
   ConfigProvider,
   HazoConfigOptions,
   Logger,
   HazoConfigError
-} from './types'
+} from './types.js'
 

package/tsconfig.build.json

@@ -2,11 +2,13 @@
   "extends": "./tsconfig.json",
   "compilerOptions": {
     "noEmit": false,
+    "module": "Node16",
     "declaration": true,
     "declarationMap": true,
     "outDir": "./dist",
     "rootDir": "./src",
-    "allowImportingTsExtensions": false
+    "allowImportingTsExtensions": false,
+    "moduleResolution": "Node16"
   },
   "include": ["src"],
   "exclude": ["**/*.stories.tsx", "**/*.test.tsx", "**/*.test.ts"]