/*!
 * Copyright (c) 2026 Vertex Software LLC. All rights reserved.
 */
'use strict';

var index = require('./index-C_J7n4Dv.js');
var index$1 = require('./index-CRUoPh1y.js');
require('./_commonjsHelpers-CBbBosIU.js');

const viewerAnnotationCalloutCss = () => `:host{display:block;--viewer-annotation-callout-primary-color:var(--blue-700);--viewer-annotation-callout-accent-color:var(--white)}.content{display:flex;align-items:center;box-sizing:border-box;justify-content:center;background-color:var(--viewer-annotation-callout-primary-color);border:1px solid var(--viewer-annotation-callout-accent-color)}.content.sm{border-radius:14px;width:28px;height:28px}.content.md{border-radius:19px;width:38px;height:38px}.content.lg{border-radius:24px;width:48px;height:48px}.icon{color:var(--viewer-annotation-callout-accent-color)}`;

const ViewerAnnotationCallout = class {
    constructor(hostRef) {
        index.registerInstance(this, hostRef);
        /**
         * The icon size to display.
         */
        this.iconSize = 'sm';
    }
    render() {
        return (index.h(index.Host, { key: 'dd17e22c5146ba10148948e719adfc7fd39d5e23' }, index.h("div", { key: 'fea0a880cc65473788b261457357ad48a2c7f246', class: index$1.classname('content', this.iconSize), style: {
                borderColor: this.data.accentColor,
                backgroundColor: this.data.primaryColor,
            } }, index.h("vertex-viewer-icon", { key: 'bf9dc9c5d8c604532d8127b0f620387b42f29dae', class: "icon", name: this.data.icon, size: this.iconSize, style: { color: this.data.accentColor } }))));
    }
};
ViewerAnnotationCallout.style = viewerAnnotationCalloutCss();

exports.vertex_viewer_annotation_callout = ViewerAnnotationCallout;
//# sourceMappingURL=vertex-viewer-annotation-callout.entry.cjs.js.map

//# sourceMappingURL=vertex-viewer-annotation-callout.cjs.entry.js.map