@actabldesign/bellhop-core 0.0.3

package/components/bh-pie-chart.js

@@ -0,0 +1,194 @@
+import { p as proxyCustomElement, H, h, d as Host } from './p-9a7sQzad.js';
+import { d as defineCustomElement$2 } from './p-BLRNfy0t.js';
+
+const bhPieChartCss = "@import url('https://fonts.googleapis.com/css2?family=Inter:wght@400;500;600;700&display=swap'); @import url('https://fonts.googleapis.com/css2?family=Material+Symbols+Outlined:opsz,wght,FILL,GRAD@20..48,100..700,0..1,-50..200&display=swap'); :root{--color-white:hsl(0, 0%, 100%);--color-black:hsl(0, 0%, 0%);--color-transparent:hsla(0, 0%, 100%, 0);--color-neutral-25:hsl(240, 20%, 99%);--color-neutral-50:hsl(240, 20%, 98%);--color-neutral-100:hsl(240, 17%, 95%);--color-neutral-200:hsl(227, 25%, 89%);--color-neutral-300:hsl(224, 24%, 78%);--color-neutral-400:hsl(226, 24%, 59%);--color-neutral-500:hsl(226, 24%, 48%);--color-neutral-600:hsl(226, 24%, 38%);--color-neutral-700:hsl(226, 24%, 25%);--color-neutral-800:hsl(233, 33%, 10%);--color-neutral-900:hsl(231, 32%, 8%);--color-neutral-950:hsl(231, 32%, 8%);--color-brand-25:hsl(220, 82%, 98%);--color-brand-50:hsl(222, 87%, 97%);--color-brand-100:hsl(221, 94%, 94%);--color-brand-200:hsl(221, 92%, 86%);--color-brand-300:hsl(224, 95%, 77%);--color-brand-400:hsl(224, 94%, 72%);--color-brand-500:hsl(230, 67%, 58%);--color-brand-600:hsl(230, 69%, 48%);--color-brand-700:hsl(230, 75%, 34%);--color-brand-800:hsl(243, 86%, 44%);--color-brand-900:hsl(237, 69%, 24%);--color-brand-950:hsl(237, 61%, 20%);--color-error-25:hsl(12, 100%, 99%);--color-error-50:hsl(5, 86%, 97%);--color-error-100:hsl(4, 93%, 94%);--color-error-200:hsl(3, 96%, 89%);--color-error-300:hsl(4, 96%, 80%);--color-error-400:hsl(4, 92%, 69%);--color-error-500:hsl(4, 86%, 58%);--color-error-600:hsl(4, 74%, 49%);--color-error-700:hsl(4, 76%, 40%);--color-error-800:hsl(4, 72%, 33%);--color-error-900:hsl(8, 65%, 29%);--color-error-950:hsl(8, 75%, 19%);--color-warning-25:hsl(42, 100%, 98%);--color-warning-50:hsl(45, 100%, 96%);--color-warning-100:hsl(45, 96%, 89%);--color-warning-200:hsl(44, 98%, 77%);--color-warning-300:hsl(42, 99%, 65%);--color-warning-400:hsl(39, 98%, 56%);--color-warning-500:hsl(34, 94%, 50%);--color-warning-600:hsl(28, 97%, 44%);--color-warning-700:hsl(22, 92%, 37%);--color-warning-800:hsl(19, 84%, 31%);--color-warning-900:hsl(18, 79%, 27%);--color-warning-950:hsl(17, 79%, 17%);--color-success-25:hsl(142, 80%, 98%);--color-success-50:hsl(145, 81%, 96%);--color-success-100:hsl(140, 80%, 90%);--color-success-200:hsl(144, 78%, 80%);--color-success-300:hsl(148, 63%, 67%);--color-success-400:hsl(150, 57%, 54%);--color-success-500:hsl(152, 77%, 39%);--color-success-600:hsl(153, 91%, 30%);--color-success-700:hsl(155, 90%, 24%);--color-success-800:hsl(155, 84%, 20%);--color-success-900:hsl(156, 83%, 16%);--color-success-950:hsl(157, 82%, 11%);--font-inter:'Inter', ui-sans-serif, system-ui, -apple-system, 'Segoe UI',\n    Roboto, 'Helvetica Neue', Arial, 'Noto Sans', sans-serif;--font-mono:ui-monospace, SFMono-Regular, Menlo, Monaco, Consolas,\n    'Liberation Mono', 'Courier New', monospace;--weight-regular:400;--weight-medium:500;--weight-semibold:600;--weight-bold:700;--text-xl-size:1.25rem;--text-lg-size:1.125rem;--text-md-size:1rem;--text-sm-size:0.875rem;--text-xs-size:0.75rem;--text-xl-line:1.875rem;--text-lg-line:1.75rem;--text-md-line:1.5rem;--text-sm-line:1.25rem;--text-xs-line:1.125rem;--spacing-none:0rem;--spacing-xxs:0.125rem;--spacing-xs:0.25rem;--spacing-sm:0.375rem;--spacing-md:0.5rem;--spacing-lg:0.75rem;--spacing-xl:1rem;--spacing-2xl:1.25rem;--spacing-3xl:1.5rem;--spacing-4xl:2rem;--spacing-5xl:2.5rem;--spacing-6xl:3rem;--radius-none:0rem;--radius-xxs:0.125rem;--radius-xs:0.25rem;--radius-sm:0.375rem;--radius-md:0.5rem;--radius-lg:0.625rem;--radius-xl:0.75rem;--radius-2xl:1rem;--radius-3xl:1.25rem;--radius-4xl:1.5rem;--radius-full:9999px;--shadow-xs:0px 1px 2px rgba(16, 24, 40, 0.05);--shadow-sm:0px 1px 3px rgba(16, 24, 40, 0.1),\n    0px 1px 2px rgba(16, 24, 40, 0.06);--shadow-md:0px 4px 8px -2px rgba(16, 24, 40, 0.1),\n    0px 2px 4px -2px rgba(16, 24, 40, 0.06);--shadow-lg:0px 12px 16px -4px rgba(16, 24, 40, 0.08),\n    0px 4px 6px -2px rgba(16, 24, 40, 0.03);--shadow-xl:0px 20px 24px -4px rgba(16, 24, 40, 0.08),\n    0px 8px 8px -4px rgba(16, 24, 40, 0.03);--icon-compensation-xs-btn:calc(var(--spacing-lg) - var(--spacing-xs));--icon-compensation-sm-btn:calc(var(--spacing-xl) - var(--spacing-xs));--icon-compensation-md-btn:calc(var(--spacing-xl) - var(--spacing-xs));--icon-compensation-lg-btn:calc(var(--spacing-xl) - var(--spacing-xs))}*,*::before,*::after{box-sizing:border-box}.material-symbols-outlined{font-family:'Material Symbols Outlined';font-weight:normal;font-style:normal;font-size:24px;line-height:1;letter-spacing:normal;text-transform:none;display:inline-block;white-space:nowrap;word-wrap:normal;direction:ltr;font-feature-settings:'liga';-webkit-font-feature-settings:'liga';-webkit-font-smoothing:antialiased}:host{display:inline-block}.pie-chart-container{display:inline-block;width:160px;height:160px;overflow:visible}.pie-chart-svg{width:100%;height:100%;overflow:visible}.pie-segment{cursor:pointer;transition:opacity var(--animation-duration-fast, 0.1s) var(--animation-ease-smooth, ease);transform-origin:80px 80px}.pie-segment.animated{opacity:0;transform:scale(0.3) rotate(-180deg);animation:pieSliceReveal 0.8s var(--animation-ease-enter, ease-out) forwards}.pie-segment:hover{opacity:0.85;transform:scale(1.05);filter:brightness(1.1);transition:all var(--animation-duration-fast, 0.1s) var(--animation-ease-smooth, ease)}.pie-background{pointer-events:none}.pie-inner-hole{pointer-events:none}.pie-segment-group{pointer-events:auto}@keyframes pieSliceReveal{0%{opacity:0;transform:scale(0.3) rotate(-180deg)}15%{opacity:0.2;transform:scale(0.45) rotate(-135deg)}30%{opacity:0.5;transform:scale(0.7) rotate(-70deg)}45%{opacity:0.7;transform:scale(0.9) rotate(-25deg)}60%{opacity:0.85;transform:scale(1.05) rotate(-8deg)}80%{opacity:0.95;transform:scale(1.01) rotate(-1deg)}100%{opacity:1;transform:scale(1) rotate(0deg)}}@media (prefers-reduced-motion: reduce){.pie-segment.animated{animation:none;opacity:1;transform:none}}";
+
+const DEFAULT_COLORS = [
+    '#2642CF', // Blue
+    '#8E4B9B', // Purple
+    '#BB81BA', // Light Purple
+    '#E14C94', // Pink
+    '#E47789', // Coral
+    '#E9AAAE', // Light Coral
+    '#BACEFC', // Light Blue
+];
+const BhPieChart$1 = /*@__PURE__*/ proxyCustomElement(class BhPieChart extends H {
+    constructor(registerHost) {
+        super();
+        if (registerHost !== false) {
+            this.__registerHost();
+        }
+        this.__attachShadow();
+    }
+    /**
+     * Chart data containing series
+     */
+    data = {
+        series: [
+            { name: 'Series 1', value: 30, color: '#2642CF' },
+            { name: 'Series 2', value: 25, color: '#8E4B9B' },
+            { name: 'Series 3', value: 20, color: '#BB81BA' },
+            { name: 'Series 4', value: 15, color: '#E14C94' },
+            { name: 'Series 5', value: 10, color: '#E47789' },
+        ],
+    };
+    /**
+     * Size of the donut hole
+     */
+    hole = 'none';
+    /**
+     * Size of the chart in pixels
+     */
+    size = 160;
+    /**
+     * Whether to animate the chart
+     */
+    animated = true;
+    /**
+     * Gap between segments in degrees
+     */
+    gap = 0;
+    tooltipVisible = false;
+    tooltipX = 0;
+    tooltipY = 0;
+    tooltipSegment = null;
+    getInnerRadius() {
+        switch (this.hole) {
+            case '25%':
+                return 20;
+            case '50%':
+                return 40;
+            case '75%':
+                return 60;
+            case '85%':
+                return 68;
+            default:
+                return 0;
+        }
+    }
+    createArcPath(centerX, centerY, outerRadius, innerRadius, startAngle, endAngle) {
+        const startAngleRad = (startAngle * Math.PI) / 180;
+        const endAngleRad = (endAngle * Math.PI) / 180;
+        const outerStartX = centerX + outerRadius * Math.cos(startAngleRad);
+        const outerStartY = centerY + outerRadius * Math.sin(startAngleRad);
+        const outerEndX = centerX + outerRadius * Math.cos(endAngleRad);
+        const outerEndY = centerY + outerRadius * Math.sin(endAngleRad);
+        const largeArcFlag = endAngle - startAngle > 180 ? 1 : 0;
+        if (innerRadius === 0) {
+            return [
+                'M', centerX, centerY,
+                'L', outerStartX, outerStartY,
+                'A', outerRadius, outerRadius, 0, largeArcFlag, 1, outerEndX, outerEndY,
+                'Z',
+            ].join(' ');
+        }
+        else {
+            const innerStartX = centerX + innerRadius * Math.cos(startAngleRad);
+            const innerStartY = centerY + innerRadius * Math.sin(startAngleRad);
+            const innerEndX = centerX + innerRadius * Math.cos(endAngleRad);
+            const innerEndY = centerY + innerRadius * Math.sin(endAngleRad);
+            return [
+                'M', outerStartX, outerStartY,
+                'A', outerRadius, outerRadius, 0, largeArcFlag, 1, outerEndX, outerEndY,
+                'L', innerEndX, innerEndY,
+                'A', innerRadius, innerRadius, 0, largeArcFlag, 0, innerStartX, innerStartY,
+                'Z',
+            ].join(' ');
+        }
+    }
+    getSegments() {
+        if (!this.data.series?.length) {
+            return [];
+        }
+        const total = this.data.series.reduce((sum, item) => sum + item.value, 0);
+        if (total === 0) {
+            return [];
+        }
+        const segments = [];
+        let currentAngle = -90;
+        const radius = 80;
+        const centerX = 80;
+        const centerY = 80;
+        const innerRadius = this.getInnerRadius();
+        const totalGaps = this.data.series.length * this.gap;
+        const availableAngle = 360 - totalGaps;
+        this.data.series.forEach((item, index) => {
+            const percentage = (item.value / total) * 100;
+            const angleSize = (item.value / total) * availableAngle;
+            const startAngle = currentAngle;
+            const endAngle = currentAngle + angleSize;
+            const path = this.createArcPath(centerX, centerY, radius, innerRadius, startAngle, endAngle);
+            segments.push({
+                value: item.value,
+                percentage,
+                startAngle,
+                endAngle,
+                color: item.color || DEFAULT_COLORS[index % DEFAULT_COLORS.length],
+                name: item.name,
+                path,
+            });
+            currentAngle = endAngle + this.gap;
+        });
+        return segments;
+    }
+    handleSegmentHover = (event, segment) => {
+        this.tooltipVisible = true;
+        this.tooltipX = event.clientX;
+        this.tooltipY = event.clientY;
+        this.tooltipSegment = segment;
+    };
+    handleSegmentLeave = () => {
+        this.tooltipVisible = false;
+    };
+    render() {
+        const segments = this.getSegments();
+        const innerRadius = this.getInnerRadius();
+        return (h(Host, { key: '6e08d27c86b66d352cb0af60a7c53a50bbfdbb68' }, h("div", { key: '6ea7a66cc1294f69e2757f54ace875ebd08613ed', class: "pie-chart-container", style: { width: `${this.size}px`, height: `${this.size}px` } }, h("svg", { key: 'd777cd322d93bf0d419213b87729c2cb94346362', width: this.size, height: this.size, viewBox: "0 0 160 160", class: "pie-chart-svg" }, h("circle", { key: 'bb77a5913fb0d8a849d27bf1e854c1f1ae690c4d', cx: "80", cy: "80", r: "80", fill: "transparent", class: "pie-background" }), segments.map((segment, index) => (h("g", { key: index, class: "pie-segment-group" }, h("path", { d: segment.path, fill: segment.color, class: { 'pie-segment': true, animated: this.animated }, style: { animationDelay: this.animated ? `${index * 0.03}s` : '0s' }, onMouseEnter: (e) => this.handleSegmentHover(e, segment), onMouseLeave: this.handleSegmentLeave })))), this.hole !== 'none' && (h("circle", { key: '00e9cc73e53b04d9cee1df1bcdb2c7b1a2dad5b9', cx: "80", cy: "80", r: innerRadius, fill: "white", class: "pie-inner-hole" })))), h("bh-chart-tooltip", { key: 'a6c2652bf3c556ea6aaa5f8fcd2963abdc8322f6', visible: this.tooltipVisible, x: this.tooltipX, y: this.tooltipY, items: this.tooltipSegment
+                ? [
+                    {
+                        label: this.tooltipSegment.name,
+                        value: `${this.tooltipSegment.percentage.toFixed(0)}%`,
+                        color: this.tooltipSegment.color,
+                    },
+                ]
+                : [] })));
+    }
+    static get style() { return bhPieChartCss; }
+}, [769, "bh-pie-chart", {
+        "data": [16],
+        "hole": [1],
+        "size": [2],
+        "animated": [4],
+        "gap": [2],
+        "tooltipVisible": [32],
+        "tooltipX": [32],
+        "tooltipY": [32],
+        "tooltipSegment": [32]
+    }]);
+function defineCustomElement$1() {
+    if (typeof customElements === "undefined") {
+        return;
+    }
+    const components = ["bh-pie-chart", "bh-chart-tooltip"];
+    components.forEach(tagName => { switch (tagName) {
+        case "bh-pie-chart":
+            if (!customElements.get(tagName)) {
+                customElements.define(tagName, BhPieChart$1);
+            }
+            break;
+        case "bh-chart-tooltip":
+            if (!customElements.get(tagName)) {
+                defineCustomElement$2();
+            }
+            break;
+    } });
+}
+defineCustomElement$1();
+
+const BhPieChart = BhPieChart$1;
+const defineCustomElement = defineCustomElement$1;
+
+export { BhPieChart, defineCustomElement };
+//# sourceMappingURL=bh-pie-chart.js.map
+
+//# sourceMappingURL=bh-pie-chart.js.map

package/components/bh-pie-chart.js.map

@@ -0,0 +1 @@
+{"file":"bh-pie-chart.js","mappings":";;;AAAA,MAAM,aAAa,GAAG,00LAA00L;;ACwBh2L,MAAM,cAAc,GAAG;AACrB,IAAA,SAAS;AACT,IAAA,SAAS;AACT,IAAA,SAAS;AACT,IAAA,SAAS;AACT,IAAA,SAAS;AACT,IAAA,SAAS;AACT,IAAA,SAAS;CACV;MAOYA,YAAU,iBAAAC,kBAAA,CAAA,MAAA,UAAA,SAAAC,CAAA,CAAA;;;;;;;;AACrB;;AAEG;AACK,IAAA,IAAI,GAAiB;AAC3B,QAAA,MAAM,EAAE;YACN,EAAE,IAAI,EAAE,UAAU,EAAE,KAAK,EAAE,EAAE,EAAE,KAAK,EAAE,SAAS,EAAE;YACjD,EAAE,IAAI,EAAE,UAAU,EAAE,KAAK,EAAE,EAAE,EAAE,KAAK,EAAE,SAAS,EAAE;YACjD,EAAE,IAAI,EAAE,UAAU,EAAE,KAAK,EAAE,EAAE,EAAE,KAAK,EAAE,SAAS,EAAE;YACjD,EAAE,IAAI,EAAE,UAAU,EAAE,KAAK,EAAE,EAAE,EAAE,KAAK,EAAE,SAAS,EAAE;YACjD,EAAE,IAAI,EAAE,UAAU,EAAE,KAAK,EAAE,EAAE,EAAE,KAAK,EAAE,SAAS,EAAE;AAClD,SAAA;KACF;AAED;;AAEG;IACK,IAAI,GAAiB,MAAM;AAEnC;;AAEG;IACK,IAAI,GAAW,GAAG;AAE1B;;AAEG;IACK,QAAQ,GAAY,IAAI;AAEhC;;AAEG;IACK,GAAG,GAAW,CAAC;IAEd,cAAc,GAAY,KAAK;IAC/B,QAAQ,GAAW,CAAC;IACpB,QAAQ,GAAW,CAAC;IACpB,cAAc,GAAsB,IAAI;IAEzC,cAAc,GAAA;AACpB,QAAA,QAAQ,IAAI,CAAC,IAAI;AACf,YAAA,KAAK,KAAK;AACR,gBAAA,OAAO,EAAE;AACX,YAAA,KAAK,KAAK;AACR,gBAAA,OAAO,EAAE;AACX,YAAA,KAAK,KAAK;AACR,gBAAA,OAAO,EAAE;AACX,YAAA,KAAK,KAAK;AACR,gBAAA,OAAO,EAAE;AACX,YAAA;AACE,gBAAA,OAAO,CAAC;;;IAIN,aAAa,CACnB,OAAe,EACf,OAAe,EACf,WAAmB,EACnB,WAAmB,EACnB,UAAkB,EAClB,QAAgB,EAAA;QAEhB,MAAM,aAAa,GAAG,CAAC,UAAU,GAAG,IAAI,CAAC,EAAE,IAAI,GAAG;QAClD,MAAM,WAAW,GAAG,CAAC,QAAQ,GAAG,IAAI,CAAC,EAAE,IAAI,GAAG;AAE9C,QAAA,MAAM,WAAW,GAAG,OAAO,GAAG,WAAW,GAAG,IAAI,CAAC,GAAG,CAAC,aAAa,CAAC;AACnE,QAAA,MAAM,WAAW,GAAG,OAAO,GAAG,WAAW,GAAG,IAAI,CAAC,GAAG,CAAC,aAAa,CAAC;AACnE,QAAA,MAAM,SAAS,GAAG,OAAO,GAAG,WAAW,GAAG,IAAI,CAAC,GAAG,CAAC,WAAW,CAAC;AAC/D,QAAA,MAAM,SAAS,GAAG,OAAO,GAAG,WAAW,GAAG,IAAI,CAAC,GAAG,CAAC,WAAW,CAAC;AAE/D,QAAA,MAAM,YAAY,GAAG,QAAQ,GAAG,UAAU,GAAG,GAAG,GAAG,CAAC,GAAG,CAAC;AAExD,QAAA,IAAI,WAAW,KAAK,CAAC,EAAE;YACrB,OAAO;gBACL,GAAG,EAAE,OAAO,EAAE,OAAO;gBACrB,GAAG,EAAE,WAAW,EAAE,WAAW;AAC7B,gBAAA,GAAG,EAAE,WAAW,EAAE,WAAW,EAAE,CAAC,EAAE,YAAY,EAAE,CAAC,EAAE,SAAS,EAAE,SAAS;gBACvE,GAAG;AACJ,aAAA,CAAC,IAAI,CAAC,GAAG,CAAC;;aACN;AACL,YAAA,MAAM,WAAW,GAAG,OAAO,GAAG,WAAW,GAAG,IAAI,CAAC,GAAG,CAAC,aAAa,CAAC;AACnE,YAAA,MAAM,WAAW,GAAG,OAAO,GAAG,WAAW,GAAG,IAAI,CAAC,GAAG,CAAC,aAAa,CAAC;AACnE,YAAA,MAAM,SAAS,GAAG,OAAO,GAAG,WAAW,GAAG,IAAI,CAAC,GAAG,CAAC,WAAW,CAAC;AAC/D,YAAA,MAAM,SAAS,GAAG,OAAO,GAAG,WAAW,GAAG,IAAI,CAAC,GAAG,CAAC,WAAW,CAAC;YAE/D,OAAO;gBACL,GAAG,EAAE,WAAW,EAAE,WAAW;AAC7B,gBAAA,GAAG,EAAE,WAAW,EAAE,WAAW,EAAE,CAAC,EAAE,YAAY,EAAE,CAAC,EAAE,SAAS,EAAE,SAAS;gBACvE,GAAG,EAAE,SAAS,EAAE,SAAS;AACzB,gBAAA,GAAG,EAAE,WAAW,EAAE,WAAW,EAAE,CAAC,EAAE,YAAY,EAAE,CAAC,EAAE,WAAW,EAAE,WAAW;gBAC3E,GAAG;AACJ,aAAA,CAAC,IAAI,CAAC,GAAG,CAAC;;;IAIP,WAAW,GAAA;QACjB,IAAI,CAAC,IAAI,CAAC,IAAI,CAAC,MAAM,EAAE,MAAM,EAAE;AAC7B,YAAA,OAAO,EAAE;;QAGX,MAAM,KAAK,GAAG,IAAI,CAAC,IAAI,CAAC,MAAM,CAAC,MAAM,CAAC,CAAC,GAAG,EAAE,IAAI,KAAK,GAAG,GAAG,IAAI,CAAC,KAAK,EAAE,CAAC,CAAC;AACzE,QAAA,IAAI,KAAK,KAAK,CAAC,EAAE;AACf,YAAA,OAAO,EAAE;;QAGX,MAAM,QAAQ,GAAiB,EAAE;AACjC,QAAA,IAAI,YAAY,GAAG,GAAG;QACtB,MAAM,MAAM,GAAG,EAAE;QACjB,MAAM,OAAO,GAAG,EAAE;QAClB,MAAM,OAAO,GAAG,EAAE;AAClB,QAAA,MAAM,WAAW,GAAG,IAAI,CAAC,cAAc,EAAE;AAEzC,QAAA,MAAM,SAAS,GAAG,IAAI,CAAC,IAAI,CAAC,MAAM,CAAC,MAAM,GAAG,IAAI,CAAC,GAAG;AACpD,QAAA,MAAM,cAAc,GAAG,GAAG,GAAG,SAAS;AAEtC,QAAA,IAAI,CAAC,IAAI,CAAC,MAAM,CAAC,OAAO,CAAC,CAAC,IAAI,EAAE,KAAK,KAAI;YACvC,MAAM,UAAU,GAAG,CAAC,IAAI,CAAC,KAAK,GAAG,KAAK,IAAI,GAAG;YAC7C,MAAM,SAAS,GAAG,CAAC,IAAI,CAAC,KAAK,GAAG,KAAK,IAAI,cAAc;YACvD,MAAM,UAAU,GAAG,YAAY;AAC/B,YAAA,MAAM,QAAQ,GAAG,YAAY,GAAG,SAAS;AAEzC,YAAA,MAAM,IAAI,GAAG,IAAI,CAAC,aAAa,CAAC,OAAO,EAAE,OAAO,EAAE,MAAM,EAAE,WAAW,EAAE,UAAU,EAAE,QAAQ,CAAC;YAE5F,QAAQ,CAAC,IAAI,CAAC;gBACZ,KAAK,EAAE,IAAI,CAAC,KAAK;gBACjB,UAAU;gBACV,UAAU;gBACV,QAAQ;AACR,gBAAA,KAAK,EAAE,IAAI,CAAC,KAAK,IAAI,cAAc,CAAC,KAAK,GAAG,cAAc,CAAC,MAAM,CAAC;gBAClE,IAAI,EAAE,IAAI,CAAC,IAAI;gBACf,IAAI;AACL,aAAA,CAAC;AAEF,YAAA,YAAY,GAAG,QAAQ,GAAG,IAAI,CAAC,GAAG;AACpC,SAAC,CAAC;AAEF,QAAA,OAAO,QAAQ;;AAGT,IAAA,kBAAkB,GAAG,CAAC,KAAiB,EAAE,OAAmB,KAAI;AACtE,QAAA,IAAI,CAAC,cAAc,GAAG,IAAI;AAC1B,QAAA,IAAI,CAAC,QAAQ,GAAG,KAAK,CAAC,OAAO;AAC7B,QAAA,IAAI,CAAC,QAAQ,GAAG,KAAK,CAAC,OAAO;AAC7B,QAAA,IAAI,CAAC,cAAc,GAAG,OAAO;AAC/B,KAAC;IAEO,kBAAkB,GAAG,MAAK;AAChC,QAAA,IAAI,CAAC,cAAc,GAAG,KAAK;AAC7B,KAAC;IAED,MAAM,GAAA;AACJ,QAAA,MAAM,QAAQ,GAAG,IAAI,CAAC,WAAW,EAAE;AACnC,QAAA,MAAM,WAAW,GAAG,IAAI,CAAC,cAAc,EAAE;AAEzC,QAAA,QACE,EAAC,IAAI,EAAA,EAAA,GAAA,EAAA,0CAAA,EAAA,EACH,CAAK,CAAA,KAAA,EAAA,EAAA,GAAA,EAAA,0CAAA,EAAA,KAAK,EAAC,qBAAqB,EAAC,KAAK,EAAE,EAAE,KAAK,EAAE,CAAG,EAAA,IAAI,CAAC,IAAI,CAAA,EAAA,CAAI,EAAE,MAAM,EAAE,CAAA,EAAG,IAAI,CAAC,IAAI,CAAI,EAAA,CAAA,EAAE,EAAA,EAC3F,CAAA,CAAA,KAAA,EAAA,EAAA,GAAA,EAAA,0CAAA,EACE,KAAK,EAAE,IAAI,CAAC,IAAI,EAChB,MAAM,EAAE,IAAI,CAAC,IAAI,EACjB,OAAO,EAAC,aAAa,EACrB,KAAK,EAAC,eAAe,EAAA,EAGrB,CAAA,CAAA,QAAA,EAAA,EAAA,GAAA,EAAA,0CAAA,EAAQ,EAAE,EAAC,IAAI,EAAC,EAAE,EAAC,IAAI,EAAC,CAAC,EAAC,IAAI,EAAC,IAAI,EAAC,aAAa,EAAC,KAAK,EAAC,gBAAgB,EAAG,CAAA,EAG1E,QAAQ,CAAC,GAAG,CAAC,CAAC,OAAO,EAAE,KAAK,MAC3B,SAAG,GAAG,EAAE,KAAK,EAAE,KAAK,EAAC,mBAAmB,EAAA,EACtC,CAAA,CAAA,MAAA,EAAA,EACE,CAAC,EAAE,OAAO,CAAC,IAAI,EACf,IAAI,EAAE,OAAO,CAAC,KAAK,EACnB,KAAK,EAAE,EAAE,aAAa,EAAE,IAAI,EAAE,QAAQ,EAAE,IAAI,CAAC,QAAQ,EAAE,EACvD,KAAK,EAAE,EAAE,cAAc,EAAE,IAAI,CAAC,QAAQ,GAAG,CAAA,EAAG,KAAK,GAAG,IAAI,CAAG,CAAA,CAAA,GAAG,IAAI,EAAE,EACpE,YAAY,EAAE,CAAC,CAAC,KAAK,IAAI,CAAC,kBAAkB,CAAC,CAAC,EAAE,OAAO,CAAC,EACxD,YAAY,EAAE,IAAI,CAAC,kBAAkB,EACrC,CAAA,CACA,CACL,CAAC,EAGD,IAAI,CAAC,IAAI,KAAK,MAAM,KACnB,CAAQ,CAAA,QAAA,EAAA,EAAA,GAAA,EAAA,0CAAA,EAAA,EAAE,EAAC,IAAI,EAAC,EAAE,EAAC,IAAI,EAAC,CAAC,EAAE,WAAW,EAAE,IAAI,EAAC,OAAO,EAAC,KAAK,EAAC,gBAAgB,EAAG,CAAA,CAC/E,CACG,CACF,EAGN,CACE,CAAA,kBAAA,EAAA,EAAA,GAAA,EAAA,0CAAA,EAAA,OAAO,EAAE,IAAI,CAAC,cAAc,EAC5B,CAAC,EAAE,IAAI,CAAC,QAAQ,EAChB,CAAC,EAAE,IAAI,CAAC,QAAQ,EAChB,KAAK,EACH,IAAI,CAAC;AACH,kBAAE;AACE,oBAAA;AACE,wBAAA,KAAK,EAAE,IAAI,CAAC,cAAc,CAAC,IAAI;AAC/B,wBAAA,KAAK,EAAE,CAAA,EAAG,IAAI,CAAC,cAAc,CAAC,UAAU,CAAC,OAAO,CAAC,CAAC,CAAC,CAAG,CAAA,CAAA;AACtD,wBAAA,KAAK,EAAE,IAAI,CAAC,cAAc,CAAC,KAAK;AACjC,qBAAA;AACF;AACH,kBAAE,EAAE,EAER,CAAA,CACG;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;","names":["BhPieChart","__stencil_proxyCustomElement","HTMLElement"],"sources":["src/components/bh-pie-chart/bh-pie-chart.css?tag=bh-pie-chart&encapsulation=shadow","src/components/bh-pie-chart/bh-pie-chart.tsx"],"sourcesContent":["@import '../../global/global.css';\n\n:host {\n  display: inline-block;\n}\n\n.pie-chart-container {\n  display: inline-block;\n  width: 160px;\n  height: 160px;\n  overflow: visible;\n}\n\n.pie-chart-svg {\n  width: 100%;\n  height: 100%;\n  overflow: visible;\n}\n\n.pie-segment {\n  cursor: pointer;\n  transition: opacity var(--animation-duration-fast, 0.1s) var(--animation-ease-smooth, ease);\n  transform-origin: 80px 80px;\n}\n\n.pie-segment.animated {\n  opacity: 0;\n  transform: scale(0.3) rotate(-180deg);\n  animation: pieSliceReveal 0.8s var(--animation-ease-enter, ease-out) forwards;\n}\n\n.pie-segment:hover {\n  opacity: 0.85;\n  transform: scale(1.05);\n  filter: brightness(1.1);\n  transition: all var(--animation-duration-fast, 0.1s) var(--animation-ease-smooth, ease);\n}\n\n.pie-background {\n  pointer-events: none;\n}\n\n.pie-inner-hole {\n  pointer-events: none;\n}\n\n.pie-segment-group {\n  pointer-events: auto;\n}\n\n@keyframes pieSliceReveal {\n  0% {\n    opacity: 0;\n    transform: scale(0.3) rotate(-180deg);\n  }\n  15% {\n    opacity: 0.2;\n    transform: scale(0.45) rotate(-135deg);\n  }\n  30% {\n    opacity: 0.5;\n    transform: scale(0.7) rotate(-70deg);\n  }\n  45% {\n    opacity: 0.7;\n    transform: scale(0.9) rotate(-25deg);\n  }\n  60% {\n    opacity: 0.85;\n    transform: scale(1.05) rotate(-8deg);\n  }\n  80% {\n    opacity: 0.95;\n    transform: scale(1.01) rotate(-1deg);\n  }\n  100% {\n    opacity: 1;\n    transform: scale(1) rotate(0deg);\n  }\n}\n\n@media (prefers-reduced-motion: reduce) {\n  .pie-segment.animated {\n    animation: none;\n    opacity: 1;\n    transform: none;\n  }\n}\n","import { Component, Prop, State, h, Host } from '@stencil/core';\n\nexport interface PieChartSeriesItem {\n  name: string;\n  value: number;\n  color?: string;\n}\n\nexport interface PieChartData {\n  series: PieChartSeriesItem[];\n}\n\nexport interface PieSegment {\n  value: number;\n  percentage: number;\n  startAngle: number;\n  endAngle: number;\n  color: string;\n  name: string;\n  path: string;\n}\n\nexport type PieChartHole = 'none' | '25%' | '50%' | '75%' | '85%';\n\nconst DEFAULT_COLORS = [\n  '#2642CF', // Blue\n  '#8E4B9B', // Purple\n  '#BB81BA', // Light Purple\n  '#E14C94', // Pink\n  '#E47789', // Coral\n  '#E9AAAE', // Light Coral\n  '#BACEFC', // Light Blue\n];\n\n@Component({\n  tag: 'bh-pie-chart',\n  styleUrl: 'bh-pie-chart.css',\n  shadow: true,\n})\nexport class BhPieChart {\n  /**\n   * Chart data containing series\n   */\n  @Prop() data: PieChartData = {\n    series: [\n      { name: 'Series 1', value: 30, color: '#2642CF' },\n      { name: 'Series 2', value: 25, color: '#8E4B9B' },\n      { name: 'Series 3', value: 20, color: '#BB81BA' },\n      { name: 'Series 4', value: 15, color: '#E14C94' },\n      { name: 'Series 5', value: 10, color: '#E47789' },\n    ],\n  };\n\n  /**\n   * Size of the donut hole\n   */\n  @Prop() hole: PieChartHole = 'none';\n\n  /**\n   * Size of the chart in pixels\n   */\n  @Prop() size: number = 160;\n\n  /**\n   * Whether to animate the chart\n   */\n  @Prop() animated: boolean = true;\n\n  /**\n   * Gap between segments in degrees\n   */\n  @Prop() gap: number = 0;\n\n  @State() tooltipVisible: boolean = false;\n  @State() tooltipX: number = 0;\n  @State() tooltipY: number = 0;\n  @State() tooltipSegment: PieSegment | null = null;\n\n  private getInnerRadius(): number {\n    switch (this.hole) {\n      case '25%':\n        return 20;\n      case '50%':\n        return 40;\n      case '75%':\n        return 60;\n      case '85%':\n        return 68;\n      default:\n        return 0;\n    }\n  }\n\n  private createArcPath(\n    centerX: number,\n    centerY: number,\n    outerRadius: number,\n    innerRadius: number,\n    startAngle: number,\n    endAngle: number\n  ): string {\n    const startAngleRad = (startAngle * Math.PI) / 180;\n    const endAngleRad = (endAngle * Math.PI) / 180;\n\n    const outerStartX = centerX + outerRadius * Math.cos(startAngleRad);\n    const outerStartY = centerY + outerRadius * Math.sin(startAngleRad);\n    const outerEndX = centerX + outerRadius * Math.cos(endAngleRad);\n    const outerEndY = centerY + outerRadius * Math.sin(endAngleRad);\n\n    const largeArcFlag = endAngle - startAngle > 180 ? 1 : 0;\n\n    if (innerRadius === 0) {\n      return [\n        'M', centerX, centerY,\n        'L', outerStartX, outerStartY,\n        'A', outerRadius, outerRadius, 0, largeArcFlag, 1, outerEndX, outerEndY,\n        'Z',\n      ].join(' ');\n    } else {\n      const innerStartX = centerX + innerRadius * Math.cos(startAngleRad);\n      const innerStartY = centerY + innerRadius * Math.sin(startAngleRad);\n      const innerEndX = centerX + innerRadius * Math.cos(endAngleRad);\n      const innerEndY = centerY + innerRadius * Math.sin(endAngleRad);\n\n      return [\n        'M', outerStartX, outerStartY,\n        'A', outerRadius, outerRadius, 0, largeArcFlag, 1, outerEndX, outerEndY,\n        'L', innerEndX, innerEndY,\n        'A', innerRadius, innerRadius, 0, largeArcFlag, 0, innerStartX, innerStartY,\n        'Z',\n      ].join(' ');\n    }\n  }\n\n  private getSegments(): PieSegment[] {\n    if (!this.data.series?.length) {\n      return [];\n    }\n\n    const total = this.data.series.reduce((sum, item) => sum + item.value, 0);\n    if (total === 0) {\n      return [];\n    }\n\n    const segments: PieSegment[] = [];\n    let currentAngle = -90;\n    const radius = 80;\n    const centerX = 80;\n    const centerY = 80;\n    const innerRadius = this.getInnerRadius();\n\n    const totalGaps = this.data.series.length * this.gap;\n    const availableAngle = 360 - totalGaps;\n\n    this.data.series.forEach((item, index) => {\n      const percentage = (item.value / total) * 100;\n      const angleSize = (item.value / total) * availableAngle;\n      const startAngle = currentAngle;\n      const endAngle = currentAngle + angleSize;\n\n      const path = this.createArcPath(centerX, centerY, radius, innerRadius, startAngle, endAngle);\n\n      segments.push({\n        value: item.value,\n        percentage,\n        startAngle,\n        endAngle,\n        color: item.color || DEFAULT_COLORS[index % DEFAULT_COLORS.length],\n        name: item.name,\n        path,\n      });\n\n      currentAngle = endAngle + this.gap;\n    });\n\n    return segments;\n  }\n\n  private handleSegmentHover = (event: MouseEvent, segment: PieSegment) => {\n    this.tooltipVisible = true;\n    this.tooltipX = event.clientX;\n    this.tooltipY = event.clientY;\n    this.tooltipSegment = segment;\n  };\n\n  private handleSegmentLeave = () => {\n    this.tooltipVisible = false;\n  };\n\n  render() {\n    const segments = this.getSegments();\n    const innerRadius = this.getInnerRadius();\n\n    return (\n      <Host>\n        <div class=\"pie-chart-container\" style={{ width: `${this.size}px`, height: `${this.size}px` }}>\n          <svg\n            width={this.size}\n            height={this.size}\n            viewBox=\"0 0 160 160\"\n            class=\"pie-chart-svg\"\n          >\n            {/* Background circle */}\n            <circle cx=\"80\" cy=\"80\" r=\"80\" fill=\"transparent\" class=\"pie-background\" />\n\n            {/* Pie segments */}\n            {segments.map((segment, index) => (\n              <g key={index} class=\"pie-segment-group\">\n                <path\n                  d={segment.path}\n                  fill={segment.color}\n                  class={{ 'pie-segment': true, animated: this.animated }}\n                  style={{ animationDelay: this.animated ? `${index * 0.03}s` : '0s' }}\n                  onMouseEnter={(e) => this.handleSegmentHover(e, segment)}\n                  onMouseLeave={this.handleSegmentLeave}\n                />\n              </g>\n            ))}\n\n            {/* Inner hole for donut charts */}\n            {this.hole !== 'none' && (\n              <circle cx=\"80\" cy=\"80\" r={innerRadius} fill=\"white\" class=\"pie-inner-hole\" />\n            )}\n          </svg>\n        </div>\n\n        {/* Tooltip */}\n        <bh-chart-tooltip\n          visible={this.tooltipVisible}\n          x={this.tooltipX}\n          y={this.tooltipY}\n          items={\n            this.tooltipSegment\n              ? [\n                  {\n                    label: this.tooltipSegment.name,\n                    value: `${this.tooltipSegment.percentage.toFixed(0)}%`,\n                    color: this.tooltipSegment.color,\n                  },\n                ]\n              : []\n          }\n        />\n      </Host>\n    );\n  }\n}\n"],"version":3}

package/components/bh-popover.d.ts

@@ -0,0 +1,11 @@
+import type { Components, JSX } from "../types/components";
+
+interface BhPopover extends Components.BhPopover, HTMLElement {}
+export const BhPopover: {
+    prototype: BhPopover;
+    new (): BhPopover;
+};
+/**
+ * Used to define this component and all nested components recursively.
+ */
+export const defineCustomElement: () => void;

package/components/bh-popover.js

@@ -0,0 +1,131 @@
+import { p as proxyCustomElement, H, c as createEvent, h, d as Host } from './p-9a7sQzad.js';
+
+const bhPopoverCss = ".popover{position:relative;border-radius:var(--radius-md);width:320px}.popover-content{display:flex;flex-direction:column;align-items:flex-start;justify-content:flex-start;overflow:hidden;position:relative;width:100%;height:100%}.popover-menu{background-color:#ffffff;display:flex;flex-direction:column;align-items:flex-start;justify-content:flex-start;overflow:hidden;position:relative;border-radius:var(--radius-md);flex-shrink:0;width:100%;max-height:400px;border:1px solid #dcdfea;box-shadow:var(--shadow-popover)}.popover-header{box-sizing:border-box;display:flex;flex-direction:column;align-items:flex-start;justify-content:flex-start;padding:var(--spacing-lg) var(--spacing-xl);position:relative;flex-shrink:0;width:100%;border-bottom:1px solid #dcdfea}.avatar-group{display:flex;gap:var(--spacing-lg);align-items:center;justify-content:flex-start;position:relative;flex-shrink:0;width:100%}.avatar{background-color:#ffffff;position:relative;border-radius:var(--radius-full);flex-shrink:0;width:40px;height:40px;border:0.75px solid rgba(0, 0, 0, 0.08);overflow:hidden;display:flex;align-items:center;justify-content:center}.avatar-image{width:100%;height:100%;object-fit:cover}.brand-info{flex-basis:0;display:flex;flex-direction:column;flex-grow:1;align-items:flex-start;justify-content:flex-start;line-height:0;min-height:1px;min-width:1px;position:relative;flex-shrink:0}.brand-name{font-family:var(--font-inter);font-weight:600;position:relative;flex-shrink:0;color:#404968;font-size:14px;line-height:20px;width:100%;text-overflow:ellipsis;overflow:hidden;white-space:nowrap}.portfolio-link{font-family:var(--font-inter);font-weight:400;position:relative;flex-shrink:0;color:#2642cf;font-size:14px;line-height:20px;width:100%;text-decoration:underline;text-decoration-skip-ink:none;text-underline-position:from-font;background:none;border:none;cursor:pointer;text-align:left;padding:0}.portfolio-link:hover{color:#1a2bb8}.search-container{box-sizing:border-box;display:flex;flex-direction:column;gap:6px;align-items:center;justify-content:center;overflow:visible;padding:0;position:relative;flex-shrink:0;width:100%}.search-input{display:flex;flex-direction:column;gap:var(--spacing-sm);padding:var(--spacing-xs) var(--spacing-none) var(--spacing-none) var(--spacing-lg);align-items:flex-start;justify-content:flex-start;position:relative;flex-shrink:0;width:100%}.search-content{background-color:#ffffff;box-sizing:border-box;display:flex;gap:var(--spacing-md);height:var(--spacing-4xl);align-items:center;justify-content:flex-start;overflow:hidden;padding:var(--spacing-none);position:relative;border-radius:var(--radius-md);flex-shrink:0;width:100%;border:none}.search-icon{width:20px;height:20px;flex-shrink:0;color:#5d6b98}.search-field{flex-basis:0;font-family:var(--font-inter);font-weight:500;flex-grow:1;line-height:0;min-height:1px;min-width:1px;overflow:hidden;text-overflow:ellipsis;position:relative;flex-shrink:0;color:#404968;font-size:14px;line-height:20px;white-space:nowrap;border:none;outline:none;background:none}.search-field::placeholder{color:#5d6b98}.menu-items{box-sizing:border-box;display:flex;flex-direction:column;align-items:flex-start;justify-content:flex-start;overflow-y:auto;padding:var(--spacing-xs) var(--spacing-none);position:relative;flex-grow:1;width:100%;max-height:calc(400px - 180px)}.menu-header{box-sizing:border-box;display:flex;flex-direction:column;align-items:flex-start;justify-content:flex-start;padding:var(--spacing-lg) var(--spacing-xl);position:relative;flex-shrink:0;width:100%;border-top:1px solid #dcdfea;border-bottom:1px solid #dcdfea;font-family:var(--font-inter);font-weight:600;line-height:0;color:#404968;font-size:14px;line-height:20px}.menu-item-container{box-sizing:border-box;display:flex;align-items:center;justify-content:flex-start;padding:var(--spacing-xxs) var(--spacing-sm);position:relative;flex-shrink:0;width:100%}.menu-item{flex-basis:0;box-sizing:border-box;display:flex;flex-grow:1;align-items:center;justify-content:flex-start;min-height:1px;min-width:1px;overflow:hidden;padding:var(--spacing-md) var(--spacing-lg);position:relative;border-radius:var(--radius-sm);flex-shrink:0;font-family:var(--font-inter);font-weight:500;line-height:0;color:#404968;font-size:14px;line-height:20px;background:none;border:none;cursor:pointer;text-align:left;width:100%;transition:all 0.2s ease}.menu-item:hover{background-color:#f9f9fb;color:#30374f}.menu-item.selected{background-color:#f9f9fb;color:#30374f}.menu-item-portfolio{font-weight:600;color:#2642cf}.menu-item-portfolio:hover{color:#1a2bb8}.menu-item-region{font-weight:500;padding-left:26px;color:#404968;font-size:13px}.menu-item-property{color:#5d6b98;font-size:13px}";
+
+const BhPopover$1 = /*@__PURE__*/ proxyCustomElement(class BhPopover extends H {
+    constructor(registerHost) {
+        super();
+        if (registerHost !== false) {
+            this.__registerHost();
+        }
+        this.__attachShadow();
+        this.bhItemSelect = createEvent(this, "bhItemSelect");
+        this.bhPortfolioClick = createEvent(this, "bhPortfolioClick");
+        this.bhSearchChange = createEvent(this, "bhSearchChange");
+    }
+    /**
+     * Title displayed in the header
+     */
+    popoverTitle = 'Brand Name';
+    /**
+     * Text for the portfolio link
+     */
+    viewPortfolioText = 'view portfolio';
+    /**
+     * Placeholder text for search input
+     */
+    searchPlaceholder = 'Search by name or region';
+    /**
+     * Width of the popover
+     */
+    width = '240px';
+    /**
+     * Whether to show search input
+     */
+    showSearch = true;
+    /**
+     * Whether to show avatar section
+     */
+    showAvatar = true;
+    /**
+     * Avatar image source URL
+     */
+    avatarSrc;
+    /**
+     * Menu items array (JSON string or array)
+     */
+    items = [];
+    searchTerm = '';
+    /**
+     * Event emitted when a menu item is selected
+     */
+    bhItemSelect;
+    /**
+     * Event emitted when portfolio link is clicked
+     */
+    bhPortfolioClick;
+    /**
+     * Event emitted when search input changes
+     */
+    bhSearchChange;
+    get parsedItems() {
+        if (typeof this.items === 'string') {
+            try {
+                return JSON.parse(this.items);
+            }
+            catch {
+                return [];
+            }
+        }
+        return this.items || [];
+    }
+    handleItemClick = (item) => {
+        if (item.type !== 'header') {
+            this.bhItemSelect.emit(item);
+        }
+    };
+    handlePortfolioClick = () => {
+        this.bhPortfolioClick.emit();
+    };
+    handleSearchInput = (event) => {
+        const target = event.target;
+        this.searchTerm = target.value;
+        this.bhSearchChange.emit(this.searchTerm);
+    };
+    getItemClasses(item) {
+        return {
+            'menu-item': true,
+            'selected': !!item.selected,
+            'menu-item-portfolio': item.type === 'portfolio',
+            'menu-item-region': item.type === 'region',
+            'menu-item-property': item.type === 'property',
+        };
+    }
+    render() {
+        const items = this.parsedItems;
+        return (h(Host, { key: 'a7558db0c7b23e4ec142ec3ec5e37e5e43ecaf3c' }, h("div", { key: '096623edfec8b24ce671855023676ba9e724141c', class: "popover", style: { width: this.width } }, h("div", { key: '901ff94955110af56d627e145784771975b3b5f8', class: "popover-content" }, h("div", { key: '0948fe57cdbbed592c5f93e8b12536c501cd5e27', class: "popover-menu" }, this.showAvatar && (h("div", { key: '6d0cb4e23fc4ceda1dd68b5d89216c6e50c4c18a', class: "popover-header" }, h("div", { key: '9411bf1f7ada776fe571db95648bb0805e627ede', class: "avatar-group" }, h("div", { key: '5408e5fd2506587cc6fd4899f83094441101dfc3', class: "avatar" }, this.avatarSrc ? (h("img", { src: this.avatarSrc, alt: this.popoverTitle, class: "avatar-image" })) : (h("slot", { name: "avatar" }))), h("div", { key: '9b30791b5bb664c7fcdcf10799b133fa649da830', class: "brand-info" }, h("div", { key: 'cc2304d4e9189485ac3e7f7f7a7bf3b321f99f16', class: "brand-name" }, this.popoverTitle), this.viewPortfolioText && (h("button", { key: 'b3b002ebf605618453618cfdb773c35b3355011a', class: "portfolio-link", onClick: this.handlePortfolioClick, type: "button" }, this.viewPortfolioText)))))), this.showSearch && (h("div", { key: '04798ef99a65da73afbe794250a11dec659868ed', class: "search-container" }, h("div", { key: 'e90f1d2137036da8ba4ad8b02d747892958164c3', class: "search-input" }, h("div", { key: '0efa8b359b1b523c2afd3dc26aa86ce3c86c38f7', class: "search-content" }, h("span", { key: '90d4054abc0c3bb758b3a43b0e21835609ac3b5e', class: "material-symbols-outlined search-icon" }, "search"), h("input", { key: 'abfd05266b12e5599ff3d7c3c79af659e5085584', type: "text", placeholder: this.searchPlaceholder, value: this.searchTerm, onInput: this.handleSearchInput, class: "search-field" }))))), h("div", { key: '82906cd547356049aa9a7541b89152e1a8268cb5', class: "menu-items" }, items.map((item) => (h("div", { key: item.id }, item.type === 'header' && (h("div", { class: "menu-header" }, item.label)), item.type !== 'header' && (h("div", { class: "menu-item-container" }, h("button", { class: this.getItemClasses(item), onClick: () => this.handleItemClick(item), type: "button" }, item.label))))))))))));
+    }
+    static get style() { return bhPopoverCss; }
+}, [769, "bh-popover", {
+        "popoverTitle": [1, "popover-title"],
+        "viewPortfolioText": [1, "view-portfolio-text"],
+        "searchPlaceholder": [1, "search-placeholder"],
+        "width": [1],
+        "showSearch": [4, "show-search"],
+        "showAvatar": [4, "show-avatar"],
+        "avatarSrc": [1, "avatar-src"],
+        "items": [1],
+        "searchTerm": [32]
+    }]);
+function defineCustomElement$1() {
+    if (typeof customElements === "undefined") {
+        return;
+    }
+    const components = ["bh-popover"];
+    components.forEach(tagName => { switch (tagName) {
+        case "bh-popover":
+            if (!customElements.get(tagName)) {
+                customElements.define(tagName, BhPopover$1);
+            }
+            break;
+    } });
+}
+defineCustomElement$1();
+
+const BhPopover = BhPopover$1;
+const defineCustomElement = defineCustomElement$1;
+
+export { BhPopover, defineCustomElement };
+//# sourceMappingURL=bh-popover.js.map
+
+//# sourceMappingURL=bh-popover.js.map

package/components/bh-popover.js.map

@@ -0,0 +1 @@
+{"file":"bh-popover.js","mappings":"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","names":["BhPopover","__stencil_proxyCustomElement","HTMLElement"],"sources":["src/components/bh-popover/bh-popover.css?tag=bh-popover&encapsulation=shadow","src/components/bh-popover/bh-popover.tsx"],"sourcesContent":["/* Popover Container */\n.popover {\n  position: relative;\n  border-radius: var(--radius-md);\n  width: 320px;\n}\n\n.popover-content {\n  display: flex;\n  flex-direction: column;\n  align-items: flex-start;\n  justify-content: flex-start;\n  overflow: hidden;\n  position: relative;\n  width: 100%;\n  height: 100%;\n}\n\n.popover-menu {\n  background-color: #ffffff;\n  display: flex;\n  flex-direction: column;\n  align-items: flex-start;\n  justify-content: flex-start;\n  overflow: hidden;\n  position: relative;\n  border-radius: var(--radius-md);\n  flex-shrink: 0;\n  width: 100%;\n  max-height: 400px;\n  border: 1px solid #dcdfea;\n  box-shadow: var(--shadow-popover);\n}\n\n/* Header */\n.popover-header {\n  box-sizing: border-box;\n  display: flex;\n  flex-direction: column;\n  align-items: flex-start;\n  justify-content: flex-start;\n  padding: var(--spacing-lg) var(--spacing-xl);\n  position: relative;\n  flex-shrink: 0;\n  width: 100%;\n  border-bottom: 1px solid #dcdfea;\n}\n\n.avatar-group {\n  display: flex;\n  gap: var(--spacing-lg);\n  align-items: center;\n  justify-content: flex-start;\n  position: relative;\n  flex-shrink: 0;\n  width: 100%;\n}\n\n.avatar {\n  background-color: #ffffff;\n  position: relative;\n  border-radius: var(--radius-full);\n  flex-shrink: 0;\n  width: 40px;\n  height: 40px;\n  border: 0.75px solid rgba(0, 0, 0, 0.08);\n  overflow: hidden;\n  display: flex;\n  align-items: center;\n  justify-content: center;\n}\n\n.avatar-image {\n  width: 100%;\n  height: 100%;\n  object-fit: cover;\n}\n\n.brand-info {\n  flex-basis: 0;\n  display: flex;\n  flex-direction: column;\n  flex-grow: 1;\n  align-items: flex-start;\n  justify-content: flex-start;\n  line-height: 0;\n  min-height: 1px;\n  min-width: 1px;\n  position: relative;\n  flex-shrink: 0;\n}\n\n.brand-name {\n  font-family: var(--font-inter);\n  font-weight: 600;\n  position: relative;\n  flex-shrink: 0;\n  color: #404968;\n  font-size: 14px;\n  line-height: 20px;\n  width: 100%;\n  text-overflow: ellipsis;\n  overflow: hidden;\n  white-space: nowrap;\n}\n\n.portfolio-link {\n  font-family: var(--font-inter);\n  font-weight: 400;\n  position: relative;\n  flex-shrink: 0;\n  color: #2642cf;\n  font-size: 14px;\n  line-height: 20px;\n  width: 100%;\n  text-decoration: underline;\n  text-decoration-skip-ink: none;\n  text-underline-position: from-font;\n  background: none;\n  border: none;\n  cursor: pointer;\n  text-align: left;\n  padding: 0;\n}\n\n.portfolio-link:hover {\n  color: #1a2bb8;\n}\n\n/* Search Container */\n.search-container {\n  box-sizing: border-box;\n  display: flex;\n  flex-direction: column;\n  gap: 6px;\n  align-items: center;\n  justify-content: center;\n  overflow: visible;\n  padding: 0;\n  position: relative;\n  flex-shrink: 0;\n  width: 100%;\n}\n\n.search-input {\n  display: flex;\n  flex-direction: column;\n  gap: var(--spacing-sm);\n  padding: var(--spacing-xs) var(--spacing-none) var(--spacing-none) var(--spacing-lg);\n  align-items: flex-start;\n  justify-content: flex-start;\n  position: relative;\n  flex-shrink: 0;\n  width: 100%;\n}\n\n.search-content {\n  background-color: #ffffff;\n  box-sizing: border-box;\n  display: flex;\n  gap: var(--spacing-md);\n  height: var(--spacing-4xl);\n  align-items: center;\n  justify-content: flex-start;\n  overflow: hidden;\n  padding: var(--spacing-none);\n  position: relative;\n  border-radius: var(--radius-md);\n  flex-shrink: 0;\n  width: 100%;\n  border: none;\n}\n\n.search-icon {\n  width: 20px;\n  height: 20px;\n  flex-shrink: 0;\n  color: #5d6b98;\n}\n\n.search-field {\n  flex-basis: 0;\n  font-family: var(--font-inter);\n  font-weight: 500;\n  flex-grow: 1;\n  line-height: 0;\n  min-height: 1px;\n  min-width: 1px;\n  overflow: hidden;\n  text-overflow: ellipsis;\n  position: relative;\n  flex-shrink: 0;\n  color: #404968;\n  font-size: 14px;\n  line-height: 20px;\n  white-space: nowrap;\n  border: none;\n  outline: none;\n  background: none;\n}\n\n.search-field::placeholder {\n  color: #5d6b98;\n}\n\n/* Menu Items */\n.menu-items {\n  box-sizing: border-box;\n  display: flex;\n  flex-direction: column;\n  align-items: flex-start;\n  justify-content: flex-start;\n  overflow-y: auto;\n  padding: var(--spacing-xs) var(--spacing-none);\n  position: relative;\n  flex-grow: 1;\n  width: 100%;\n  max-height: calc(400px - 180px);\n}\n\n.menu-header {\n  box-sizing: border-box;\n  display: flex;\n  flex-direction: column;\n  align-items: flex-start;\n  justify-content: flex-start;\n  padding: var(--spacing-lg) var(--spacing-xl);\n  position: relative;\n  flex-shrink: 0;\n  width: 100%;\n  border-top: 1px solid #dcdfea;\n  border-bottom: 1px solid #dcdfea;\n  font-family: var(--font-inter);\n  font-weight: 600;\n  line-height: 0;\n  color: #404968;\n  font-size: 14px;\n  line-height: 20px;\n}\n\n.menu-item-container {\n  box-sizing: border-box;\n  display: flex;\n  align-items: center;\n  justify-content: flex-start;\n  padding: var(--spacing-xxs) var(--spacing-sm);\n  position: relative;\n  flex-shrink: 0;\n  width: 100%;\n}\n\n.menu-item {\n  flex-basis: 0;\n  box-sizing: border-box;\n  display: flex;\n  flex-grow: 1;\n  align-items: center;\n  justify-content: flex-start;\n  min-height: 1px;\n  min-width: 1px;\n  overflow: hidden;\n  padding: var(--spacing-md) var(--spacing-lg);\n  position: relative;\n  border-radius: var(--radius-sm);\n  flex-shrink: 0;\n  font-family: var(--font-inter);\n  font-weight: 500;\n  line-height: 0;\n  color: #404968;\n  font-size: 14px;\n  line-height: 20px;\n  background: none;\n  border: none;\n  cursor: pointer;\n  text-align: left;\n  width: 100%;\n  transition: all 0.2s ease;\n}\n\n.menu-item:hover {\n  background-color: #f9f9fb;\n  color: #30374f;\n}\n\n.menu-item.selected {\n  background-color: #f9f9fb;\n  color: #30374f;\n}\n\n/* Property Type Styling */\n.menu-item-portfolio {\n  font-weight: 600;\n  color: #2642cf;\n}\n\n.menu-item-portfolio:hover {\n  color: #1a2bb8;\n}\n\n.menu-item-region {\n  font-weight: 500;\n  padding-left: 26px;\n  color: #404968;\n  font-size: 13px;\n}\n\n.menu-item-property {\n  color: #5d6b98;\n  font-size: 13px;\n}\n","import { Component, Prop, State, Event, EventEmitter, h, Host } from '@stencil/core';\n\nexport interface PopoverItem {\n  id: string;\n  label: string;\n  type?: 'portfolio' | 'region' | 'property' | 'header';\n  selected?: boolean;\n}\n\n@Component({\n  tag: 'bh-popover',\n  styleUrl: 'bh-popover.css',\n  shadow: true,\n})\nexport class BhPopover {\n  /**\n   * Title displayed in the header\n   */\n  @Prop() popoverTitle: string = 'Brand Name';\n\n  /**\n   * Text for the portfolio link\n   */\n  @Prop() viewPortfolioText: string = 'view portfolio';\n\n  /**\n   * Placeholder text for search input\n   */\n  @Prop() searchPlaceholder: string = 'Search by name or region';\n\n  /**\n   * Width of the popover\n   */\n  @Prop() width: string = '240px';\n\n  /**\n   * Whether to show search input\n   */\n  @Prop() showSearch: boolean = true;\n\n  /**\n   * Whether to show avatar section\n   */\n  @Prop() showAvatar: boolean = true;\n\n  /**\n   * Avatar image source URL\n   */\n  @Prop() avatarSrc?: string;\n\n  /**\n   * Menu items array (JSON string or array)\n   */\n  @Prop() items: PopoverItem[] | string = [];\n\n  @State() searchTerm: string = '';\n\n  /**\n   * Event emitted when a menu item is selected\n   */\n  @Event() bhItemSelect!: EventEmitter<PopoverItem>;\n\n  /**\n   * Event emitted when portfolio link is clicked\n   */\n  @Event() bhPortfolioClick!: EventEmitter<void>;\n\n  /**\n   * Event emitted when search input changes\n   */\n  @Event() bhSearchChange!: EventEmitter<string>;\n\n  private get parsedItems(): PopoverItem[] {\n    if (typeof this.items === 'string') {\n      try {\n        return JSON.parse(this.items);\n      } catch {\n        return [];\n      }\n    }\n    return this.items || [];\n  }\n\n  private handleItemClick = (item: PopoverItem) => {\n    if (item.type !== 'header') {\n      this.bhItemSelect.emit(item);\n    }\n  };\n\n  private handlePortfolioClick = () => {\n    this.bhPortfolioClick.emit();\n  };\n\n  private handleSearchInput = (event: Event) => {\n    const target = event.target as HTMLInputElement;\n    this.searchTerm = target.value;\n    this.bhSearchChange.emit(this.searchTerm);\n  };\n\n  private getItemClasses(item: PopoverItem): Record<string, boolean> {\n    return {\n      'menu-item': true,\n      'selected': !!item.selected,\n      'menu-item-portfolio': item.type === 'portfolio',\n      'menu-item-region': item.type === 'region',\n      'menu-item-property': item.type === 'property',\n    };\n  }\n\n  render() {\n    const items = this.parsedItems;\n\n    return (\n      <Host>\n        <div class=\"popover\" style={{ width: this.width }}>\n          <div class=\"popover-content\">\n            <div class=\"popover-menu\">\n              {/* Header with Brand/Avatar */}\n              {this.showAvatar && (\n                <div class=\"popover-header\">\n                  <div class=\"avatar-group\">\n                    <div class=\"avatar\">\n                      {this.avatarSrc ? (\n                        <img src={this.avatarSrc} alt={this.popoverTitle} class=\"avatar-image\" />\n                      ) : (\n                        <slot name=\"avatar\" />\n                      )}\n                    </div>\n                    <div class=\"brand-info\">\n                      <div class=\"brand-name\">{this.popoverTitle}</div>\n                      {this.viewPortfolioText && (\n                        <button\n                          class=\"portfolio-link\"\n                          onClick={this.handlePortfolioClick}\n                          type=\"button\"\n                        >\n                          {this.viewPortfolioText}\n                        </button>\n                      )}\n                    </div>\n                  </div>\n                </div>\n              )}\n\n              {/* Search Input */}\n              {this.showSearch && (\n                <div class=\"search-container\">\n                  <div class=\"search-input\">\n                    <div class=\"search-content\">\n                      <span class=\"material-symbols-outlined search-icon\">search</span>\n                      <input\n                        type=\"text\"\n                        placeholder={this.searchPlaceholder}\n                        value={this.searchTerm}\n                        onInput={this.handleSearchInput}\n                        class=\"search-field\"\n                      />\n                    </div>\n                  </div>\n                </div>\n              )}\n\n              {/* Menu Items */}\n              <div class=\"menu-items\">\n                {items.map((item) => (\n                  <div key={item.id}>\n                    {/* Header Item */}\n                    {item.type === 'header' && (\n                      <div class=\"menu-header\">{item.label}</div>\n                    )}\n\n                    {/* Regular Item */}\n                    {item.type !== 'header' && (\n                      <div class=\"menu-item-container\">\n                        <button\n                          class={this.getItemClasses(item)}\n                          onClick={() => this.handleItemClick(item)}\n                          type=\"button\"\n                        >\n                          {item.label}\n                        </button>\n                      </div>\n                    )}\n                  </div>\n                ))}\n              </div>\n            </div>\n          </div>\n        </div>\n      </Host>\n    );\n  }\n}\n"],"version":3}

package/components/bh-product-switcher.d.ts

@@ -0,0 +1,11 @@
+import type { Components, JSX } from "../types/components";
+
+interface BhProductSwitcher extends Components.BhProductSwitcher, HTMLElement {}
+export const BhProductSwitcher: {
+    prototype: BhProductSwitcher;
+    new (): BhProductSwitcher;
+};
+/**
+ * Used to define this component and all nested components recursively.
+ */
+export const defineCustomElement: () => void;

package/components/bh-product-switcher.js

@@ -0,0 +1,9 @@
+import { B as BhProductSwitcher$1, d as defineCustomElement$1 } from './p-HEcFS8Jc.js';
+
+const BhProductSwitcher = BhProductSwitcher$1;
+const defineCustomElement = defineCustomElement$1;
+
+export { BhProductSwitcher, defineCustomElement };
+//# sourceMappingURL=bh-product-switcher.js.map
+
+//# sourceMappingURL=bh-product-switcher.js.map

package/components/bh-product-switcher.js.map

@@ -0,0 +1 @@
+{"file":"bh-product-switcher.js","mappings":";;;;;;;","names":[],"sources":[],"sourcesContent":[],"version":3}

package/components/bh-property-switcher.d.ts

@@ -0,0 +1,11 @@
+import type { Components, JSX } from "../types/components";
+
+interface BhPropertySwitcher extends Components.BhPropertySwitcher, HTMLElement {}
+export const BhPropertySwitcher: {
+    prototype: BhPropertySwitcher;
+    new (): BhPropertySwitcher;
+};
+/**
+ * Used to define this component and all nested components recursively.
+ */
+export const defineCustomElement: () => void;