@walkeros/explorer 0.3.1 → 1.0.0

package/dist/components/forms/widget-registry.js

@@ -0,0 +1,54 @@
+import { MappingStringWidget } from '../atoms/mapping-string';
+import { MappingNumberWidget } from '../atoms/mapping-number';
+import { MappingBooleanWidget } from '../atoms/mapping-boolean';
+import { MappingConsentWidget } from '../atoms/mapping-consent';
+import { MappingValueWidget } from '../atoms/mapping-value';
+import { MappingObjectExplorerWidget } from '../atoms/mapping-object-explorer';
+/**
+ * Widget Registry for RJSF Mapping Forms
+ *
+ * Central registry of all custom mapping widgets used in react-jsonschema-form.
+ * Widgets are registered here and referenced in uiSchema via 'ui:widget' property.
+ *
+ * @example
+ * // In uiSchema:
+ * const uiSchema = {
+ *   name: {
+ *     'ui:widget': 'mappingString'
+ *   }
+ * }
+ *
+ * @example
+ * // In Form component:
+ * <Form
+ *   schema={schema}
+ *   widgets={mappingWidgets}
+ *   ...
+ * />
+ *
+ * To add a new widget:
+ * 1. Create the widget component in src/components/atoms/mapping-*.tsx
+ * 2. Import it here
+ * 3. Add to the mappingWidgets object with a descriptive key
+ * 4. Reference it in uiSchema using the key
+ */
+/**
+ * Mapping Widgets Registry
+ *
+ * Available widgets:
+ * - mappingString: Text input for string values
+ * - mappingNumber: Number input with min/max validation
+ * - mappingBoolean: Checkbox for boolean values
+ * - mappingConsent: Collapsible consent requirements editor
+ * - mappingValue: Multi-type static value editor (string/number/boolean/object)
+ * - objectExplorer: Generic object key-value explorer with add/rename/delete/navigate
+ */
+export const mappingWidgets = {
+    mappingString: MappingStringWidget,
+    mappingNumber: MappingNumberWidget,
+    mappingBoolean: MappingBooleanWidget,
+    mappingConsent: MappingConsentWidget,
+    mappingValue: MappingValueWidget,
+    objectExplorer: MappingObjectExplorerWidget,
+};
+//# sourceMappingURL=widget-registry.js.map

package/dist/components/forms/widget-registry.js.map

@@ -0,0 +1 @@
+{"version":3,"file":"widget-registry.js","sourceRoot":"","sources":["../../../src/components/forms/widget-registry.ts"],"names":[],"mappings":"AACA,OAAO,EAAE,mBAAmB,EAAE,MAAM,yBAAyB,CAAC;AAC9D,OAAO,EAAE,mBAAmB,EAAE,MAAM,yBAAyB,CAAC;AAC9D,OAAO,EAAE,oBAAoB,EAAE,MAAM,0BAA0B,CAAC;AAChE,OAAO,EAAE,oBAAoB,EAAE,MAAM,0BAA0B,CAAC;AAChE,OAAO,EAAE,kBAAkB,EAAE,MAAM,wBAAwB,CAAC;AAC5D,OAAO,EAAE,2BAA2B,EAAE,MAAM,kCAAkC,CAAC;AAE/E;;;;;;;;;;;;;;;;;;;;;;;;;;;GA2BG;AAEH;;;;;;;;;;GAUG;AACH,MAAM,CAAC,MAAM,cAAc,GAAwB;IACjD,aAAa,EAAE,mBAAmB;IAClC,aAAa,EAAE,mBAAmB;IAClC,cAAc,EAAE,oBAAoB;IACpC,cAAc,EAAE,oBAAoB;IACpC,YAAY,EAAE,kBAAkB;IAChC,cAAc,EAAE,2BAA2B;CAC5C,CAAC"}

package/dist/components/molecules/architecture-flow/ArchitectureFlow.d.ts

@@ -0,0 +1,24 @@
+import type { ReactNode } from 'react';
+export interface FlowItem {
+    icon: ReactNode;
+    label: string;
+}
+export interface FlowSection {
+    title: string;
+    items: FlowItem[];
+}
+export interface FlowColumn {
+    title: string;
+    sections: FlowSection[];
+}
+export interface ArchitectureFlowProps {
+    sources: FlowColumn;
+    center: ReactNode;
+    centerTitle?: string;
+    destinations: FlowColumn;
+    arrowRight?: ReactNode;
+    arrowDown?: ReactNode;
+    className?: string;
+}
+export declare function ArchitectureFlow({ sources, center, centerTitle, destinations, arrowRight, arrowDown, className, }: ArchitectureFlowProps): import("react/jsx-runtime").JSX.Element;
+//# sourceMappingURL=ArchitectureFlow.d.ts.map

package/dist/components/molecules/architecture-flow/ArchitectureFlow.d.ts.map

@@ -0,0 +1 @@
+{"version":3,"file":"ArchitectureFlow.d.ts","sourceRoot":"","sources":["../../../../src/components/molecules/architecture-flow/ArchitectureFlow.tsx"],"names":[],"mappings":"AACA,OAAO,KAAK,EAAE,SAAS,EAAE,MAAM,OAAO,CAAC;AAIvC,MAAM,WAAW,QAAQ;IACvB,IAAI,EAAE,SAAS,CAAC;IAChB,KAAK,EAAE,MAAM,CAAC;CACf;AAED,MAAM,WAAW,WAAW;IAC1B,KAAK,EAAE,MAAM,CAAC;IACd,KAAK,EAAE,QAAQ,EAAE,CAAC;CACnB;AAED,MAAM,WAAW,UAAU;IACzB,KAAK,EAAE,MAAM,CAAC;IACd,QAAQ,EAAE,WAAW,EAAE,CAAC;CACzB;AAED,MAAM,WAAW,qBAAqB;IACpC,OAAO,EAAE,UAAU,CAAC;IACpB,MAAM,EAAE,SAAS,CAAC;IAClB,WAAW,CAAC,EAAE,MAAM,CAAC;IACrB,YAAY,EAAE,UAAU,CAAC;IACzB,UAAU,CAAC,EAAE,SAAS,CAAC;IACvB,SAAS,CAAC,EAAE,SAAS,CAAC;IACtB,SAAS,CAAC,EAAE,MAAM,CAAC;CACpB;AAED,wBAAgB,gBAAgB,CAAC,EAC/B,OAAO,EACP,MAAM,EACN,WAAW,EACX,YAAY,EACZ,UAA4C,EAC5C,SAA0C,EAC1C,SAAS,GACV,EAAE,qBAAqB,2CA6DvB"}

package/dist/components/molecules/architecture-flow/ArchitectureFlow.js

@@ -0,0 +1,10 @@
+import { jsx as _jsx, jsxs as _jsxs } from "react/jsx-runtime";
+import { Icon } from '@iconify/react';
+import { cn } from '@/lib/utils';
+export function ArchitectureFlow({ sources, center, centerTitle, destinations, arrowRight = _jsx(Icon, { icon: "mdi:arrow-right" }), arrowDown = _jsx(Icon, { icon: "mdi:arrow-down" }), className, }) {
+    return (_jsx("div", { className: cn('elb-architecture-flow', className), children: _jsxs("div", { className: "elb-architecture-flow__grid", children: [_jsx("span", { className: "elb-architecture-flow__title elb-architecture-flow__title--desktop", children: sources.title }), _jsx("div", { className: "elb-architecture-flow__spacer" }), _jsx("span", { className: "elb-architecture-flow__title elb-architecture-flow__title--desktop", children: centerTitle }), _jsx("div", { className: "elb-architecture-flow__spacer" }), _jsx("span", { className: "elb-architecture-flow__title elb-architecture-flow__title--desktop", children: destinations.title }), _jsxs("div", { className: "elb-architecture-flow__column", children: [_jsx("span", { className: "elb-architecture-flow__title elb-architecture-flow__title--mobile", children: sources.title }), _jsx("div", { className: "elb-architecture-flow__sections", children: sources.sections.map((section) => (_jsx(FlowSectionBox, { section: section }, section.title))) })] }), _jsx("div", { className: "elb-architecture-flow__arrow elb-architecture-flow__arrow--desktop", children: arrowRight }), _jsx("div", { className: "elb-architecture-flow__arrow elb-architecture-flow__arrow--mobile", children: arrowDown }), _jsxs("div", { className: "elb-architecture-flow__center", children: [_jsx("span", { className: "elb-architecture-flow__title elb-architecture-flow__title--mobile", children: centerTitle }), _jsx("div", { className: "elb-architecture-flow__center-content", children: center })] }), _jsx("div", { className: "elb-architecture-flow__arrow elb-architecture-flow__arrow--desktop", children: arrowRight }), _jsx("div", { className: "elb-architecture-flow__arrow elb-architecture-flow__arrow--mobile", children: arrowDown }), _jsxs("div", { className: "elb-architecture-flow__column", children: [_jsx("span", { className: "elb-architecture-flow__title elb-architecture-flow__title--mobile", children: destinations.title }), _jsx("div", { className: "elb-architecture-flow__sections", children: destinations.sections.map((section) => (_jsx(FlowSectionBox, { section: section }, section.title))) })] })] }) }));
+}
+function FlowSectionBox({ section }) {
+    return (_jsxs("div", { className: "elb-architecture-flow__section", children: [_jsx("span", { className: "elb-architecture-flow__section-title", children: section.title }), _jsxs("div", { className: "elb-architecture-flow__items", children: [section.items.map((item) => (_jsxs("div", { className: "elb-architecture-flow__item", children: [_jsx("span", { className: "elb-architecture-flow__item-icon", children: item.icon }), _jsx("span", { className: "elb-architecture-flow__item-label", children: item.label })] }, item.label))), _jsx("span", { className: "elb-architecture-flow__more", children: "and more\u2026" })] })] }));
+}
+//# sourceMappingURL=ArchitectureFlow.js.map

package/dist/components/molecules/architecture-flow/ArchitectureFlow.js.map

@@ -0,0 +1 @@
+{"version":3,"file":"ArchitectureFlow.js","sourceRoot":"","sources":["../../../../src/components/molecules/architecture-flow/ArchitectureFlow.tsx"],"names":[],"mappings":";AAEA,OAAO,EAAE,IAAI,EAAE,MAAM,gBAAgB,CAAC;AACtC,OAAO,EAAE,EAAE,EAAE,MAAM,aAAa,CAAC;AA2BjC,MAAM,UAAU,gBAAgB,CAAC,EAC/B,OAAO,EACP,MAAM,EACN,WAAW,EACX,YAAY,EACZ,UAAU,GAAG,KAAC,IAAI,IAAC,IAAI,EAAC,iBAAiB,GAAG,EAC5C,SAAS,GAAG,KAAC,IAAI,IAAC,IAAI,EAAC,gBAAgB,GAAG,EAC1C,SAAS,GACa;IACtB,OAAO,CACL,cAAK,SAAS,EAAE,EAAE,CAAC,uBAAuB,EAAE,SAAS,CAAC,YACpD,eAAK,SAAS,EAAC,6BAA6B,aAC1C,eAAM,SAAS,EAAC,oEAAoE,YACjF,OAAO,CAAC,KAAK,GACT,EACP,cAAK,SAAS,EAAC,+BAA+B,GAAG,EACjD,eAAM,SAAS,EAAC,oEAAoE,YACjF,WAAW,GACP,EACP,cAAK,SAAS,EAAC,+BAA+B,GAAG,EACjD,eAAM,SAAS,EAAC,oEAAoE,YACjF,YAAY,CAAC,KAAK,GACd,EAEP,eAAK,SAAS,EAAC,+BAA+B,aAC5C,eAAM,SAAS,EAAC,mEAAmE,YAChF,OAAO,CAAC,KAAK,GACT,EACP,cAAK,SAAS,EAAC,iCAAiC,YAC7C,OAAO,CAAC,QAAQ,CAAC,GAAG,CAAC,CAAC,OAAO,EAAE,EAAE,CAAC,CACjC,KAAC,cAAc,IAAqB,OAAO,EAAE,OAAO,IAA/B,OAAO,CAAC,KAAK,CAAsB,CACzD,CAAC,GACE,IACF,EAEN,cAAK,SAAS,EAAC,oEAAoE,YAChF,UAAU,GACP,EACN,cAAK,SAAS,EAAC,mEAAmE,YAC/E,SAAS,GACN,EAEN,eAAK,SAAS,EAAC,+BAA+B,aAC5C,eAAM,SAAS,EAAC,mEAAmE,YAChF,WAAW,GACP,EACP,cAAK,SAAS,EAAC,uCAAuC,YAAE,MAAM,GAAO,IACjE,EAEN,cAAK,SAAS,EAAC,oEAAoE,YAChF,UAAU,GACP,EACN,cAAK,SAAS,EAAC,mEAAmE,YAC/E,SAAS,GACN,EAEN,eAAK,SAAS,EAAC,+BAA+B,aAC5C,eAAM,SAAS,EAAC,mEAAmE,YAChF,YAAY,CAAC,KAAK,GACd,EACP,cAAK,SAAS,EAAC,iCAAiC,YAC7C,YAAY,CAAC,QAAQ,CAAC,GAAG,CAAC,CAAC,OAAO,EAAE,EAAE,CAAC,CACtC,KAAC,cAAc,IAAqB,OAAO,EAAE,OAAO,IAA/B,OAAO,CAAC,KAAK,CAAsB,CACzD,CAAC,GACE,IACF,IACF,GACF,CACP,CAAC;AACJ,CAAC;AAED,SAAS,cAAc,CAAC,EAAE,OAAO,EAA4B;IAC3D,OAAO,CACL,eAAK,SAAS,EAAC,gCAAgC,aAC7C,eAAM,SAAS,EAAC,sCAAsC,YACnD,OAAO,CAAC,KAAK,GACT,EACP,eAAK,SAAS,EAAC,8BAA8B,aAC1C,OAAO,CAAC,KAAK,CAAC,GAAG,CAAC,CAAC,IAAI,EAAE,EAAE,CAAC,CAC3B,eAAsB,SAAS,EAAC,6BAA6B,aAC3D,eAAM,SAAS,EAAC,kCAAkC,YAC/C,IAAI,CAAC,IAAI,GACL,EACP,eAAM,SAAS,EAAC,mCAAmC,YAChD,IAAI,CAAC,KAAK,GACN,KANC,IAAI,CAAC,KAAK,CAOd,CACP,CAAC,EACF,eAAM,SAAS,EAAC,6BAA6B,+BAAiB,IAC1D,IACF,CACP,CAAC;AACJ,CAAC"}

package/dist/components/molecules/architecture-flow/ArchitectureFlow.stories.d.ts

@@ -0,0 +1,7 @@
+import type { Meta, StoryObj } from '@storybook/react-vite';
+import { ArchitectureFlow } from './ArchitectureFlow';
+declare const meta: Meta<typeof ArchitectureFlow>;
+export default meta;
+type Story = StoryObj<typeof ArchitectureFlow>;
+export declare const Default: Story;
+//# sourceMappingURL=ArchitectureFlow.stories.d.ts.map

package/dist/components/molecules/architecture-flow/ArchitectureFlow.stories.d.ts.map

@@ -0,0 +1 @@
+{"version":3,"file":"ArchitectureFlow.stories.d.ts","sourceRoot":"","sources":["../../../../src/components/molecules/architecture-flow/ArchitectureFlow.stories.tsx"],"names":[],"mappings":"AACA,OAAO,KAAK,EAAE,IAAI,EAAE,QAAQ,EAAE,MAAM,uBAAuB,CAAC;AAC5D,OAAO,EAAE,gBAAgB,EAAE,MAAM,oBAAoB,CAAC;AAItD,QAAA,MAAM,IAAI,EAAE,IAAI,CAAC,OAAO,gBAAgB,CAavC,CAAC;AAEF,eAAe,IAAI,CAAC;AACpB,KAAK,KAAK,GAAG,QAAQ,CAAC,OAAO,gBAAgB,CAAC,CAAC;AAyD/C,eAAO,MAAM,OAAO,EAAE,KAarB,CAAC"}

package/dist/components/molecules/architecture-flow/ArchitectureFlow.stories.js

@@ -0,0 +1,71 @@
+import { jsx as _jsx } from "react/jsx-runtime";
+import { ArchitectureFlow } from './ArchitectureFlow';
+import { Icon } from '@/components/atoms/icons';
+const meta = {
+    title: 'Molecules/ArchitectureFlow',
+    component: ArchitectureFlow,
+    parameters: {
+        layout: 'padded',
+    },
+    decorators: [
+        (Story) => (_jsx("div", { className: "elb-explorer", style: { padding: '2rem' }, children: _jsx(Story, {}) })),
+    ],
+};
+export default meta;
+const walkerOSSources = {
+    title: 'Sources',
+    sections: [
+        {
+            title: 'Client-side',
+            items: [
+                { icon: _jsx(Icon, { icon: "mdi:web" }), label: 'Browser' },
+                { icon: _jsx(Icon, { icon: "mdi:layers-outline" }), label: 'dataLayer' },
+            ],
+        },
+        {
+            title: 'Server-side',
+            items: [
+                { icon: _jsx(Icon, { icon: "simple-icons:express" }), label: 'Express' },
+                { icon: _jsx(Icon, { icon: "mdi:api" }), label: 'Fetch' },
+                { icon: _jsx(Icon, { icon: "logos:aws-lambda" }), label: 'AWS Lambda' },
+                { icon: _jsx(Icon, { icon: "logos:google-cloud" }), label: 'GCP Functions' },
+            ],
+        },
+    ],
+};
+const walkerOSDestinations = {
+    title: 'Destinations',
+    sections: [
+        {
+            title: 'Client-side',
+            items: [
+                { icon: _jsx(Icon, { icon: "logos:google-analytics" }), label: 'GA4' },
+                { icon: _jsx(Icon, { icon: "logos:google-ads" }), label: 'Google Ads' },
+                { icon: _jsx(Icon, { icon: "logos:meta-icon" }), label: 'Meta Pixel' },
+                {
+                    icon: (_jsx(Icon, { icon: "simple-icons:plausibleanalytics", style: { color: '#5850EC' } })),
+                    label: 'Plausible',
+                },
+                { icon: _jsx(Icon, { icon: "walkeros:piwik-pro" }), label: 'Piwik PRO' },
+                { icon: _jsx(Icon, { icon: "mdi:api" }), label: 'API' },
+            ],
+        },
+        {
+            title: 'Server-side',
+            items: [
+                { icon: _jsx(Icon, { icon: "logos:aws" }), label: 'AWS' },
+                { icon: _jsx(Icon, { icon: "logos:google-cloud" }), label: 'BigQuery' },
+                { icon: _jsx(Icon, { icon: "logos:meta-icon" }), label: 'Meta CAPI' },
+            ],
+        },
+    ],
+};
+export const Default = {
+    args: {
+        sources: walkerOSSources,
+        centerTitle: 'Collector',
+        center: (_jsx("img", { src: "/walkerOS_logo_new.svg", alt: "walkerOS", style: { width: '128px', height: '128px' } })),
+        destinations: walkerOSDestinations,
+    },
+};
+//# sourceMappingURL=ArchitectureFlow.stories.js.map

package/dist/components/molecules/architecture-flow/ArchitectureFlow.stories.js.map

@@ -0,0 +1 @@
+{"version":3,"file":"ArchitectureFlow.stories.js","sourceRoot":"","sources":["../../../../src/components/molecules/architecture-flow/ArchitectureFlow.stories.tsx"],"names":[],"mappings":"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"}

package/dist/components/molecules/architecture-flow/index.d.ts

@@ -0,0 +1,3 @@
+export { ArchitectureFlow } from './ArchitectureFlow';
+export type { ArchitectureFlowProps, FlowColumn, FlowSection, FlowItem, } from './ArchitectureFlow';
+//# sourceMappingURL=index.d.ts.map

package/dist/components/molecules/architecture-flow/index.d.ts.map

@@ -0,0 +1 @@
+{"version":3,"file":"index.d.ts","sourceRoot":"","sources":["../../../../src/components/molecules/architecture-flow/index.ts"],"names":[],"mappings":"AAAA,OAAO,EAAE,gBAAgB,EAAE,MAAM,oBAAoB,CAAC;AACtD,YAAY,EACV,qBAAqB,EACrB,UAAU,EACV,WAAW,EACX,QAAQ,GACT,MAAM,oBAAoB,CAAC"}

package/dist/components/molecules/architecture-flow/index.js

@@ -0,0 +1,2 @@
+export { ArchitectureFlow } from './ArchitectureFlow';
+//# sourceMappingURL=index.js.map

package/dist/components/molecules/architecture-flow/index.js.map

@@ -0,0 +1 @@
+{"version":3,"file":"index.js","sourceRoot":"","sources":["../../../../src/components/molecules/architecture-flow/index.ts"],"names":[],"mappings":"AAAA,OAAO,EAAE,gBAAgB,EAAE,MAAM,oBAAoB,CAAC"}

package/dist/components/molecules/auto-select.d.ts

@@ -0,0 +1,29 @@
+export interface AutoSelectProps {
+    options: string[];
+    onSelect: (value: string, isNew?: boolean) => void;
+    placeholder?: string;
+    value?: string;
+    className?: string;
+    onClear?: () => void;
+}
+/**
+ * AutoSelect - Autocomplete dropdown component
+ *
+ * Features:
+ * - Shows all entries on click/focus
+ * - Filters only when user types (starts from first character)
+ * - Scrollable list when more than 5 items
+ * - Keyboard navigation (ArrowUp, ArrowDown, Enter, Escape)
+ * - Mouse click selection
+ * - Shows "(create)" indicator for valid new rules (entity action format)
+ * - Theme-aware styling via CSS variables
+ *
+ * @example
+ * <AutoSelect
+ *   options={['product view', 'product add', 'order complete']}
+ *   onSelect={(value, isNew) => console.log(value, isNew)}
+ *   placeholder="Select mapping rule..."
+ * />
+ */
+export declare function AutoSelect({ options, onSelect, placeholder, value, className, onClear, }: AutoSelectProps): import("react/jsx-runtime").JSX.Element;
+//# sourceMappingURL=auto-select.d.ts.map

package/dist/components/molecules/auto-select.d.ts.map

@@ -0,0 +1 @@
+{"version":3,"file":"auto-select.d.ts","sourceRoot":"","sources":["../../../src/components/molecules/auto-select.tsx"],"names":[],"mappings":"AAGA,MAAM,WAAW,eAAe;IAC9B,OAAO,EAAE,MAAM,EAAE,CAAC;IAClB,QAAQ,EAAE,CAAC,KAAK,EAAE,MAAM,EAAE,KAAK,CAAC,EAAE,OAAO,KAAK,IAAI,CAAC;IACnD,WAAW,CAAC,EAAE,MAAM,CAAC;IACrB,KAAK,CAAC,EAAE,MAAM,CAAC;IACf,SAAS,CAAC,EAAE,MAAM,CAAC;IACnB,OAAO,CAAC,EAAE,MAAM,IAAI,CAAC;CACtB;AAED;;;;;;;;;;;;;;;;;;GAkBG;AACH,wBAAgB,UAAU,CAAC,EACzB,OAAO,EACP,QAAQ,EACR,WAAyB,EACzB,KAAU,EACV,SAAc,EACd,OAAO,GACR,EAAE,eAAe,2CAoRjB"}

package/dist/components/molecules/auto-select.js

@@ -0,0 +1,188 @@
+import { jsx as _jsx, jsxs as _jsxs } from "react/jsx-runtime";
+import { useState, useRef, useEffect } from 'react';
+import { createPortal } from 'react-dom';
+/**
+ * AutoSelect - Autocomplete dropdown component
+ *
+ * Features:
+ * - Shows all entries on click/focus
+ * - Filters only when user types (starts from first character)
+ * - Scrollable list when more than 5 items
+ * - Keyboard navigation (ArrowUp, ArrowDown, Enter, Escape)
+ * - Mouse click selection
+ * - Shows "(create)" indicator for valid new rules (entity action format)
+ * - Theme-aware styling via CSS variables
+ *
+ * @example
+ * <AutoSelect
+ *   options={['product view', 'product add', 'order complete']}
+ *   onSelect={(value, isNew) => console.log(value, isNew)}
+ *   placeholder="Select mapping rule..."
+ * />
+ */
+export function AutoSelect({ options, onSelect, placeholder = 'Select...', value = '', className = '', onClear, }) {
+    const [inputValue, setInputValue] = useState(value);
+    const [isOpen, setIsOpen] = useState(false);
+    const [highlightedIndex, setHighlightedIndex] = useState(0);
+    const [userHasTyped, setUserHasTyped] = useState(false);
+    const [dropdownPosition, setDropdownPosition] = useState({
+        top: 0,
+        left: 0,
+        width: 0,
+    });
+    const inputRef = useRef(null);
+    const dropdownRef = useRef(null);
+    const containerRef = useRef(null);
+    // Filter options only when user has typed
+    const filteredOptions = userHasTyped && inputValue.trim() !== ''
+        ? options.filter((option) => option.toLowerCase().startsWith(inputValue.toLowerCase().trim()))
+        : options;
+    // Show scrollbar when more than 5 items
+    const displayOptions = filteredOptions;
+    // Validate entity action format (must have exactly one space)
+    const isValidFormat = (text) => {
+        const trimmed = text.trim();
+        const parts = trimmed.split(' ');
+        return parts.length === 2 && parts[0] !== '' && parts[1] !== '';
+    };
+    // Check if input value is a new rule (not in existing options and valid format)
+    const isNewRule = inputValue.trim() !== '' &&
+        isValidFormat(inputValue.trim()) &&
+        !options.some((option) => option.toLowerCase() === inputValue.toLowerCase().trim());
+    // Update input value when prop changes
+    useEffect(() => {
+        setInputValue(value);
+        setUserHasTyped(false);
+    }, [value]);
+    // Reset highlighted index when filtered options change
+    useEffect(() => {
+        setHighlightedIndex(0);
+    }, [filteredOptions.length]);
+    // Update dropdown position when opened or on scroll/resize
+    useEffect(() => {
+        const updatePosition = () => {
+            if (containerRef.current && isOpen) {
+                const rect = containerRef.current.getBoundingClientRect();
+                setDropdownPosition({
+                    top: rect.bottom + 4,
+                    left: rect.left,
+                    width: rect.width,
+                });
+            }
+        };
+        if (isOpen) {
+            updatePosition();
+            window.addEventListener('scroll', updatePosition, true);
+            window.addEventListener('resize', updatePosition);
+            return () => {
+                window.removeEventListener('scroll', updatePosition, true);
+                window.removeEventListener('resize', updatePosition);
+            };
+        }
+    }, [isOpen]);
+    // Handle click outside to close dropdown
+    useEffect(() => {
+        const handleClickOutside = (event) => {
+            if (containerRef.current &&
+                !containerRef.current.contains(event.target) &&
+                dropdownRef.current &&
+                !dropdownRef.current.contains(event.target)) {
+                setIsOpen(false);
+                setUserHasTyped(false);
+            }
+        };
+        if (isOpen) {
+            document.addEventListener('mousedown', handleClickOutside);
+            return () => document.removeEventListener('mousedown', handleClickOutside);
+        }
+    }, [isOpen]);
+    const handleInputChange = (e) => {
+        setInputValue(e.target.value);
+        setUserHasTyped(true);
+        if (!isOpen) {
+            setIsOpen(true);
+        }
+    };
+    const handleInputFocus = () => {
+        setIsOpen(true);
+        setUserHasTyped(false); // Show all options on focus
+    };
+    const handleOptionClick = (option, isNew = false) => {
+        setInputValue(option);
+        setIsOpen(false);
+        setUserHasTyped(false);
+        onSelect(option, isNew);
+        inputRef.current?.blur();
+    };
+    const handleKeyDown = (e) => {
+        if (!isOpen && (e.key === 'ArrowDown' || e.key === 'ArrowUp')) {
+            setIsOpen(true);
+            setUserHasTyped(false);
+            return;
+        }
+        const totalOptions = displayOptions.length + (isNewRule ? 1 : 0);
+        switch (e.key) {
+            case 'ArrowDown':
+                e.preventDefault();
+                setHighlightedIndex((prev) => prev < totalOptions - 1 ? prev + 1 : prev);
+                break;
+            case 'ArrowUp':
+                e.preventDefault();
+                setHighlightedIndex((prev) => (prev > 0 ? prev - 1 : prev));
+                break;
+            case 'Enter':
+                e.preventDefault();
+                if (isNewRule && highlightedIndex === displayOptions.length) {
+                    // Create new rule
+                    handleOptionClick(inputValue.trim(), true);
+                }
+                else if (displayOptions[highlightedIndex]) {
+                    handleOptionClick(displayOptions[highlightedIndex]);
+                }
+                break;
+            case 'Escape':
+                e.preventDefault();
+                setIsOpen(false);
+                setUserHasTyped(false);
+                inputRef.current?.blur();
+                break;
+        }
+    };
+    // Scroll highlighted option into view
+    useEffect(() => {
+        if (isOpen && dropdownRef.current) {
+            const highlightedElement = dropdownRef.current.querySelector(`[data-index="${highlightedIndex}"]`);
+            if (highlightedElement) {
+                highlightedElement.scrollIntoView({
+                    block: 'nearest',
+                    behavior: 'smooth',
+                });
+            }
+        }
+    }, [highlightedIndex, isOpen]);
+    const handleClear = (e) => {
+        e.preventDefault();
+        setInputValue('');
+        setUserHasTyped(false);
+        setIsOpen(false);
+        onClear?.();
+    };
+    return (_jsxs("div", { className: `elb-auto-select ${className}`, ref: containerRef, children: [_jsxs("div", { className: "elb-auto-select-input-wrapper", children: [_jsx("input", { ref: inputRef, type: "text", className: "elb-auto-select-input", value: inputValue, onChange: handleInputChange, onFocus: handleInputFocus, onKeyDown: handleKeyDown, placeholder: placeholder, autoComplete: "off" }), onClear && inputValue && (_jsx("button", { type: "button", className: "elb-auto-select-clear", onClick: handleClear, title: "Clear selection", children: "\u00D7" }))] }), (isOpen &&
+                (displayOptions.length > 0 || isNewRule) &&
+                createPortal(_jsxs("div", { ref: dropdownRef, className: `elb-auto-select-dropdown elb-auto-select-dropdown-fixed ${displayOptions.length > 5 ? 'scrollable' : ''}`, style: {
+                        top: `${dropdownPosition.top}px`,
+                        left: `${dropdownPosition.left}px`,
+                        width: `${dropdownPosition.width}px`,
+                    }, children: [displayOptions.map((option, index) => (_jsx("div", { "data-index": index, className: `elb-auto-select-option ${index === highlightedIndex ? 'highlighted' : ''}`, onClick: () => handleOptionClick(option), onMouseEnter: () => setHighlightedIndex(index), children: option }, option))), isNewRule && (_jsxs("div", { "data-index": displayOptions.length, className: `elb-auto-select-option ${highlightedIndex === displayOptions.length
+                                ? 'highlighted'
+                                : ''}`, onClick: () => handleOptionClick(inputValue.trim(), true), onMouseEnter: () => setHighlightedIndex(displayOptions.length), children: [_jsx("span", { children: inputValue.trim() }), _jsxs("span", { className: "elb-auto-select-create-label", children: [' ', "(create)"] })] }))] }), document.body)), (isOpen &&
+                displayOptions.length === 0 &&
+                !isNewRule &&
+                userHasTyped &&
+                createPortal(_jsx("div", { className: "elb-auto-select-dropdown elb-auto-select-dropdown-fixed", style: {
+                        top: `${dropdownPosition.top}px`,
+                        left: `${dropdownPosition.left}px`,
+                        width: `${dropdownPosition.width}px`,
+                    }, children: _jsx("div", { className: "elb-auto-select-option elb-auto-select-no-results", children: "No results found" }) }), document.body))] }));
+}
+//# sourceMappingURL=auto-select.js.map

package/dist/components/molecules/auto-select.js.map

@@ -0,0 +1 @@
+{"version":3,"file":"auto-select.js","sourceRoot":"","sources":["../../../src/components/molecules/auto-select.tsx"],"names":[],"mappings":"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"}

package/dist/components/molecules/code-box.d.ts

@@ -0,0 +1,69 @@
+import React from 'react';
+import { type CodeProps } from '../atoms/code';
+/**
+ * Tab with code content for CodeBox
+ */
+export interface CodeBoxTab {
+    id: string;
+    label: string;
+    code: string;
+    language?: string;
+}
+export interface CodeBoxProps extends Omit<CodeProps, 'code'> {
+    code?: string;
+    label?: string;
+    header?: string;
+    showHeader?: boolean;
+    tabs?: CodeBoxTab[];
+    activeTab?: string;
+    onTabChange?: (id: string) => void;
+    defaultTab?: string;
+    showTrafficLights?: boolean;
+    showCopy?: boolean;
+    showFormat?: boolean;
+    footer?: React.ReactNode;
+    height?: string | number;
+    style?: React.CSSProperties;
+}
+/**
+ * CodeBox - Monaco editor wrapped in a Box with header and actions
+ *
+ * Molecule that combines Box + Code atom + toolbar actions.
+ * Use this when you need an editor with header, copy, and format buttons.
+ * Use Code atom directly when you need an editor without Box wrapper.
+ *
+ * Height Behavior:
+ *
+ * Three height modes:
+ * 1. Grid context: Equal row heights (250-450px), fills available space
+ * 2. Explicit height prop: Fixed height (e.g., height={600} or height="50vh")
+ * 3. Auto-height prop: Dynamically sizes to content (min-max boundaries)
+ *
+ * @example
+ * // Grid context - use default (no autoHeight) for equal row heights
+ * <Grid columns={3}>
+ *   <CodeBox code={event} label="Event" showCopy />
+ *   <CodeBox code={mapping} label="Mapping" showFormat />
+ *   <CodeBox code={output} label="Output" disabled />
+ * </Grid>
+ *
+ * @example
+ * // Standalone with auto-height - fits content, no blank space
+ * <CodeBox
+ *   code={setupCode}
+ *   label="Setup"
+ *   autoHeight={{ min: 100, max: 600 }}
+ *   disabled
+ * />
+ *
+ * @example
+ * // Explicit height override
+ * <CodeBox
+ *   code={largeConfig}
+ *   label="Configuration"
+ *   height={600}
+ *   showFormat
+ * />
+ */
+export declare function CodeBox({ code, language, onChange, disabled, autoHeight, label, header, showHeader, tabs, activeTab: controlledActiveTab, onTabChange, defaultTab, showTrafficLights, showCopy, showFormat, footer, height, style, className, ...codeProps }: CodeBoxProps): import("react/jsx-runtime").JSX.Element;
+//# sourceMappingURL=code-box.d.ts.map

package/dist/components/molecules/code-box.d.ts.map

@@ -0,0 +1 @@
+{"version":3,"file":"code-box.d.ts","sourceRoot":"","sources":["../../../src/components/molecules/code-box.tsx"],"names":[],"mappings":"AAAA,OAAO,KAAgC,MAAM,OAAO,CAAC;AAErD,OAAO,EAAQ,KAAK,SAAS,EAAE,MAAM,eAAe,CAAC;AAErD;;GAEG;AACH,MAAM,WAAW,UAAU;IACzB,EAAE,EAAE,MAAM,CAAC;IACX,KAAK,EAAE,MAAM,CAAC;IACd,IAAI,EAAE,MAAM,CAAC;IACb,QAAQ,CAAC,EAAE,MAAM,CAAC;CACnB;AAED,MAAM,WAAW,YAAa,SAAQ,IAAI,CAAC,SAAS,EAAE,MAAM,CAAC;IAE3D,IAAI,CAAC,EAAE,MAAM,CAAC;IAGd,KAAK,CAAC,EAAE,MAAM,CAAC;IACf,MAAM,CAAC,EAAE,MAAM,CAAC;IAChB,UAAU,CAAC,EAAE,OAAO,CAAC;IAGrB,IAAI,CAAC,EAAE,UAAU,EAAE,CAAC;IACpB,SAAS,CAAC,EAAE,MAAM,CAAC;IACnB,WAAW,CAAC,EAAE,CAAC,EAAE,EAAE,MAAM,KAAK,IAAI,CAAC;IACnC,UAAU,CAAC,EAAE,MAAM,CAAC;IAGpB,iBAAiB,CAAC,EAAE,OAAO,CAAC;IAG5B,QAAQ,CAAC,EAAE,OAAO,CAAC;IACnB,UAAU,CAAC,EAAE,OAAO,CAAC;IAGrB,MAAM,CAAC,EAAE,KAAK,CAAC,SAAS,CAAC;IACzB,MAAM,CAAC,EAAE,MAAM,GAAG,MAAM,CAAC;IACzB,KAAK,CAAC,EAAE,KAAK,CAAC,aAAa,CAAC;CAC7B;AAED;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;GAuCG;AACH,wBAAgB,OAAO,CAAC,EAEtB,IAAI,EACJ,QAAuB,EACvB,QAAQ,EACR,QAAgB,EAChB,UAAU,EAEV,KAAK,EACL,MAAM,EACN,UAAiB,EAEjB,IAAI,EACJ,SAAS,EAAE,mBAAmB,EAC9B,WAAW,EACX,UAAU,EAEV,iBAAyB,EAEzB,QAAgB,EAChB,UAAkB,EAElB,MAAM,EACN,MAAM,EACN,KAAK,EACL,SAAS,EACT,GAAG,SAAS,EACb,EAAE,YAAY,2CAiKd"}

package/dist/components/molecules/code-box.js

@@ -0,0 +1,109 @@
+import { jsx as _jsx, jsxs as _jsxs, Fragment as _Fragment } from "react/jsx-runtime";
+import { useState, useCallback } from 'react';
+import { Box } from '../atoms/box';
+import { Code } from '../atoms/code';
+/**
+ * CodeBox - Monaco editor wrapped in a Box with header and actions
+ *
+ * Molecule that combines Box + Code atom + toolbar actions.
+ * Use this when you need an editor with header, copy, and format buttons.
+ * Use Code atom directly when you need an editor without Box wrapper.
+ *
+ * Height Behavior:
+ *
+ * Three height modes:
+ * 1. Grid context: Equal row heights (250-450px), fills available space
+ * 2. Explicit height prop: Fixed height (e.g., height={600} or height="50vh")
+ * 3. Auto-height prop: Dynamically sizes to content (min-max boundaries)
+ *
+ * @example
+ * // Grid context - use default (no autoHeight) for equal row heights
+ * <Grid columns={3}>
+ *   <CodeBox code={event} label="Event" showCopy />
+ *   <CodeBox code={mapping} label="Mapping" showFormat />
+ *   <CodeBox code={output} label="Output" disabled />
+ * </Grid>
+ *
+ * @example
+ * // Standalone with auto-height - fits content, no blank space
+ * <CodeBox
+ *   code={setupCode}
+ *   label="Setup"
+ *   autoHeight={{ min: 100, max: 600 }}
+ *   disabled
+ * />
+ *
+ * @example
+ * // Explicit height override
+ * <CodeBox
+ *   code={largeConfig}
+ *   label="Configuration"
+ *   height={600}
+ *   showFormat
+ * />
+ */
+export function CodeBox({ 
+// Code props (single code mode)
+code, language = 'javascript', onChange, disabled = false, autoHeight, 
+// Header
+label, header, showHeader = true, 
+// Tabs with code content
+tabs, activeTab: controlledActiveTab, onTabChange, defaultTab, 
+// Visual
+showTrafficLights = false, 
+// Actions
+showCopy = false, showFormat = false, 
+// Layout
+footer, height, style, className, ...codeProps }) {
+    const [copied, setCopied] = useState(false);
+    // Track active tab for copy button (Box handles tab state, we just observe)
+    const [currentTabId, setCurrentTabId] = useState(controlledActiveTab ?? defaultTab ?? tabs?.[0]?.id ?? '');
+    // Update internal tracking when controlled prop changes
+    const effectiveTabId = controlledActiveTab ?? currentTabId;
+    // Wrap user's onTabChange to also update our tracking
+    const handleTabChange = useCallback((tabId) => {
+        setCurrentTabId(tabId);
+        onTabChange?.(tabId);
+    }, [onTabChange]);
+    // Get current code for copy/format buttons
+    const activeTabData = tabs?.find((t) => t.id === effectiveTabId);
+    const currentCode = activeTabData?.code ?? code ?? '';
+    const currentLanguage = activeTabData?.language ?? language;
+    // Use label as fallback for header (backward compat)
+    const boxHeader = header ?? label ?? 'Code';
+    const handleCopy = async () => {
+        try {
+            await navigator.clipboard.writeText(currentCode);
+            setCopied(true);
+            setTimeout(() => setCopied(false), 2000);
+        }
+        catch {
+            // Clipboard write failed silently
+        }
+    };
+    const handleFormat = () => {
+        if (!onChange || disabled || currentLanguage !== 'json')
+            return;
+        try {
+            const parsed = JSON.parse(currentCode);
+            const formatted = JSON.stringify(parsed, null, 2);
+            onChange(formatted);
+        }
+        catch (e) {
+            // Invalid JSON, do nothing
+        }
+    };
+    // Build header actions
+    const actions = (_jsxs(_Fragment, { children: [showFormat && !disabled && currentLanguage === 'json' && (_jsx("button", { className: "elb-explorer-btn", onClick: handleFormat, title: "Format JSON", children: _jsxs("svg", { width: "14", height: "14", viewBox: "0 0 24 24", fill: "none", stroke: "currentColor", strokeWidth: "2", strokeLinecap: "round", strokeLinejoin: "round", children: [_jsx("polyline", { points: "16 18 22 12 16 6" }), _jsx("polyline", { points: "8 6 2 12 8 18" })] }) })), showCopy && (_jsx("button", { className: "elb-explorer-btn", onClick: handleCopy, title: copied ? 'Copied!' : 'Copy to clipboard', children: copied ? (_jsx("svg", { width: "14", height: "14", viewBox: "0 0 24 24", fill: "none", stroke: "currentColor", strokeWidth: "2", strokeLinecap: "round", strokeLinejoin: "round", children: _jsx("polyline", { points: "20 6 9 17 4 12" }) })) : (_jsxs("svg", { width: "14", height: "14", viewBox: "0 0 24 24", fill: "none", stroke: "currentColor", strokeWidth: "2", strokeLinecap: "round", strokeLinejoin: "round", children: [_jsx("rect", { x: "9", y: "9", width: "13", height: "13", rx: "2", ry: "2" }), _jsx("path", { d: "M5 15H4a2 2 0 0 1-2-2V4a2 2 0 0 1 2-2h9a2 2 0 0 1 2 2v1" })] })) }))] }));
+    // Auto-height class for content-based sizing (Box handles gridContext)
+    const autoHeightClass = autoHeight ? 'elb-box--auto-height' : '';
+    const boxClassName = `${autoHeightClass} ${className || ''}`.trim();
+    // Convert CodeBoxTab[] to BoxTab[] with Code as content (Box handles rendering)
+    const boxTabs = tabs?.map((tab) => ({
+        id: tab.id,
+        label: tab.label,
+        content: (_jsx(Code, { code: tab.code, language: tab.language ?? language, onChange: onChange, disabled: disabled, autoHeight: autoHeight, ...codeProps })),
+    }));
+    return (_jsx(Box, { header: boxHeader, headerActions: actions, showHeader: showHeader, tabs: boxTabs, defaultTab: defaultTab, activeTab: controlledActiveTab, onTabChange: handleTabChange, showTrafficLights: showTrafficLights, footer: footer, height: height, style: style, className: boxClassName, children: !tabs && (_jsx(Code, { code: code ?? '', language: language, onChange: onChange, disabled: disabled, autoHeight: autoHeight, ...codeProps })) }));
+}
+//# sourceMappingURL=code-box.js.map