@coveo/atomic 3.45.0 → 3.46.0

package/dist/atomic/components/components/insight/atomic-insight-result/atomic-insight-result.js

@@ -0,0 +1,190 @@
+var __decorate = (this && this.__decorate) || function (decorators, target, key, desc) {
+    var c = arguments.length, r = c < 3 ? target : desc === null ? desc = Object.getOwnPropertyDescriptor(target, key) : desc, d;
+    if (typeof Reflect === "object" && typeof Reflect.decorate === "function") r = Reflect.decorate(decorators, target, key, desc);
+    else for (var i = decorators.length - 1; i >= 0; i--) if (d = decorators[i]) r = (c < 3 ? d(r) : c > 3 ? d(target, key, r) : d(target, key)) || r;
+    return c > 3 && r && Object.defineProperty(target, key, r), r;
+};
+import { Schema, StringValue } from '@coveo/bueno';
+import { css, html, LitElement, nothing } from 'lit';
+import { customElement, property, state } from 'lit/decorators.js';
+import { createRef, ref } from 'lit/directives/ref.js';
+import { unsafeHTML } from 'lit/directives/unsafe-html.js';
+import { CustomRenderController } from "../../common/layout/custom-render-controller";
+import { ItemLayoutController } from "../../common/layout/item-layout-controller";
+import { ValidatePropsController } from "../../common/validate-props-controller/validate-props-controller";
+import { booleanConverter } from "../../../converters/boolean-converter";
+import { withTailwindStyles } from "../../../decorators/with-tailwind-styles";
+import { ChildrenUpdateCompleteMixin } from "../../../mixins/children-update-complete-mixin";
+import { parentNodeToString } from "../../../utils/dom-utils";
+/**
+ * The `atomic-insight-result` component is used internally by the `atomic-insight-result-list` component.
+ */
+let AtomicInsightResult = class AtomicInsightResult extends ChildrenUpdateCompleteMixin(LitElement) {
+    constructor() {
+        super();
+        this.resultRootRef = createRef();
+        /**
+         * How large or small results should be.
+         */
+        this.density = 'normal';
+        /**
+         * The size of the image section in result list items.
+         * This is overwritten by the image size defined in the result content, if it exists.
+         */
+        this.imageSize = 'icon';
+        /**
+         * The classes to add to the result element.
+         */
+        this.classes = '';
+        this.resolveResult = (event) => {
+            event.preventDefault();
+            event.stopPropagation();
+            event.detail(this.result);
+        };
+        this.resolveInteractiveResult = (event) => {
+            event.preventDefault();
+            event.stopPropagation();
+            if (this.interactiveResult) {
+                event.detail(this.interactiveResult);
+            }
+        };
+        this.resolveStopPropagation = (event) => {
+            event.detail(this.stopPropagation);
+        };
+        this.resolveResultDisplayConfig = (event) => {
+            event.preventDefault();
+            event.stopPropagation();
+            event.detail({
+                density: this.density,
+                imageSize: this.imageSize,
+            });
+        };
+        new ValidatePropsController(this, () => ({
+            density: this.density,
+            imageSize: this.imageSize,
+        }), new Schema({
+            density: new StringValue({
+                constrainTo: ['normal', 'comfortable', 'compact'],
+            }),
+            imageSize: new StringValue({
+                constrainTo: ['small', 'large', 'icon', 'none'],
+            }),
+        }));
+    }
+    async connectedCallback() {
+        super.connectedCallback();
+        new CustomRenderController(this, {
+            renderingFunction: () => this.renderingFunction,
+            itemData: () => this.result,
+            rootElementRef: () => this.resultRootRef.value,
+            onRenderComplete: (element, output) => {
+                this.itemLayoutController.applyLayoutClassesToElement(element, output);
+            },
+        });
+        this.itemLayoutController = new ItemLayoutController(this, {
+            elementPrefix: 'atomic-insight-result',
+            renderingFunction: () => this.renderingFunction,
+            content: () => this.content,
+            layoutConfig: () => ({
+                display: 'list',
+                density: this.density,
+                imageSize: this.imageSize,
+            }),
+            itemClasses: () => this.classes,
+            classesOnly: true,
+        });
+        this.addEventListener('atomic/resolveResult', this.resolveResult);
+        this.addEventListener('atomic/resolveInteractiveResult', this.resolveInteractiveResult);
+        this.addEventListener('atomic/resolveStopPropagation', this.resolveStopPropagation);
+        this.addEventListener('atomic/resolveResultDisplayConfig', this.resolveResultDisplayConfig);
+        await this.getUpdateComplete();
+        this.classList.add('hydrated');
+        this.classList.add('result-component');
+    }
+    disconnectedCallback() {
+        super.disconnectedCallback();
+        this.removeEventListener('atomic/resolveResult', this.resolveResult);
+        this.removeEventListener('atomic/resolveInteractiveResult', this.resolveInteractiveResult);
+        this.removeEventListener('atomic/resolveStopPropagation', this.resolveStopPropagation);
+        this.removeEventListener('atomic/resolveResultDisplayConfig', this.resolveResultDisplayConfig);
+    }
+    getContentHTML() {
+        if (!this.content) {
+            console.warn('atomic-insight-result: content property is undefined. Cannot get content HTML.', this);
+            return '';
+        }
+        return parentNodeToString(this.content);
+    }
+    render() {
+        if (this.renderingFunction !== undefined) {
+            return html `
+          <div
+            class="result-root"
+            ${ref(this.resultRootRef)}
+          ></div>
+      `;
+        }
+        // Handle case where content is undefined and layout was not created
+        if (!this.itemLayoutController.getLayout()) {
+            return nothing;
+        }
+        return html `
+        <div
+          class="result-root ${this.itemLayoutController
+            .getCombinedClasses()
+            .join(' ')}"
+        >
+          ${unsafeHTML(this.getContentHTML())}
+        </div>
+    `;
+    }
+    firstUpdated(_changedProperties) {
+        if (this.loadingFlag && this.store) {
+            this.store.unsetLoadingFlag(this.loadingFlag);
+        }
+    }
+};
+AtomicInsightResult.styles = css`/*! tailwindcss v4.1.13 | MIT License | https://tailwindcss.com */@layer properties;atomic-result-section-badges{text-align:left}atomic-result-section-actions{text-align:right}atomic-result-section-title-metadata{--font-size:var(--atomic-text-sm);font-size:var(--font-size);--line-height:calc(var(--font-size)*var(--atomic-line-height-ratio));line-height:var(--line-height)}atomic-result-section-emphasized{font-weight:500;--font-size:var(--atomic-text-2xl);font-size:var(--font-size);--line-height:calc(var(--font-size)*var(--atomic-line-height-ratio));line-height:var(--line-height);margin-top:.5rem}:host{@layer components{:host{font-family:var(--atomic-font-family);--tw-font-weight:var(--atomic-font-normal);font-weight:var(--atomic-font-normal)}atomic-result-section-actions,atomic-result-section-badges{text-align:left}atomic-result-section-title-metadata{--font-size:var(--atomic-text-sm);font-size:var(--font-size);--line-height:calc(var(--font-size)*var(--atomic-line-height-ratio));line-height:var(--line-height)}atomic-result-section-emphasized{font-weight:500;--font-size:var(--atomic-text-2xl);font-size:var(--font-size);--line-height:calc(var(--font-size)*var(--atomic-line-height-ratio));line-height:var(--line-height);margin-top:.5rem}.result-root{&.with-sections{display:grid;justify-items:stretch;atomic-result-section-visual{grid-area:visual}atomic-result-section-badges{grid-area:badges}atomic-result-section-actions{grid-area:actions;atomic-result-quickview{display:inline-block}}atomic-result-section-title{color:var(--atomic-on-background);grid-area:title}atomic-result-section-title-metadata{grid-area:title-metadata}atomic-result-section-emphasized{grid-area:emphasized}atomic-result-section-excerpt{color:var(--atomic-neutral-dark);grid-area:excerpt}atomic-result-section-bottom-metadata{color:var(--atomic-neutral-dark);grid-area:bottom-metadata}atomic-result-section-children{grid-area:children}atomic-result-section-actions,atomic-result-section-badges{display:flex;flex-wrap:wrap;gap:.5rem;max-height:calc(var(--row-height, 2rem)*2 + .5rem)}atomic-result-section-actions,atomic-result-section-badges,atomic-result-section-bottom-metadata,atomic-result-section-emphasized,atomic-result-section-excerpt,atomic-result-section-title,atomic-result-section-title-metadata,atomic-result-section-visual{overflow:hidden;text-overflow:ellipsis}&.image-icon{atomic-result-section-visual{border-radius:var(--atomic-border-radius)}}&.display-list{@media (width >= 1024px){&.image-large.density-compact{atomic-result-section-visual{height:10.25rem;width:10.25rem}}atomic-result-section-children{atomic-insight-result-children::part(children-root),atomic-result-children::part(children-root){border-color:var(--atomic-neutral);border-radius:16px;border-style:var(--tw-border-style);border-width:1px}}&.density-comfortable{atomic-result-section-visual{margin-right:1.5rem}atomic-result-section-actions,atomic-result-section-badges{margin-bottom:1.5rem;--row-height:2rem}atomic-result-section-title{--font-size:var(--atomic-text-2xl);font-size:var(--font-size);--line-height:calc(var(--font-size)*var(--atomic-line-height-ratio));line-height:var(--line-height)}atomic-result-section-excerpt{margin-top:1.75rem;--font-size:var(--atomic-text-lg);font-size:var(--font-size);--line-height:calc(var(--font-size)*var(--atomic-line-height-ratio));display:-webkit-box;line-height:var(--line-height);max-height:4.5rem;overflow:hidden;-webkit-box-orient:vertical;-webkit-line-clamp:3}atomic-result-section-bottom-metadata{margin-top:1.25rem;--font-size:var(--atomic-text-sm);font-size:var(--font-size);--line-height:calc(var(--font-size)*var(--atomic-line-height-ratio));line-height:var(--line-height);max-height:4rem}atomic-result-section-title-metadata{margin-top:.475rem}atomic-insight-result-children,atomic-result-children{&::part(children-root){border-color:var(--atomic-neutral);border-radius:16px;border-style:var(--tw-border-style);border-width:1px;margin-top:1.25rem;padding:1.75rem}&::part(show-hide-button){margin-bottom:1.25rem;margin-top:1.25rem}}atomic-insight-result-children,atomic-result-children{&::part(children-root){border-color:var(--atomic-neutral);border-radius:16px;border-style:var(--tw-border-style);border-width:1px;margin-top:1.25rem;padding:1.75rem}&::part(show-hide-button){margin-bottom:1.25rem;margin-top:1.25rem}}&.child-result:not(.last-child),.placeholder{margin-bottom:1.75rem}}&.density-normal{atomic-result-section-visual{margin-right:1rem}atomic-result-section-actions,atomic-result-section-badges{margin-bottom:1rem;--row-height:2rem}atomic-result-section-title{--font-size:var(--atomic-text-xl);font-size:var(--font-size);--line-height:calc(var(--font-size)*var(--atomic-line-height-ratio));line-height:var(--line-height)}atomic-result-section-excerpt{margin-top:1.25rem;--font-size:var(--atomic-text-base);font-size:var(--font-size);--line-height:calc(var(--font-size)*var(--atomic-line-height-ratio));display:-webkit-box;line-height:var(--line-height);max-height:2.5rem;overflow:hidden;-webkit-box-orient:vertical;-webkit-line-clamp:2}atomic-result-section-bottom-metadata{margin-top:.875rem;--font-size:var(--atomic-text-sm);font-size:var(--font-size);--line-height:calc(var(--font-size)*var(--atomic-line-height-ratio));line-height:var(--line-height);max-height:3.5rem}atomic-result-section-title-metadata{margin-top:.475rem}atomic-insight-result-children,atomic-result-children{&::part(children-root){border-color:var(--atomic-neutral);border-radius:16px;border-style:var(--tw-border-style);border-width:1px;margin-top:.875rem;padding:1.5rem}&::part(show-hide-button){margin-bottom:.875rem;margin-top:.875rem}}atomic-insight-result-children,atomic-result-children{&::part(children-root){border-color:var(--atomic-neutral);border-radius:16px;border-style:var(--tw-border-style);border-width:1px;margin-top:.875rem;padding:1.5rem}&::part(show-hide-button){margin-bottom:.875rem;margin-top:.875rem}}&.child-result:not(.last-child),.placeholder{margin-bottom:1.5rem}}&.density-compact{atomic-result-section-visual{margin-right:1rem}atomic-result-section-actions,atomic-result-section-badges{margin-bottom:1rem;--row-height:2rem}atomic-result-section-title{--font-size:var(--atomic-text-xl);font-size:var(--font-size);--line-height:calc(var(--font-size)*var(--atomic-line-height-ratio));line-height:var(--line-height)}atomic-result-section-excerpt{margin-top:1rem;--font-size:var(--atomic-text-base);font-size:var(--font-size);--line-height:calc(var(--font-size)*var(--atomic-line-height-ratio));display:-webkit-box;line-height:var(--line-height);max-height:1.25rem;overflow:hidden;-webkit-box-orient:vertical;-webkit-line-clamp:1}atomic-result-section-bottom-metadata{margin-top:.6875rem;--font-size:var(--atomic-text-sm);font-size:var(--font-size);--line-height:calc(var(--font-size)*var(--atomic-line-height-ratio));line-height:var(--line-height);max-height:3.25rem}atomic-result-section-title-metadata{margin-top:.475rem}atomic-insight-result-children,atomic-result-children{&::part(children-root){border-color:var(--atomic-neutral);border-radius:16px;border-style:var(--tw-border-style);border-width:1px;margin-top:.475rem;padding:1rem}&::part(show-hide-button){margin-bottom:.475rem;margin-top:.475rem}}atomic-insight-result-children,atomic-result-children{&::part(children-root){border-color:var(--atomic-neutral);border-radius:16px;border-style:var(--tw-border-style);border-width:1px;margin-top:.475rem;padding:1rem}&::part(show-hide-button){margin-bottom:.475rem;margin-top:.475rem}}&.child-result:not(.last-child),.placeholder{margin-bottom:1rem}}&.image-large,&.image-small{grid-template-areas:"badges badges          .               actions" "visual title           title           title" "visual title-metadata  title-metadata  title-metadata" "visual emphasized      emphasized      emphasized" "visual excerpt         excerpt         excerpt" "visual bottom-metadata bottom-metadata bottom-metadata" "visual children        children        children";grid-template-columns:minmax(0,min-content) auto 1fr auto;grid-template-rows:repeat(6,auto) minmax(0,1fr)}&.image-large.density-comfortable,&.image-large.density-normal{atomic-result-section-visual{height:20.375rem;width:20.375rem}}&.image-large.density-compact,&.image-small{atomic-result-section-visual{height:10rem;width:10rem}}&.image-icon{grid-template-areas:"badges badges          .               actions" "visual title           title           title" "visual title-metadata  title-metadata  title-metadata" "visual emphasized      emphasized      emphasized" "visual excerpt         excerpt         excerpt" "visual bottom-metadata bottom-metadata bottom-metadata" "visual children        children        children";grid-template-columns:minmax(0,min-content) auto 1fr auto;grid-template-rows:repeat(7,minmax(0,min-content));atomic-result-section-visual{height:2rem;width:2rem}}&.image-none{grid-template-areas:"badges          .               actions" "title           title           title" "title-metadata  title-metadata  title-metadata" "emphasized      emphasized      emphasized" "excerpt         excerpt         excerpt" "bottom-metadata bottom-metadata bottom-metadata" "children        children        children";grid-template-columns:auto 1fr auto;grid-template-rows:repeat(6,auto);atomic-result-section-visual{display:none}}}@media not all and (width >= 1024px){atomic-result-section-children{atomic-insight-result-children::part(children-root),atomic-result-children::part(children-root){border-top:1px var(--tw-border-style) var(--atomic-neutral)}}&.density-comfortable{atomic-result-section-visual{margin-right:1rem}atomic-result-section-badges{margin-bottom:1rem;--row-height:2rem}atomic-result-section-actions{margin-top:1rem;--row-height:2.5rem}atomic-result-section-title{--font-size:var(--atomic-text-xl);font-size:var(--font-size);--line-height:calc(var(--font-size)*var(--atomic-line-height-ratio));line-height:var(--line-height)}atomic-result-section-excerpt{margin-top:1.25rem;--font-size:var(--atomic-text-base);font-size:var(--font-size);--line-height:calc(var(--font-size)*var(--atomic-line-height-ratio));display:-webkit-box;line-height:var(--line-height);max-height:2.5rem;overflow:hidden;-webkit-box-orient:vertical;-webkit-line-clamp:2}atomic-result-section-bottom-metadata{margin-top:.75rem;--font-size:var(--atomic-text-sm);font-size:var(--font-size);--line-height:calc(var(--font-size)*var(--atomic-line-height-ratio));line-height:var(--line-height);max-height:4rem}atomic-result-section-title-metadata{margin-top:.475rem}atomic-insight-result-children,atomic-result-children{&::part(children-root){margin-inline:-1rem;margin-top:1rem;padding-top:1.75rem;padding-inline:1rem}&::part(show-hide-button){margin-bottom:1.25rem;margin-top:1.25rem}}atomic-insight-result-children,atomic-result-children{&::part(children-root){margin-inline:-1rem;margin-top:1rem;padding-top:1.75rem;padding-inline:1rem}&::part(show-hide-button){margin-bottom:1.25rem;margin-top:1.25rem}}&.child-result:not(.last-child),.placeholder{margin-bottom:1.75rem}}&.density-normal{atomic-result-section-visual{margin-right:1rem}atomic-result-section-badges{margin-bottom:1rem;--row-height:2rem}atomic-result-section-actions{margin-top:.75rem;--row-height:2.5rem}atomic-result-section-title{--font-size:var(--atomic-text-xl);font-size:var(--font-size);--line-height:calc(var(--font-size)*var(--atomic-line-height-ratio));line-height:var(--line-height)}atomic-result-section-excerpt{margin-top:1rem;--font-size:var(--atomic-text-base);font-size:var(--font-size);--line-height:calc(var(--font-size)*var(--atomic-line-height-ratio));display:-webkit-box;line-height:var(--line-height);max-height:2.5rem;overflow:hidden;-webkit-box-orient:vertical;-webkit-line-clamp:2}atomic-result-section-bottom-metadata{margin-top:.625rem;--font-size:var(--atomic-text-sm);font-size:var(--font-size);--line-height:calc(var(--font-size)*var(--atomic-line-height-ratio));line-height:var(--line-height);max-height:3.5rem}atomic-result-section-title-metadata{margin-top:.475rem}atomic-insight-result-children,atomic-result-children{&::part(children-root){margin-inline:-1rem;margin-top:1rem;padding-top:1.5rem;padding-inline:1rem}&::part(show-hide-button){margin-bottom:.875rem;margin-top:.875rem}}atomic-insight-result-children,atomic-result-children{&::part(children-root){margin-inline:-1rem;margin-top:1rem;padding-top:1.5rem;padding-inline:1rem}&::part(show-hide-button){margin-bottom:.875rem;margin-top:.875rem}}&.child-result:not(.last-child),.placeholder{margin-bottom:1.5rem}}&.density-compact{atomic-result-section-visual{margin-right:1rem}atomic-result-section-badges{margin-bottom:1rem;--row-height:2rem}atomic-result-section-actions{margin-top:.5em;--row-height:2.5rem}atomic-result-section-title{--font-size:var(--atomic-text-xl);font-size:var(--font-size);--line-height:calc(var(--font-size)*var(--atomic-line-height-ratio));line-height:var(--line-height)}atomic-result-section-excerpt{margin-top:.75rem;--font-size:var(--atomic-text-base);font-size:var(--font-size);--line-height:calc(var(--font-size)*var(--atomic-line-height-ratio));display:-webkit-box;line-height:var(--line-height);max-height:1.25rem;overflow:hidden;-webkit-box-orient:vertical;-webkit-line-clamp:1}atomic-result-section-bottom-metadata{margin-top:.4375rem;--font-size:var(--atomic-text-sm);font-size:var(--font-size);--line-height:calc(var(--font-size)*var(--atomic-line-height-ratio));line-height:var(--line-height);max-height:3.25rem}atomic-result-section-title-metadata{margin-top:.475rem}atomic-insight-result-children,atomic-result-children{&::part(children-root){margin-inline:-1rem;margin-top:1rem;padding-top:1rem;padding-inline:1rem}&::part(show-hide-button){margin-bottom:.475rem;margin-top:.475rem}}atomic-insight-result-children,atomic-result-children{&::part(children-root){margin-inline:-1rem;margin-top:1rem;padding-top:1rem;padding-inline:1rem}&::part(show-hide-button){margin-bottom:.475rem;margin-top:.475rem}}&.child-result:not(.last-child),.placeholder{margin-bottom:1rem}}&.image-large{grid-template-areas:"visual" "badges" "title" "title-metadata" "emphasized" "excerpt" "bottom-metadata" "actions" "children";grid-template-columns:100%;grid-template-rows:repeat(8,auto);atomic-result-section-visual{aspect-ratio:1/1;height:auto;@supports not (aspect-ratio:1/1){height:7.25rem}margin-bottom:1rem;margin-right:0;width:100%}}&.image-small{grid-template-areas:"badges          badges" "visual          title" "visual          title-metadata" "visual          emphasized" "visual          ." "excerpt         excerpt" "bottom-metadata bottom-metadata" "actions         actions" "children        children";grid-template-columns:auto minmax(0,1fr);grid-template-rows:repeat(4,auto) minmax(0,1fr) repeat(3,auto);atomic-result-section-visual{height:24vw;margin-bottom:1rem;width:24vw}}&.image-icon{grid-template-areas:"badges          badges" "visual          title" "visual          title-metadata" "visual          emphasized" "visual          excerpt" "visual          bottom-metadata" "visual          actions" "visual          children";grid-template-columns:auto minmax(0,1fr);grid-template-rows:repeat(7,auto) 1fr;atomic-result-section-visual{height:2rem;margin-bottom:0;width:2rem}}&.image-none{grid-template-areas:"badges" "title" "title-metadata" "emphasized" "excerpt" "bottom-metadata" "actions" "children";grid-template-columns:100%;grid-template-rows:repeat(7,auto);atomic-result-section-visual{display:none}}}}&.display-grid{a,button{position:relative}&.image-large{@media (width >= 1024px){grid-template-areas:"badges" "visual" "title" "title-metadata" "emphasized" "excerpt" "children" "bottom-metadata" "actions";grid-template-columns:100%;grid-template-rows:repeat(9,auto);&.density-comfortable{&.image-large,&.image-small{atomic-result-section-visual{margin:0 auto 2rem}}&.image-icon{atomic-result-section-badges{margin-bottom:2rem}atomic-result-section-visual{height:2rem;width:2rem}}atomic-result-section-visual{margin-bottom:.5rem}atomic-result-section-badges{--font-size:var(--atomic-text-sm);font-size:var(--font-size);--line-height:calc(var(--font-size)*var(--atomic-line-height-ratio));line-height:var(--line-height);margin-bottom:1rem;--row-height:2rem}atomic-result-section-actions{--font-size:var(--atomic-text-base);font-size:var(--font-size);--line-height:calc(var(--font-size)*var(--atomic-line-height-ratio));line-height:var(--line-height);margin-top:2.25rem;--row-height:2.5rem}atomic-result-section-title{--font-size:var(--atomic-text-2xl);font-size:var(--font-size);--line-height:calc(var(--font-size)*var(--atomic-line-height-ratio));display:-webkit-box;line-height:var(--line-height);overflow:hidden;word-break:break-word;-webkit-box-orient:vertical;-webkit-line-clamp:2}atomic-result-section-title-metadata{--font-size:var(--atomic-text-sm);font-size:var(--font-size);--line-height:calc(var(--font-size)*var(--atomic-line-height-ratio));line-height:var(--line-height);margin-top:.475rem}atomic-result-section-emphasized{font-weight:500;--font-size:var(--atomic-text-2xl);font-size:var(--font-size);--line-height:calc(var(--font-size)*var(--atomic-line-height-ratio));line-height:var(--line-height)}atomic-result-section-excerpt{--font-size:var(--atomic-text-lg);font-size:var(--font-size);--line-height:calc(var(--font-size)*var(--atomic-line-height-ratio));display:-webkit-box;line-height:var(--line-height);margin-top:2.25rem;overflow:hidden;-webkit-box-orient:vertical;-webkit-line-clamp:3}atomic-result-section-bottom-metadata{--font-size:var(--atomic-text-sm);font-size:var(--font-size);--line-height:calc(var(--font-size)*var(--atomic-line-height-ratio));line-height:var(--line-height);margin-top:1.75rem;max-height:4rem}}&.density-normal{&.image-large,&.image-small{atomic-result-section-visual{margin:0 auto 1.5rem}}&.image-icon{atomic-result-section-badges{margin-bottom:1.5rem}atomic-result-section-visual{height:2rem;width:2rem}}atomic-result-section-visual{margin-bottom:.5rem}atomic-result-section-badges{margin-bottom:1rem}atomic-result-section-actions,atomic-result-section-badges{--font-size:var(--atomic-text-sm);font-size:var(--font-size);--line-height:calc(var(--font-size)*var(--atomic-line-height-ratio));line-height:var(--line-height);--row-height:2rem}atomic-result-section-actions{margin-top:1.75rem}atomic-result-section-title{--font-size:var(--atomic-text-xl);font-size:var(--font-size);--line-height:calc(var(--font-size)*var(--atomic-line-height-ratio));display:-webkit-box;line-height:var(--line-height);overflow:hidden;word-break:break-word;-webkit-box-orient:vertical;-webkit-line-clamp:2}atomic-result-section-title-metadata{--font-size:var(--atomic-text-sm);font-size:var(--font-size);--line-height:calc(var(--font-size)*var(--atomic-line-height-ratio));line-height:var(--line-height);margin-top:.475rem}atomic-result-section-emphasized{font-weight:500;--font-size:var(--atomic-text-2xl);font-size:var(--font-size);--line-height:calc(var(--font-size)*var(--atomic-line-height-ratio));line-height:var(--line-height)}atomic-result-section-excerpt{--font-size:var(--atomic-text-base);font-size:var(--font-size);--line-height:calc(var(--font-size)*var(--atomic-line-height-ratio));display:-webkit-box;line-height:var(--line-height);margin-top:1.75rem;overflow:hidden;-webkit-box-orient:vertical;-webkit-line-clamp:2}atomic-result-section-bottom-metadata{--font-size:var(--atomic-text-sm);font-size:var(--font-size);--line-height:calc(var(--font-size)*var(--atomic-line-height-ratio));line-height:var(--line-height);margin-top:1.375rem;max-height:3.5rem}}&.density-compact{&.image-large,&.image-small{atomic-result-section-visual{margin:0 auto 1rem}}&.image-icon{atomic-result-section-badges{margin-bottom:1rem}atomic-result-section-visual{height:2rem;width:2rem}}atomic-result-section-visual{margin-bottom:.5rem}atomic-result-section-badges{margin-bottom:1rem}atomic-result-section-actions,atomic-result-section-badges{--font-size:var(--atomic-text-sm);font-size:var(--font-size);--line-height:calc(var(--font-size)*var(--atomic-line-height-ratio));line-height:var(--line-height);--row-height:2rem}atomic-result-section-actions{margin-top:1.25rem}atomic-result-section-title{--font-size:var(--atomic-text-xl);font-size:var(--font-size);--line-height:calc(var(--font-size)*var(--atomic-line-height-ratio));display:-webkit-box;line-height:var(--line-height);overflow:hidden;word-break:break-word;-webkit-box-orient:vertical;-webkit-line-clamp:2}atomic-result-section-title-metadata{--font-size:var(--atomic-text-sm);font-size:var(--font-size);--line-height:calc(var(--font-size)*var(--atomic-line-height-ratio));line-height:var(--line-height);margin-top:.475rem}atomic-result-section-emphasized{font-weight:500;--font-size:var(--atomic-text-2xl);font-size:var(--font-size);--line-height:calc(var(--font-size)*var(--atomic-line-height-ratio));line-height:var(--line-height)}atomic-result-section-excerpt{--font-size:var(--atomic-text-base);font-size:var(--font-size);--line-height:calc(var(--font-size)*var(--atomic-line-height-ratio));display:-webkit-box;line-height:var(--line-height);margin-top:1.25rem;overflow:hidden;-webkit-box-orient:vertical;-webkit-line-clamp:1}atomic-result-section-bottom-metadata{--font-size:var(--atomic-text-sm);font-size:var(--font-size);--line-height:calc(var(--font-size)*var(--atomic-line-height-ratio));line-height:var(--line-height);margin-top:.9375rem;max-height:3.25rem}}&.image-large{atomic-result-section-visual{aspect-ratio:1/1;height:auto;@supports not (aspect-ratio:1/1){height:19.75rem}width:100%}atomic-result-section-badges{margin-bottom:1rem}}&.image-small{atomic-result-section-visual{aspect-ratio:1/1;height:auto;@supports not (aspect-ratio:1/1){height:14rem}width:100%}}&.image-none{atomic-result-section-visual{display:none}}}@media not all and (width >= 1024px){atomic-result-section-children{atomic-insight-result-children::part(children-root),atomic-result-children::part(children-root){border-top:1px var(--tw-border-style) var(--atomic-neutral)}}&.density-comfortable{atomic-result-section-visual{margin-right:1rem}atomic-result-section-badges{margin-bottom:1rem;--row-height:2rem}atomic-result-section-actions{margin-top:1rem;--row-height:2.5rem}atomic-result-section-title{--font-size:var(--atomic-text-xl);font-size:var(--font-size);--line-height:calc(var(--font-size)*var(--atomic-line-height-ratio));line-height:var(--line-height)}atomic-result-section-excerpt{margin-top:1.25rem;--font-size:var(--atomic-text-base);font-size:var(--font-size);--line-height:calc(var(--font-size)*var(--atomic-line-height-ratio));display:-webkit-box;line-height:var(--line-height);max-height:2.5rem;overflow:hidden;-webkit-box-orient:vertical;-webkit-line-clamp:2}atomic-result-section-bottom-metadata{margin-top:.75rem;--font-size:var(--atomic-text-sm);font-size:var(--font-size);--line-height:calc(var(--font-size)*var(--atomic-line-height-ratio));line-height:var(--line-height);max-height:4rem}atomic-result-section-title-metadata{margin-top:.475rem}atomic-insight-result-children,atomic-result-children{&::part(children-root){margin-inline:-1rem;margin-top:1rem;padding-top:1.75rem;padding-inline:1rem}&::part(show-hide-button){margin-bottom:1.25rem;margin-top:1.25rem}}atomic-insight-result-children,atomic-result-children{&::part(children-root){margin-inline:-1rem;margin-top:1rem;padding-top:1.75rem;padding-inline:1rem}&::part(show-hide-button){margin-bottom:1.25rem;margin-top:1.25rem}}&.child-result:not(.last-child),.placeholder{margin-bottom:1.75rem}}&.density-normal{atomic-result-section-visual{margin-right:1rem}atomic-result-section-badges{margin-bottom:1rem;--row-height:2rem}atomic-result-section-actions{margin-top:.75rem;--row-height:2.5rem}atomic-result-section-title{--font-size:var(--atomic-text-xl);font-size:var(--font-size);--line-height:calc(var(--font-size)*var(--atomic-line-height-ratio));line-height:var(--line-height)}atomic-result-section-excerpt{margin-top:1rem;--font-size:var(--atomic-text-base);font-size:var(--font-size);--line-height:calc(var(--font-size)*var(--atomic-line-height-ratio));display:-webkit-box;line-height:var(--line-height);max-height:2.5rem;overflow:hidden;-webkit-box-orient:vertical;-webkit-line-clamp:2}atomic-result-section-bottom-metadata{margin-top:.625rem;--font-size:var(--atomic-text-sm);font-size:var(--font-size);--line-height:calc(var(--font-size)*var(--atomic-line-height-ratio));line-height:var(--line-height);max-height:3.5rem}atomic-result-section-title-metadata{margin-top:.475rem}atomic-insight-result-children,atomic-result-children{&::part(children-root){margin-inline:-1rem;margin-top:1rem;padding-top:1.5rem;padding-inline:1rem}&::part(show-hide-button){margin-bottom:.875rem;margin-top:.875rem}}atomic-insight-result-children,atomic-result-children{&::part(children-root){margin-inline:-1rem;margin-top:1rem;padding-top:1.5rem;padding-inline:1rem}&::part(show-hide-button){margin-bottom:.875rem;margin-top:.875rem}}&.child-result:not(.last-child),.placeholder{margin-bottom:1.5rem}}&.density-compact{atomic-result-section-visual{margin-right:1rem}atomic-result-section-badges{margin-bottom:1rem;--row-height:2rem}atomic-result-section-actions{margin-top:.5em;--row-height:2.5rem}atomic-result-section-title{--font-size:var(--atomic-text-xl);font-size:var(--font-size);--line-height:calc(var(--font-size)*var(--atomic-line-height-ratio));line-height:var(--line-height)}atomic-result-section-excerpt{margin-top:.75rem;--font-size:var(--atomic-text-base);font-size:var(--font-size);--line-height:calc(var(--font-size)*var(--atomic-line-height-ratio));display:-webkit-box;line-height:var(--line-height);max-height:1.25rem;overflow:hidden;-webkit-box-orient:vertical;-webkit-line-clamp:1}atomic-result-section-bottom-metadata{margin-top:.4375rem;--font-size:var(--atomic-text-sm);font-size:var(--font-size);--line-height:calc(var(--font-size)*var(--atomic-line-height-ratio));line-height:var(--line-height);max-height:3.25rem}atomic-result-section-title-metadata{margin-top:.475rem}atomic-insight-result-children,atomic-result-children{&::part(children-root){margin-inline:-1rem;margin-top:1rem;padding-top:1rem;padding-inline:1rem}&::part(show-hide-button){margin-bottom:.475rem;margin-top:.475rem}}atomic-insight-result-children,atomic-result-children{&::part(children-root){margin-inline:-1rem;margin-top:1rem;padding-top:1rem;padding-inline:1rem}&::part(show-hide-button){margin-bottom:.475rem;margin-top:.475rem}}&.child-result:not(.last-child),.placeholder{margin-bottom:1rem}}&.image-large{grid-template-areas:"visual" "badges" "title" "title-metadata" "emphasized" "excerpt" "bottom-metadata" "actions" "children";grid-template-columns:100%;grid-template-rows:repeat(8,auto);atomic-result-section-visual{aspect-ratio:1/1;height:auto;@supports not (aspect-ratio:1/1){height:7.25rem}margin-bottom:1rem;margin-right:0;width:100%}}&.image-small{grid-template-areas:"badges          badges" "visual          title" "visual          title-metadata" "visual          emphasized" "visual          ." "excerpt         excerpt" "bottom-metadata bottom-metadata" "actions         actions" "children        children";grid-template-columns:auto minmax(0,1fr);grid-template-rows:repeat(4,auto) minmax(0,1fr) repeat(3,auto);atomic-result-section-visual{height:24vw;margin-bottom:1rem;width:24vw}}&.image-icon{grid-template-areas:"badges          badges" "visual          title" "visual          title-metadata" "visual          emphasized" "visual          excerpt" "visual          bottom-metadata" "visual          actions" "visual          children";grid-template-columns:auto minmax(0,1fr);grid-template-rows:repeat(7,auto) 1fr;atomic-result-section-visual{height:2rem;margin-bottom:0;width:2rem}}&.image-none{grid-template-areas:"badges" "title" "title-metadata" "emphasized" "excerpt" "bottom-metadata" "actions" "children";grid-template-columns:100%;grid-template-rows:repeat(7,auto);atomic-result-section-visual{display:none}}}}&.image-icon,&.image-none,&.image-small{@media (width >= 1024px){grid-template-areas:"badges" "visual" "title" "title-metadata" "emphasized" "excerpt" "children" "bottom-metadata" "actions";grid-template-columns:100%;grid-template-rows:repeat(9,auto);&.density-comfortable{&.image-large,&.image-small{atomic-result-section-visual{margin:0 auto 2rem}}&.image-icon{atomic-result-section-badges{margin-bottom:2rem}atomic-result-section-visual{height:2rem;width:2rem}}atomic-result-section-visual{margin-bottom:.5rem}atomic-result-section-badges{--font-size:var(--atomic-text-sm);font-size:var(--font-size);--line-height:calc(var(--font-size)*var(--atomic-line-height-ratio));line-height:var(--line-height);margin-bottom:1rem;--row-height:2rem}atomic-result-section-actions{--font-size:var(--atomic-text-base);font-size:var(--font-size);--line-height:calc(var(--font-size)*var(--atomic-line-height-ratio));line-height:var(--line-height);margin-top:2.25rem;--row-height:2.5rem}atomic-result-section-title{--font-size:var(--atomic-text-2xl);font-size:var(--font-size);--line-height:calc(var(--font-size)*var(--atomic-line-height-ratio));display:-webkit-box;line-height:var(--line-height);overflow:hidden;word-break:break-word;-webkit-box-orient:vertical;-webkit-line-clamp:2}atomic-result-section-title-metadata{--font-size:var(--atomic-text-sm);font-size:var(--font-size);--line-height:calc(var(--font-size)*var(--atomic-line-height-ratio));line-height:var(--line-height);margin-top:.475rem}atomic-result-section-emphasized{font-weight:500;--font-size:var(--atomic-text-2xl);font-size:var(--font-size);--line-height:calc(var(--font-size)*var(--atomic-line-height-ratio));line-height:var(--line-height)}atomic-result-section-excerpt{--font-size:var(--atomic-text-lg);font-size:var(--font-size);--line-height:calc(var(--font-size)*var(--atomic-line-height-ratio));display:-webkit-box;line-height:var(--line-height);margin-top:2.25rem;overflow:hidden;-webkit-box-orient:vertical;-webkit-line-clamp:3}atomic-result-section-bottom-metadata{--font-size:var(--atomic-text-sm);font-size:var(--font-size);--line-height:calc(var(--font-size)*var(--atomic-line-height-ratio));line-height:var(--line-height);margin-top:1.75rem;max-height:4rem}}&.density-normal{&.image-large,&.image-small{atomic-result-section-visual{margin:0 auto 1.5rem}}&.image-icon{atomic-result-section-badges{margin-bottom:1.5rem}atomic-result-section-visual{height:2rem;width:2rem}}atomic-result-section-visual{margin-bottom:.5rem}atomic-result-section-badges{margin-bottom:1rem}atomic-result-section-actions,atomic-result-section-badges{--font-size:var(--atomic-text-sm);font-size:var(--font-size);--line-height:calc(var(--font-size)*var(--atomic-line-height-ratio));line-height:var(--line-height);--row-height:2rem}atomic-result-section-actions{margin-top:1.75rem}atomic-result-section-title{--font-size:var(--atomic-text-xl);font-size:var(--font-size);--line-height:calc(var(--font-size)*var(--atomic-line-height-ratio));display:-webkit-box;line-height:var(--line-height);overflow:hidden;word-break:break-word;-webkit-box-orient:vertical;-webkit-line-clamp:2}atomic-result-section-title-metadata{--font-size:var(--atomic-text-sm);font-size:var(--font-size);--line-height:calc(var(--font-size)*var(--atomic-line-height-ratio));line-height:var(--line-height);margin-top:.475rem}atomic-result-section-emphasized{font-weight:500;--font-size:var(--atomic-text-2xl);font-size:var(--font-size);--line-height:calc(var(--font-size)*var(--atomic-line-height-ratio));line-height:var(--line-height)}atomic-result-section-excerpt{--font-size:var(--atomic-text-base);font-size:var(--font-size);--line-height:calc(var(--font-size)*var(--atomic-line-height-ratio));display:-webkit-box;line-height:var(--line-height);margin-top:1.75rem;overflow:hidden;-webkit-box-orient:vertical;-webkit-line-clamp:2}atomic-result-section-bottom-metadata{--font-size:var(--atomic-text-sm);font-size:var(--font-size);--line-height:calc(var(--font-size)*var(--atomic-line-height-ratio));line-height:var(--line-height);margin-top:1.375rem;max-height:3.5rem}}&.density-compact{&.image-large,&.image-small{atomic-result-section-visual{margin:0 auto 1rem}}&.image-icon{atomic-result-section-badges{margin-bottom:1rem}atomic-result-section-visual{height:2rem;width:2rem}}atomic-result-section-visual{margin-bottom:.5rem}atomic-result-section-badges{margin-bottom:1rem}atomic-result-section-actions,atomic-result-section-badges{--font-size:var(--atomic-text-sm);font-size:var(--font-size);--line-height:calc(var(--font-size)*var(--atomic-line-height-ratio));line-height:var(--line-height);--row-height:2rem}atomic-result-section-actions{margin-top:1.25rem}atomic-result-section-title{--font-size:var(--atomic-text-xl);font-size:var(--font-size);--line-height:calc(var(--font-size)*var(--atomic-line-height-ratio));display:-webkit-box;line-height:var(--line-height);overflow:hidden;word-break:break-word;-webkit-box-orient:vertical;-webkit-line-clamp:2}atomic-result-section-title-metadata{--font-size:var(--atomic-text-sm);font-size:var(--font-size);--line-height:calc(var(--font-size)*var(--atomic-line-height-ratio));line-height:var(--line-height);margin-top:.475rem}atomic-result-section-emphasized{font-weight:500;--font-size:var(--atomic-text-2xl);font-size:var(--font-size);--line-height:calc(var(--font-size)*var(--atomic-line-height-ratio));line-height:var(--line-height)}atomic-result-section-excerpt{--font-size:var(--atomic-text-base);font-size:var(--font-size);--line-height:calc(var(--font-size)*var(--atomic-line-height-ratio));display:-webkit-box;line-height:var(--line-height);margin-top:1.25rem;overflow:hidden;-webkit-box-orient:vertical;-webkit-line-clamp:1}atomic-result-section-bottom-metadata{--font-size:var(--atomic-text-sm);font-size:var(--font-size);--line-height:calc(var(--font-size)*var(--atomic-line-height-ratio));line-height:var(--line-height);margin-top:.9375rem;max-height:3.25rem}}&.image-large{atomic-result-section-visual{aspect-ratio:1/1;height:auto;@supports not (aspect-ratio:1/1){height:19.75rem}width:100%}atomic-result-section-badges{margin-bottom:1rem}}&.image-small{atomic-result-section-visual{aspect-ratio:1/1;height:auto;@supports not (aspect-ratio:1/1){height:14rem}width:100%}}&.image-none{atomic-result-section-visual{display:none}}}@media not all and (width >= 1024px){grid-template-areas:"badges" "visual" "title" "title-metadata" "emphasized" "excerpt" "children" "bottom-metadata" "actions";grid-template-columns:100%;grid-template-rows:repeat(9,auto);&.density-comfortable{atomic-result-section-visual{margin-bottom:1rem}&.image-small{atomic-result-section-visual{height:10.25rem;width:10.25rem}}atomic-result-section-badges{--font-size:var(--atomic-text-sm);font-size:var(--font-size);--line-height:calc(var(--font-size)*var(--atomic-line-height-ratio));line-height:var(--line-height);margin-bottom:1rem;--row-height:2rem}atomic-result-section-actions{--font-size:var(--atomic-text-base);font-size:var(--font-size);--line-height:calc(var(--font-size)*var(--atomic-line-height-ratio));line-height:var(--line-height);margin-top:1.25rem;--row-height:2rem}atomic-result-section-title{--font-size:var(--atomic-text-lg);font-size:var(--font-size);--line-height:calc(var(--font-size)*var(--atomic-line-height-ratio));display:-webkit-box;line-height:var(--line-height);max-height:3rem;overflow:hidden;-webkit-box-orient:vertical;-webkit-line-clamp:2}atomic-result-section-title-metadata{--font-size:var(--atomic-text-sm);font-size:var(--font-size);--line-height:calc(var(--font-size)*var(--atomic-line-height-ratio));line-height:var(--line-height);margin-top:.475rem}atomic-result-section-emphasized{font-weight:500;--font-size:var(--atomic-text-2xl);font-size:var(--font-size);--line-height:calc(var(--font-size)*var(--atomic-line-height-ratio));line-height:var(--line-height)}atomic-result-section-excerpt{--font-size:var(--atomic-text-base);font-size:var(--font-size);--line-height:calc(var(--font-size)*var(--atomic-line-height-ratio));display:-webkit-box;line-height:var(--line-height);margin-top:1.25rem;overflow:hidden;-webkit-box-orient:vertical;-webkit-line-clamp:2}atomic-result-section-bottom-metadata{--font-size:var(--atomic-text-sm);font-size:var(--font-size);--line-height:calc(var(--font-size)*var(--atomic-line-height-ratio));line-height:var(--line-height);margin-top:1rem;max-height:3rem}atomic-result-section-children{--font-size:var(--atomic-text-base);font-size:var(--font-size);--line-height:calc(var(--font-size)*var(--atomic-line-height-ratio));line-height:var(--line-height);margin-top:1.25rem}}&.density-normal{atomic-result-section-visual{margin-bottom:.75rem}&.image-small{atomic-result-section-visual{height:10.25rem;width:10.25rem}}atomic-result-section-badges{--font-size:var(--atomic-text-sm);font-size:var(--font-size);--line-height:calc(var(--font-size)*var(--atomic-line-height-ratio));line-height:var(--line-height);margin-bottom:1rem;--row-height:2rem}atomic-result-section-actions{--font-size:var(--atomic-text-base);font-size:var(--font-size);--line-height:calc(var(--font-size)*var(--atomic-line-height-ratio));line-height:var(--line-height);margin-top:1rem;--row-height:2rem}atomic-result-section-title{--font-size:var(--atomic-text-lg);font-size:var(--font-size);--line-height:calc(var(--font-size)*var(--atomic-line-height-ratio));display:-webkit-box;line-height:var(--line-height);max-height:3rem;overflow:hidden;-webkit-box-orient:vertical;-webkit-line-clamp:2}atomic-result-section-title-metadata{--font-size:var(--atomic-text-sm);font-size:var(--font-size);--line-height:calc(var(--font-size)*var(--atomic-line-height-ratio));line-height:var(--line-height);margin-top:.475rem}atomic-result-section-emphasized{font-weight:500;--font-size:var(--atomic-text-2xl);font-size:var(--font-size);--line-height:calc(var(--font-size)*var(--atomic-line-height-ratio));line-height:var(--line-height)}atomic-result-section-excerpt{--font-size:var(--atomic-text-base);font-size:var(--font-size);--line-height:calc(var(--font-size)*var(--atomic-line-height-ratio));display:-webkit-box;line-height:var(--line-height);margin-top:1rem;overflow:hidden;-webkit-box-orient:vertical;-webkit-line-clamp:2}atomic-result-section-bottom-metadata{--font-size:var(--atomic-text-sm);font-size:var(--font-size);--line-height:calc(var(--font-size)*var(--atomic-line-height-ratio));line-height:var(--line-height);margin-top:.75rem;max-height:3rem}atomic-result-section-children{--font-size:var(--atomic-text-base);font-size:var(--font-size);--line-height:calc(var(--font-size)*var(--atomic-line-height-ratio));line-height:var(--line-height);margin-top:1rem}}&.density-compact{atomic-result-section-visual{margin-bottom:.5rem}&.image-large{atomic-result-section-visual{width:100%}}&.image-small{atomic-result-section-visual{height:10.25rem;width:10.25rem}}atomic-result-section-badges{--font-size:var(--atomic-text-sm);font-size:var(--font-size);--line-height:calc(var(--font-size)*var(--atomic-line-height-ratio));line-height:var(--line-height);margin-bottom:1rem;--row-height:2rem}atomic-result-section-actions{--font-size:var(--atomic-text-base);font-size:var(--font-size);--line-height:calc(var(--font-size)*var(--atomic-line-height-ratio));line-height:var(--line-height);margin-top:.75rem;--row-height:2rem}atomic-result-section-title{--font-size:var(--atomic-text-lg);font-size:var(--font-size);--line-height:calc(var(--font-size)*var(--atomic-line-height-ratio));display:-webkit-box;line-height:var(--line-height);max-height:3rem;overflow:hidden;-webkit-box-orient:vertical;-webkit-line-clamp:2}atomic-result-section-title-metadata{--font-size:var(--atomic-text-sm);font-size:var(--font-size);--line-height:calc(var(--font-size)*var(--atomic-line-height-ratio));line-height:var(--line-height);margin-top:.475rem}atomic-result-section-emphasized{font-weight:500;--font-size:var(--atomic-text-2xl);font-size:var(--font-size);--line-height:calc(var(--font-size)*var(--atomic-line-height-ratio));line-height:var(--line-height)}atomic-result-section-excerpt{--font-size:var(--atomic-text-base);font-size:var(--font-size);--line-height:calc(var(--font-size)*var(--atomic-line-height-ratio));display:-webkit-box;line-height:var(--line-height);margin-top:.75rem;overflow:hidden;-webkit-box-orient:vertical;-webkit-line-clamp:1}atomic-result-section-bottom-metadata{--font-size:var(--atomic-text-sm);font-size:var(--font-size);--line-height:calc(var(--font-size)*var(--atomic-line-height-ratio));line-height:var(--line-height);margin-top:.5rem;max-height:3rem}atomic-result-section-children{--font-size:var(--atomic-text-base);font-size:var(--font-size);--line-height:calc(var(--font-size)*var(--atomic-line-height-ratio));line-height:var(--line-height);margin-top:.75rem}}&.image-small{atomic-result-section-visual{aspect-ratio:1/1;height:auto;@supports not (aspect-ratio:1/1){height:9rem}width:100%}}&.image-icon{atomic-result-section-visual{height:2rem;width:2rem}}&.image-none{atomic-result-section-visual{display:none}}}}}&.display-table{&.image-large.density-compact{atomic-result-section-visual{height:10.25rem;width:10.25rem}}atomic-result-section-children{atomic-insight-result-children::part(children-root),atomic-result-children::part(children-root){border-color:var(--atomic-neutral);border-radius:16px;border-style:var(--tw-border-style);border-width:1px}}&.density-comfortable{atomic-result-section-visual{margin-right:1.5rem}atomic-result-section-actions,atomic-result-section-badges{margin-bottom:1.5rem;--row-height:2rem}atomic-result-section-title{--font-size:var(--atomic-text-2xl);font-size:var(--font-size);--line-height:calc(var(--font-size)*var(--atomic-line-height-ratio));line-height:var(--line-height)}atomic-result-section-excerpt{margin-top:1.75rem;--font-size:var(--atomic-text-lg);font-size:var(--font-size);--line-height:calc(var(--font-size)*var(--atomic-line-height-ratio));display:-webkit-box;line-height:var(--line-height);max-height:4.5rem;overflow:hidden;-webkit-box-orient:vertical;-webkit-line-clamp:3}atomic-result-section-bottom-metadata{margin-top:1.25rem;--font-size:var(--atomic-text-sm);font-size:var(--font-size);--line-height:calc(var(--font-size)*var(--atomic-line-height-ratio));line-height:var(--line-height);max-height:4rem}atomic-result-section-title-metadata{margin-top:.475rem}atomic-insight-result-children,atomic-result-children{&::part(children-root){border-color:var(--atomic-neutral);border-radius:16px;border-style:var(--tw-border-style);border-width:1px;margin-top:1.25rem;padding:1.75rem}&::part(show-hide-button){margin-bottom:1.25rem;margin-top:1.25rem}}atomic-insight-result-children,atomic-result-children{&::part(children-root){border-color:var(--atomic-neutral);border-radius:16px;border-style:var(--tw-border-style);border-width:1px;margin-top:1.25rem;padding:1.75rem}&::part(show-hide-button){margin-bottom:1.25rem;margin-top:1.25rem}}&.child-result:not(.last-child),.placeholder{margin-bottom:1.75rem}}&.density-normal{atomic-result-section-visual{margin-right:1rem}atomic-result-section-actions,atomic-result-section-badges{margin-bottom:1rem;--row-height:2rem}atomic-result-section-title{--font-size:var(--atomic-text-xl);font-size:var(--font-size);--line-height:calc(var(--font-size)*var(--atomic-line-height-ratio));line-height:var(--line-height)}atomic-result-section-excerpt{margin-top:1.25rem;--font-size:var(--atomic-text-base);font-size:var(--font-size);--line-height:calc(var(--font-size)*var(--atomic-line-height-ratio));display:-webkit-box;line-height:var(--line-height);max-height:2.5rem;overflow:hidden;-webkit-box-orient:vertical;-webkit-line-clamp:2}atomic-result-section-bottom-metadata{margin-top:.875rem;--font-size:var(--atomic-text-sm);font-size:var(--font-size);--line-height:calc(var(--font-size)*var(--atomic-line-height-ratio));line-height:var(--line-height);max-height:3.5rem}atomic-result-section-title-metadata{margin-top:.475rem}atomic-insight-result-children,atomic-result-children{&::part(children-root){border-color:var(--atomic-neutral);border-radius:16px;border-style:var(--tw-border-style);border-width:1px;margin-top:.875rem;padding:1.5rem}&::part(show-hide-button){margin-bottom:.875rem;margin-top:.875rem}}atomic-insight-result-children,atomic-result-children{&::part(children-root){border-color:var(--atomic-neutral);border-radius:16px;border-style:var(--tw-border-style);border-width:1px;margin-top:.875rem;padding:1.5rem}&::part(show-hide-button){margin-bottom:.875rem;margin-top:.875rem}}&.child-result:not(.last-child),.placeholder{margin-bottom:1.5rem}}&.density-compact{atomic-result-section-visual{margin-right:1rem}atomic-result-section-actions,atomic-result-section-badges{margin-bottom:1rem;--row-height:2rem}atomic-result-section-title{--font-size:var(--atomic-text-xl);font-size:var(--font-size);--line-height:calc(var(--font-size)*var(--atomic-line-height-ratio));line-height:var(--line-height)}atomic-result-section-excerpt{margin-top:1rem;--font-size:var(--atomic-text-base);font-size:var(--font-size);--line-height:calc(var(--font-size)*var(--atomic-line-height-ratio));display:-webkit-box;line-height:var(--line-height);max-height:1.25rem;overflow:hidden;-webkit-box-orient:vertical;-webkit-line-clamp:1}atomic-result-section-bottom-metadata{margin-top:.6875rem;--font-size:var(--atomic-text-sm);font-size:var(--font-size);--line-height:calc(var(--font-size)*var(--atomic-line-height-ratio));line-height:var(--line-height);max-height:3.25rem}atomic-result-section-title-metadata{margin-top:.475rem}atomic-insight-result-children,atomic-result-children{&::part(children-root){border-color:var(--atomic-neutral);border-radius:16px;border-style:var(--tw-border-style);border-width:1px;margin-top:.475rem;padding:1rem}&::part(show-hide-button){margin-bottom:.475rem;margin-top:.475rem}}atomic-insight-result-children,atomic-result-children{&::part(children-root){border-color:var(--atomic-neutral);border-radius:16px;border-style:var(--tw-border-style);border-width:1px;margin-top:.475rem;padding:1rem}&::part(show-hide-button){margin-bottom:.475rem;margin-top:.475rem}}&.child-result:not(.last-child),.placeholder{margin-bottom:1rem}}&.image-large,&.image-small{grid-template-areas:"badges badges          .               actions" "visual title           title           title" "visual title-metadata  title-metadata  title-metadata" "visual emphasized      emphasized      emphasized" "visual excerpt         excerpt         excerpt" "visual bottom-metadata bottom-metadata bottom-metadata" "visual children        children        children";grid-template-columns:minmax(0,min-content) auto 1fr auto;grid-template-rows:repeat(6,auto) minmax(0,1fr)}&.image-large.density-comfortable,&.image-large.density-normal{atomic-result-section-visual{height:20.375rem;width:20.375rem}}&.image-large.density-compact,&.image-small{atomic-result-section-visual{height:10rem;width:10rem}}&.image-icon{grid-template-areas:"badges badges          .               actions" "visual title           title           title" "visual title-metadata  title-metadata  title-metadata" "visual emphasized      emphasized      emphasized" "visual excerpt         excerpt         excerpt" "visual bottom-metadata bottom-metadata bottom-metadata" "visual children        children        children";grid-template-columns:minmax(0,min-content) auto 1fr auto;grid-template-rows:repeat(7,minmax(0,min-content));atomic-result-section-visual{height:2rem;width:2rem}}&.image-none{grid-template-areas:"badges          .               actions" "title           title           title" "title-metadata  title-metadata  title-metadata" "emphasized      emphasized      emphasized" "excerpt         excerpt         excerpt" "bottom-metadata bottom-metadata bottom-metadata" "children        children        children";grid-template-columns:auto 1fr auto;grid-template-rows:repeat(6,auto);atomic-result-section-visual{display:none}}}}atomic-table-element{display:none}}.link-container{display:none}}position:relative;.with-sections:not(.child-result){padding:var(--atomic-layout-spacing-y) var(--atomic-layout-spacing-x)}}:host(:hover) .with-sections{background-color:var(--atomic-neutral-lighter)}:host(:hover) atomic-insight-result-action-bar{visibility:visible}:host(:first-of-type) .with-sections:not(.child-result){padding-top:2rem}:host(:first-of-type) atomic-insight-result-action-bar{top:0}@property --tw-font-weight{syntax:"*";inherits:false}@property --tw-border-style{syntax:"*";inherits:false;initial-value:solid}@layer properties{@supports ((-webkit-hyphens:none) and (not (margin-trim:inline))) or ((-moz-orient:inline) and (not (color:rgb(from red r g b)))){*,::backdrop,:after,:before{--tw-font-weight:initial;--tw-border-style:solid}}}`;
+__decorate([
+    state()
+], AtomicInsightResult.prototype, "error", void 0);
+__decorate([
+    property({
+        attribute: 'stop-propagation',
+        type: Boolean,
+        converter: booleanConverter,
+        reflect: true,
+    })
+], AtomicInsightResult.prototype, "stopPropagation", void 0);
+__decorate([
+    property({ type: Object })
+], AtomicInsightResult.prototype, "result", void 0);
+__decorate([
+    property({ type: Object, attribute: 'interactive-result' })
+], AtomicInsightResult.prototype, "interactiveResult", void 0);
+__decorate([
+    property({ type: Object })
+], AtomicInsightResult.prototype, "store", void 0);
+__decorate([
+    property({ type: Object })
+], AtomicInsightResult.prototype, "content", void 0);
+__decorate([
+    property({ reflect: true, type: String })
+], AtomicInsightResult.prototype, "density", void 0);
+__decorate([
+    property({ reflect: true, type: String, attribute: 'image-size' })
+], AtomicInsightResult.prototype, "imageSize", void 0);
+__decorate([
+    property({ type: String })
+], AtomicInsightResult.prototype, "classes", void 0);
+__decorate([
+    property({ type: String, attribute: 'loading-flag' })
+], AtomicInsightResult.prototype, "loadingFlag", void 0);
+__decorate([
+    property({ type: Object, attribute: 'rendering-function' })
+], AtomicInsightResult.prototype, "renderingFunction", void 0);
+AtomicInsightResult = __decorate([
+    customElement('atomic-insight-result'),
+    withTailwindStyles
+], AtomicInsightResult);
+export { AtomicInsightResult };

package/dist/atomic/components/components/insight/atomic-insight-result-template/atomic-insight-result-template.js

@@ -5,12 +5,13 @@ var __decorate = (this && this.__decorate) || function (decorators, target, key,
     return c > 3 && r && Object.defineProperty(target, key, r), r;
 };
 import { ResultTemplatesHelpers as InsightResultTemplatesHelpers } from '@coveo/headless/insight';
-import { html, LitElement, nothing } from 'lit';
+import { LitElement, nothing } from 'lit';
 import { customElement, property, state } from 'lit/decorators.js';
 import { ResultTemplateController } from "../../common/result-templates/result-template-controller";
 import { makeMatchConditions } from "../../common/template-controller/template-utils";
 import { arrayConverter } from "../../../converters/array-converter";
 import { errorGuard } from "../../../decorators/error-guard";
+import "../atomic-insight-result/atomic-insight-result.js";
 import { withTailwindStyles } from "../../../decorators/with-tailwind-styles.js";
 import { mapProperty } from "../../../utils/props-utils";
 /**
@@ -42,7 +43,7 @@ let AtomicInsightResultTemplate = class AtomicInsightResultTemplate extends LitE
         this.resultTemplateController.matchConditions = makeMatchConditions(this.mustMatch, this.mustNotMatch, InsightResultTemplatesHelpers);
     }
     render() {
-        return html `${nothing}`;
+        return nothing;
     }
     /**
      * Gets the appropriate result template based on conditions applied.

package/dist/atomic/components/components/insight/atomic-insight-search-box/atomic-insight-search-box.js

@@ -0,0 +1,334 @@
+var __decorate = (this && this.__decorate) || function (decorators, target, key, desc) {
+    var c = arguments.length, r = c < 3 ? target : desc === null ? desc = Object.getOwnPropertyDescriptor(target, key) : desc, d;
+    if (typeof Reflect === "object" && typeof Reflect.decorate === "function") r = Reflect.decorate(decorators, target, key, desc);
+    else for (var i = decorators.length - 1; i >= 0; i--) if (d = decorators[i]) r = (c < 3 ? d(r) : c > 3 ? d(target, key, r) : d(target, key)) || r;
+    return c > 3 && r && Object.defineProperty(target, key, r), r;
+};
+import { buildSearchBox as buildInsightSearchBox, loadInsightSearchActions, } from '@coveo/headless/insight';
+import { html, LitElement, nothing } from 'lit';
+import { customElement, property, state } from 'lit/decorators.js';
+import { classMap } from 'lit/directives/class-map.js';
+import { createRef, ref, } from 'lit/directives/ref.js';
+import { renderSearchBoxWrapper } from "../../common/search-box/search-box-wrapper";
+import { renderSearchBoxTextArea } from "../../common/search-box/search-text-area";
+import { getPartialSearchBoxSuggestionElement, renderQuerySuggestion, } from "../../common/suggestions/query-suggestions";
+import { SuggestionManager } from "../../common/suggestions/suggestion-manager";
+import { elementHasQuery } from "../../common/suggestions/suggestions-utils";
+import { bindStateToController } from "../../../decorators/bind-state";
+import { bindings } from "../../../decorators/bindings";
+import { errorGuard } from "../../../decorators/error-guard";
+import { withTailwindStyles } from "../../../decorators/with-tailwind-styles";
+import { AriaLiveRegionController } from "../../../utils/accessibility-utils";
+import { hasKeyboard, isMacOS } from "../../../utils/device-utils";
+import { isFocusingOut, randomID } from "../../../utils/utils";
+const SearchSlimIcon = "<svg width=\"17\" height=\"17\" viewBox=\"0 0 17 17\" fill=\"none\" xmlns=\"http://www.w3.org/2000/svg\">\n<circle cx=\"7\" cy=\"7\" r=\"6.5\" stroke=\"currentColor\"/>\n<path d=\"M16 16L12 12\" stroke=\"currentColor\" stroke-linecap=\"round\" stroke-linejoin=\"round\"/>\n</svg>\n";
+import "../../common/atomic-icon/atomic-icon";
+import { bindingGuard } from "../../../decorators/binding-guard";
+import styles from './atomic-insight-search-box.tw.css';
+/**
+ * The `atomic-insight-search-box` component allows users to enter and submit search queries within the Insight interface.
+ * It provides query suggestions as the user types.
+ *
+ * @part wrapper - The wrapper around the entire search box.
+ * @part submit-icon - The search icon displayed in the search box.
+ * @part textarea - The text area where users enter their search queries.
+ * @part textarea-expander - The container that allows the textarea to expand.
+ * @part clear-button-wrapper - The wrapper for the clear button.
+ * @part clear-icon - The icon in the clear button.
+ * @part suggestions-wrapper - The wrapper around the suggestions panel.
+ * @part suggestions - The container for the suggestions.
+ */
+let AtomicInsightSearchBox = class AtomicInsightSearchBox extends LitElement {
+    constructor() {
+        super(...arguments);
+        this.isExpanded = false;
+        /**
+         * Whether to prevent the user from triggering a search from the component.
+         * Perfect for use cases where you need to disable the search conditionally, like when the input is empty.
+         */
+        this.disableSearch = false;
+        /**
+         * The number of query suggestions to display when interacting with the search box.
+         */
+        this.numberOfSuggestions = 5;
+        this.textAreaRef = createRef();
+        this.searchBoxAriaMessage = new AriaLiveRegionController(this, 'search-box');
+        this.suggestionsAriaMessage = new AriaLiveRegionController(this, 'search-suggestions', true);
+    }
+    initialize() {
+        this.searchBoxId = randomID('atomic-search-box-');
+        const searchBoxOptions = {
+            id: this.searchBoxId,
+            numberOfSuggestions: 0,
+            highlightOptions: {
+                notMatchDelimiters: {
+                    open: '<span class="font-bold">',
+                    close: '</span>',
+                },
+                correctionDelimiters: {
+                    open: '<span class="font-normal">',
+                    close: '</span>',
+                },
+            },
+        };
+        const { fetchQuerySuggestions, registerQuerySuggest } = loadInsightSearchActions(this.bindings.engine);
+        this.searchBox = buildInsightSearchBox(this.bindings.engine, {
+            options: searchBoxOptions,
+        });
+        this.bindings.engine.dispatch(registerQuerySuggest({
+            id: this.searchBoxId,
+            count: this.numberOfSuggestions,
+        }));
+        this.suggestionManager = new SuggestionManager({
+            getNumberOfSuggestionsToDisplay: () => this.numberOfSuggestions,
+            updateQuery: (query) => this.searchBox.updateText(query),
+            getSearchBoxValue: () => this.searchBoxState.value,
+            getSuggestionTimeout: () => 500,
+            getSuggestionDelay: () => 0,
+            getHost: () => this,
+            getLogger: () => this.bindings.engine.logger,
+        });
+        this.suggestionManager.registerSuggestions({
+            position: 0,
+            renderItems: () => this.searchBox.state.suggestions.map((suggestion) => this.renderSuggestionItem(suggestion)),
+            onInput: () => this.bindings.engine.dispatch(fetchQuerySuggestions({ id: this.searchBoxId })),
+            panel: 'left',
+        });
+    }
+    onSubmit() {
+        if (this.suggestionManager.activeDescendantElement) {
+            this.suggestionManager.clickOnActiveElement();
+            return;
+        }
+        this.searchBox.submit();
+        this.suggestionManager.clearSuggestions();
+    }
+    async onKeyDown(e) {
+        if (this.disableSearch) {
+            return;
+        }
+        switch (e.key) {
+            case 'Enter':
+                this.onSubmit();
+                break;
+            case 'Escape':
+                this.suggestionManager.clearSuggestions();
+                break;
+            case 'ArrowDown':
+                e.preventDefault();
+                await this.suggestionManager.focusNextValue();
+                this.announceNewActiveSuggestionToScreenReader();
+                break;
+            case 'ArrowUp':
+                e.preventDefault();
+                await this.suggestionManager.focusPreviousValue();
+                this.announceNewActiveSuggestionToScreenReader();
+                break;
+            case 'Tab':
+                this.suggestionManager.clearSuggestions();
+                break;
+        }
+    }
+    triggerTextAreaChange(value) {
+        if (!this.textAreaRef.value) {
+            return;
+        }
+        this.textAreaRef.value.value = value;
+        this.textAreaRef.value.dispatchEvent(new window.Event('change'));
+    }
+    renderSuggestion(item, index, lastIndex) {
+        const id = `${this.searchBoxId}-suggestion-${item.key}`;
+        const isSelected = id === this.suggestionManager.activeDescendant ||
+            this.suggestionManager.suggestedQuery === item.query;
+        if (index === lastIndex && item.hideIfLast) {
+            return nothing;
+        }
+        return html `<atomic-suggestion-renderer
+      .i18n=${this.bindings.i18n}
+      .id=${id}
+      .suggestion=${item}
+      .isSelected=${isSelected}
+      .side=${'left'}
+      .index=${index}
+      .lastIndex=${lastIndex}
+      .isDoubleList=${false}
+      @click=${(e) => {
+            this.suggestionManager.onSuggestionClick(item, e);
+        }}
+      @mouseover=${() => {
+            this.suggestionManager.onSuggestionMouseOver(item, 'left', id);
+        }}
+    ></atomic-suggestion-renderer>`;
+    }
+    renderSuggestionItem(suggestion) {
+        const hasQuery = this.searchBox.state.value !== '';
+        const partialItem = getPartialSearchBoxSuggestionElement(suggestion, this.bindings.i18n);
+        return {
+            ...partialItem,
+            content: renderQuerySuggestion({
+                icon: SearchSlimIcon,
+                hasQuery,
+                suggestion,
+                hasMultipleKindOfSuggestions: false,
+                alwaysShowIcon: this.searchBoxState.suggestions.length > 1,
+            }),
+            onSelect: () => {
+                this.searchBox.selectSuggestion(suggestion.rawValue);
+            },
+        };
+    }
+    renderPanel(elements, setRef, getRef) {
+        if (!elements.length) {
+            return nothing;
+        }
+        return html `<div
+      part="suggestions"
+      ${ref(setRef)}
+      class="flex grow basis-1/2 flex-col"
+      @mousedown=${(e) => {
+            if (e.target === getRef()) {
+                e.preventDefault();
+            }
+        }}
+    >
+      ${elements.map((suggestion, index) => this.renderSuggestion(suggestion, index, elements.length - 1))}
+    </div>`;
+    }
+    renderSuggestions() {
+        if (!this.suggestionManager.hasSuggestions) {
+            this.suggestionManager.updateActiveDescendant();
+            return nothing;
+        }
+        const isVisible = this.suggestionManager.hasSuggestions && this.isExpanded;
+        const classes = {
+            'bg-background border-neutral absolute top-full left-0 z-10 flex w-full rounded-md border': true,
+            hidden: !isVisible,
+        };
+        return html `<div
+      id="${this.searchBoxId}-popup"
+      part="suggestions-wrapper"
+      class=${classMap(classes)}
+      role="application"
+      aria-label=${this.bindings.i18n.t('search-suggestions-single-list')}
+      aria-activedescendant=${this.suggestionManager.activeDescendant}
+    >
+      ${this.renderPanel(this.suggestionManager.allSuggestionElements, (el) => {
+            this.suggestionManager.leftPanel = el;
+        }, () => this.suggestionManager.leftPanel)}
+    </div>`;
+    }
+    getSearchInputLabel() {
+        if (isMacOS()) {
+            return this.bindings.i18n.t('search-box-with-suggestions-macos');
+        }
+        if (!hasKeyboard()) {
+            return this.bindings.i18n.t('search-box-with-suggestions-keyboardless');
+        }
+        return this.bindings.i18n.t('search-box-with-suggestions');
+    }
+    async onFocus() {
+        if (this.isExpanded) {
+            return;
+        }
+        this.isExpanded = true;
+        await this.suggestionManager.triggerSuggestions();
+        this.announceNewSuggestionsToScreenReader();
+    }
+    async onInput(value) {
+        this.searchBox.updateText(value);
+        this.isExpanded = true;
+        await this.suggestionManager.triggerSuggestions();
+        this.announceNewSuggestionsToScreenReader();
+    }
+    announceNewActiveSuggestionToScreenReader() {
+        const ariaLabel = this.suggestionManager.activeDescendantElement?.ariaLabel;
+        if (isMacOS() && ariaLabel) {
+            this.suggestionsAriaMessage.message = ariaLabel;
+        }
+    }
+    announceNewSuggestionsToScreenReader() {
+        const numberOfSuggestionsToAnnounce = this.suggestionManager.allSuggestionElements.filter(elementHasQuery).length;
+        this.searchBoxAriaMessage.message = numberOfSuggestionsToAnnounce
+            ? this.bindings.i18n.t(this.searchBoxState.value
+                ? 'query-suggestions-available'
+                : 'query-suggestions-available-no-query', {
+                count: numberOfSuggestionsToAnnounce,
+                query: this.searchBoxState.value,
+            })
+            : this.bindings.i18n.t('query-suggestions-unavailable');
+    }
+    render() {
+        return html `${renderSearchBoxWrapper({
+            props: {
+                disabled: this.disableSearch,
+                onFocusout: (event) => {
+                    if (!isFocusingOut(event)) {
+                        return;
+                    }
+                    this.suggestionManager.clearSuggestions();
+                    this.isExpanded = false;
+                },
+            },
+        })(html `
+      <atomic-icon
+        part="submit-icon"
+        .icon=${SearchSlimIcon}
+        class="my-auto mr-0 ml-4 h-4 w-4"
+      ></atomic-icon>
+      ${renderSearchBoxTextArea({
+            props: {
+                textAreaRef: this.textAreaRef,
+                loading: this.searchBoxState.isLoading,
+                i18n: this.bindings.i18n,
+                value: this.searchBoxState.value,
+                ariaLabel: this.getSearchInputLabel(),
+                title: this.bindings.i18n.t('search'),
+                onClear: () => {
+                    this.searchBox.clear();
+                    this.triggerTextAreaChange('');
+                },
+                popup: {
+                    id: `${this.searchBoxId}-popup`,
+                    activeDescendant: this.suggestionManager.activeDescendant || '',
+                    expanded: this.isExpanded && this.suggestionManager.hasSuggestions,
+                    hasSuggestions: this.suggestionManager.hasSuggestions,
+                },
+                onInput: (e) => this.onInput(e.target.value),
+                onFocus: () => this.onFocus(),
+                onKeyDown: (e) => this.onKeyDown(e),
+            },
+        })}
+      ${this.renderSuggestions()}
+    `)}`;
+    }
+};
+AtomicInsightSearchBox.styles = styles;
+__decorate([
+    state()
+], AtomicInsightSearchBox.prototype, "bindings", void 0);
+__decorate([
+    state()
+], AtomicInsightSearchBox.prototype, "error", void 0);
+__decorate([
+    bindStateToController('searchBox'),
+    state()
+], AtomicInsightSearchBox.prototype, "searchBoxState", void 0);
+__decorate([
+    state()
+], AtomicInsightSearchBox.prototype, "isExpanded", void 0);
+__decorate([
+    property({ type: Boolean, reflect: true, attribute: 'disable-search' })
+], AtomicInsightSearchBox.prototype, "disableSearch", void 0);
+__decorate([
+    property({ type: Number, reflect: true, attribute: 'number-of-suggestions' })
+], AtomicInsightSearchBox.prototype, "numberOfSuggestions", void 0);
+__decorate([
+    errorGuard(),
+    bindingGuard()
+], AtomicInsightSearchBox.prototype, "render", null);
+AtomicInsightSearchBox = __decorate([
+    customElement('atomic-insight-search-box'),
+    bindings(),
+    withTailwindStyles
+], AtomicInsightSearchBox);
+export { AtomicInsightSearchBox };