@coveo/atomic 3.35.0-pre.cb00784f95 → 3.35.0-pre.ce906cf5b7

package/dist/atomic/p-d1fbb20a.entry.js.map

@@ -1 +0,0 @@
-{"version":3,"names":["atomicResultPlaceholderCss","AtomicResultPlaceholderStyle0","placeholderClasses","AtomicResultPlaceholder","renderExcerptLine","width","h","style","height","class","render","key","getItemDisplayClasses","this","display","density","imageSize","join","trim","Array","from","length","AtomicResultSectionActions","componentDidRender","hideEmptySection","host","AtomicResultSectionBadges","AtomicResultSectionBottomMetadata","AtomicResultSectionExcerpt","AtomicResultSectionTitle","AtomicResultSectionVisual","atomicResultTablePlaceholderCss","AtomicResultTablePlaceholderStyle0","AtomicResultTablePlaceholder","getClasses","rows"],"sources":["src/components/common/atomic-result-placeholder/atomic-result-placeholder.pcss?tag=atomic-result-placeholder&encapsulation=shadow","src/components/common/atomic-result-placeholder/atomic-result-placeholder.tsx","src/components/search/result-template-components/atomic-result-sections/atomic-result-section-actions.tsx","src/components/search/result-template-components/atomic-result-sections/atomic-result-section-badges.tsx","src/components/search/result-template-components/atomic-result-sections/atomic-result-section-bottom-metadata.tsx","src/components/search/result-template-components/atomic-result-sections/atomic-result-section-excerpt.tsx","src/components/search/result-template-components/atomic-result-sections/atomic-result-section-title.tsx","src/components/search/result-template-components/atomic-result-sections/atomic-result-section-visual.tsx","src/components/search/atomic-result-table-placeholder/atomic-result-table-placeholder.pcss?tag=atomic-result-table-placeholder&encapsulation=shadow","src/components/search/atomic-result-table-placeholder/atomic-result-table-placeholder.tsx"],"sourcesContent":["@import '../../../global/global.pcss';\n\n@import '../template-system/template-system.pcss';\n\n:host {\n  @apply atomic-template-system;\n\n  .result-root {\n    &.display-grid {\n      atomic-result-section-actions {\n        display: none;\n      }\n    }\n\n    .badge {\n      width: 14rem;\n    }\n\n    .action {\n      width: 10rem;\n    }\n\n    .title {\n      display: grid;\n      grid-auto-flow: column;\n      grid-gap: 0.5rem;\n      height: var(--line-height);\n      width: 30rem;\n      max-width: 100%;\n    }\n\n    .fields-placeholder {\n      display: grid;\n      grid-template-columns: repeat(auto-fill, min(11rem, 40%));\n      grid-column-gap: 0.5rem;\n\n      .field-value-placeholder {\n        height: var(--font-size);\n        margin: calc((var(--line-height) - var(--font-size)) / 2) 0;\n      }\n    }\n  }\n}\n","import {Component, h, Prop} from '@stencil/core';\nimport {\n  ItemDisplayLayout,\n  ItemDisplayDensity,\n  ItemDisplayImageSize,\n  getItemDisplayClasses,\n} from '../../common/layout/display-options';\n\nconst placeholderClasses = 'block bg-neutral w-full h-full rounded';\n\n/**\n * The `atomic-result-placeholder` component provides an intermediate visual state that is rendered before the first results are available.\n * @internal\n */\n@Component({\n  tag: 'atomic-result-placeholder',\n  styleUrl: 'atomic-result-placeholder.pcss',\n  shadow: true,\n})\nexport class AtomicResultPlaceholder {\n  @Prop() display!: ItemDisplayLayout;\n  @Prop() density!: ItemDisplayDensity;\n  @Prop() imageSize!: ItemDisplayImageSize;\n\n  private renderExcerptLine(width: string) {\n    return (\n      <div\n        style={{\n          height: 'var(--line-height)',\n          width,\n        }}\n      >\n        <div\n          class={placeholderClasses}\n          style={{height: 'var(--font-size)'}}\n        ></div>\n      </div>\n    );\n  }\n\n  public render() {\n    return (\n      <div\n        class={`result-root placeholder with-sections animate-pulse ${getItemDisplayClasses(\n          this.display,\n          this.density,\n          this.imageSize\n        )\n          .join(' ')\n          .trim()}`}\n      >\n        <atomic-result-section-visual>\n          <div class={placeholderClasses}></div>\n        </atomic-result-section-visual>\n        <atomic-result-section-badges>\n          <div class={`badge ${placeholderClasses}`}></div>\n        </atomic-result-section-badges>\n        <atomic-result-section-actions>\n          <div class={`action ${placeholderClasses}`}></div>\n        </atomic-result-section-actions>\n        <atomic-result-section-title>\n          <div class={`title ${placeholderClasses}`}></div>\n        </atomic-result-section-title>\n        <atomic-result-section-excerpt>\n          {this.renderExcerptLine('100%')}\n          {this.renderExcerptLine('95%')}\n          {this.renderExcerptLine('98%')}\n        </atomic-result-section-excerpt>\n        <atomic-result-section-bottom-metadata>\n          <div class=\"fields-placeholder\">\n            {Array.from({length: 4}, () => (\n              <div\n                class={`field-value-placeholder ${placeholderClasses}`}\n              ></div>\n            ))}\n          </div>\n        </atomic-result-section-bottom-metadata>\n      </div>\n    );\n  }\n}\n","import {Element, Component} from '@stencil/core';\nimport {hideEmptySection} from '../../../../utils/item-section-utils';\n\n/**\n * This section allows the information seeker to perform an action on an item without having to view its details.\n * For example, in Commerce you can add an item to the cart directly or add it to a wish list to view at a later time.\n *\n * Behavior:\n * * Exposes the `--line-height` CSS variable so child elements can adjust to the current line height.\n * ** You should ensure that elements inside of it have `height: var(--line-height)`.\n * * Is a wrapping flexbox with a gap.\n * * May appear over, next to, or beneath the visual section.\n */\n@Component({\n  tag: 'atomic-result-section-actions',\n  shadow: false,\n})\nexport class AtomicResultSectionActions {\n  @Element() private host!: HTMLElement;\n\n  public componentDidRender() {\n    hideEmptySection(this.host);\n  }\n}\n","import {Element, Component} from '@stencil/core';\nimport {hideEmptySection} from '../../../../utils/item-section-utils';\n\n/**\n * This section provides badges that highlight special features of the item.\n *\n * Behavior:\n * * Exposes the `--line-height` CSS variable so child elements can adjust to the current line height.\n * ** You should ensure that elements inside of it have `height: var(--line-height)`.\n * * Is a wrapping flexbox with a gap.\n * * May appear over, next to, or beneath the visual section.\n */\n@Component({\n  tag: 'atomic-result-section-badges',\n  shadow: false,\n})\nexport class AtomicResultSectionBadges {\n  @Element() private host!: HTMLElement;\n\n  public componentDidRender() {\n    hideEmptySection(this.host);\n  }\n}\n","import {Element, Component} from '@stencil/core';\nimport {hideEmptySection} from '../../../../utils/item-section-utils';\n\n/**\n * This section displays additional descriptive information about the item.\n *\n * Behavior:\n * * Has a maximum height of two lines.\n * ** We recommend that you use `atomic-result-fields-list` to ensure that the fields in this section don’t overflow.\n * * Exposes the `--line-height` variable so child elements can adjust to the current line height.\n * * Has a defined CSS `color` property for text.\n * * Has a font weight.\n */\n@Component({\n  tag: 'atomic-result-section-bottom-metadata',\n  shadow: false,\n})\nexport class AtomicResultSectionBottomMetadata {\n  @Element() private host!: HTMLElement;\n\n  public componentDidRender() {\n    hideEmptySection(this.host);\n  }\n}\n","import {Element, Component} from '@stencil/core';\nimport {hideEmptySection} from '../../../../utils/item-section-utils';\n\n/**\n * This section contains an informative summary of the item's content.\n *\n * Behavior:\n * * Has a fixed height of one to three lines, depending on the layout and density.\n * * Ellipses overflowing text.\n * * Exposes the `--line-height` CSS variable so child elements can adjust to the current line height.\n * * Has a defined CSS `color` property for text.\n */\n@Component({\n  tag: 'atomic-result-section-excerpt',\n  shadow: false,\n})\nexport class AtomicResultSectionExcerpt {\n  @Element() private host!: HTMLElement;\n\n  public componentDidRender() {\n    hideEmptySection(this.host);\n  }\n}\n","import {Element, Component} from '@stencil/core';\nimport {hideEmptySection} from '../../../../utils/item-section-utils';\n\n/**\n * This section identifies the item by its name, and its main use is to make the result list scannable.\n * This is usually the page title.\n *\n * Behavior:\n * * Has a fixed height of two lines on grid layouts.\n * * Exposes the `--line-height` CSS variable so child elements can adjust to the current line height.\n * * Has a defined CSS `color` property for text.\n */\n@Component({\n  tag: 'atomic-result-section-title',\n  shadow: false,\n})\nexport class AtomicResultSectionTitle {\n  @Element() private host!: HTMLElement;\n\n  public componentDidRender() {\n    hideEmptySection(this.host);\n  }\n}\n","import {Element, Component, Prop} from '@stencil/core';\nimport {hideEmptySection} from '../../../../utils/item-section-utils';\nimport {ItemDisplayImageSize} from '../../../common/layout/display-options';\n\n/**\n * This section provides visual information about the item.\n * For example, in Commerce, an image is a great shorthand for a product category.\n * An icon can quickly show the item type, or an avatar can help identify to whom it is related.\n *\n * Behavior:\n * * Has a fixed size that depends on the specified image size, the layout, the density, and the screen size.\n * ** When the image size is set to `icon`, this section stays very small.\n * ** You should ensure that elements inside of it take the available space.\n * * Always has a 1:1 aspect ratio.\n */\n@Component({\n  tag: 'atomic-result-section-visual',\n  shadow: false,\n})\nexport class AtomicResultSectionVisual {\n  @Element() private host!: HTMLElement;\n\n  /**\n   * How large or small the visual section of results using this template should be.\n   */\n  @Prop({reflect: true}) public imageSize?: ItemDisplayImageSize;\n\n  public componentDidRender() {\n    hideEmptySection(this.host);\n  }\n}\n","@import '../../../global/global.pcss';\n@import '../../common/item-list/styles/mixins.pcss';\n\n:host {\n  display: grid;\n}\n\n.list-root.display-table {\n  @apply atomic-result-table border-neutral rounded-xl border;\n\n  thead tr,\n  tbody tr:not(:last-child) {\n    position: relative;\n\n    &::after {\n      content: ' ';\n      display: block;\n      position: absolute;\n      height: 1px;\n      bottom: 0;\n      left: var(--padding);\n      right: var(--padding);\n      @apply bg-neutral;\n    }\n  }\n\n  th,\n  td {\n    border-color: transparent;\n    border-radius: initial;\n  }\n\n  th {\n    background-color: transparent;\n  }\n}\n","import {Component, h, Prop} from '@stencil/core';\nimport {\n  ItemDisplayDensity,\n  ItemDisplayImageSize,\n  getItemDisplayClasses,\n} from '../../common/layout/display-options';\n\nconst placeholderClasses = 'block bg-neutral rounded';\n\n/**\n * The `atomic-result-table-placeholder` component provides an intermediate visual state that is rendered before the first results are available.\n * @internal\n */\n@Component({\n  tag: 'atomic-result-table-placeholder',\n  styleUrl: 'atomic-result-table-placeholder.pcss',\n  shadow: true,\n})\nexport class AtomicResultTablePlaceholder {\n  @Prop() density!: ItemDisplayDensity;\n  @Prop() imageSize!: ItemDisplayImageSize;\n  @Prop() rows!: number;\n\n  private getClasses() {\n    return getItemDisplayClasses('table', this.density, this.imageSize);\n  }\n\n  public render() {\n    return (\n      <table class={`list-root animate-pulse ${this.getClasses().join(' ')}`}>\n        <thead>\n          <tr>\n            <th>\n              <div\n                class={`mt-2 h-8 ${placeholderClasses}`}\n                style={{width: '14.5rem'}}\n              ></div>\n            </th>\n            <th>\n              <div\n                class={`mt-2 h-8 ${placeholderClasses}`}\n                style={{width: '9.75rem'}}\n              ></div>\n            </th>\n            <th>\n              <div\n                class={`mt-2 h-8 ${placeholderClasses}`}\n                style={{width: '6.5rem'}}\n              ></div>\n            </th>\n          </tr>\n        </thead>\n        <tbody>\n          {Array.from({length: this.rows}, () => (\n            <tr>\n              <td>\n                <div\n                  class={`mb-6 h-8 ${placeholderClasses}`}\n                  style={{width: '22.875rem'}}\n                ></div>\n                <div\n                  class={`mb-2 h-5 ${placeholderClasses}`}\n                  style={{width: '23.75rem'}}\n                ></div>\n                <div\n                  class={`h-5 ${placeholderClasses}`}\n                  style={{width: '11.5rem'}}\n                ></div>\n              </td>\n              <td>\n                <div\n                  class={`mt-1.5 h-5 ${placeholderClasses}`}\n                  style={{width: '11rem'}}\n                ></div>\n              </td>\n              <td>\n                <div\n                  class={`mt-1.5 h-5 ${placeholderClasses}`}\n                  style={{width: '4.875rem'}}\n                ></div>\n              </td>\n            </tr>\n          ))}\n        </tbody>\n      </table>\n    );\n  }\n}\n"],"mappings":"0NAAA,MAAMA,EAA6B,ol2WACnC,MAAAC,EAAeD,ECOf,MAAME,EAAqB,yC,MAWdC,EAAuB,M,gGAK1B,iBAAAC,CAAkBC,GACxB,OACEC,EAAA,OACEC,MAAO,CACLC,OAAQ,qBACRH,UAGFC,EAAA,OACEG,MAAOP,EACPK,MAAO,CAACC,OAAQ,sB,CAMjB,MAAAE,GACL,OACEJ,EAAA,OAAAK,IAAA,2CACEF,MAAO,uDAAuDG,EAC5DC,KAAKC,QACLD,KAAKE,QACLF,KAAKG,WAEJC,KAAK,KACLC,UAEHZ,EAAA,gCAAAK,IAAA,4CACEL,EAAA,OAAAK,IAAA,2CAAKF,MAAOP,KAEdI,EAAA,gCAAAK,IAAA,4CACEL,EAAA,OAAAK,IAAA,2CAAKF,MAAO,SAASP,OAEvBI,EAAA,iCAAAK,IAAA,4CACEL,EAAA,OAAAK,IAAA,2CAAKF,MAAO,UAAUP,OAExBI,EAAA,+BAAAK,IAAA,4CACEL,EAAA,OAAAK,IAAA,2CAAKF,MAAO,SAASP,OAEvBI,EAAA,iCAAAK,IAAA,4CACGE,KAAKT,kBAAkB,QACvBS,KAAKT,kBAAkB,OACvBS,KAAKT,kBAAkB,QAE1BE,EAAA,yCAAAK,IAAA,4CACEL,EAAA,OAAAK,IAAA,2CAAKF,MAAM,sBACRU,MAAMC,KAAK,CAACC,OAAQ,IAAI,IACvBf,EAAA,OACEG,MAAO,2BAA2BP,U,mBCvDrCoB,EAA0B,M,yBAG9B,kBAAAC,GACLC,EAAiBX,KAAKY,K,mCCLbC,EAAyB,M,yBAG7B,kBAAAH,GACLC,EAAiBX,KAAKY,K,mCCHbE,EAAiC,M,yBAGrC,kBAAAJ,GACLC,EAAiBX,KAAKY,K,mCCLbG,EAA0B,M,yBAG9B,kBAAAL,GACLC,EAAiBX,KAAKY,K,mCCJbI,EAAwB,M,yBAG5B,kBAAAN,GACLC,EAAiBX,KAAKY,K,mCCDbK,EAAyB,M,kDAQ7B,kBAAAP,GACLC,EAAiBX,KAAKY,K,6BC5B1B,MAAMM,EAAkC,678EACxC,MAAAC,EAAeD,ECMf,MAAM7B,EAAqB,2B,MAWd+B,EAA4B,M,6FAK/B,UAAAC,GACN,OAAOtB,EAAsB,QAASC,KAAKE,QAASF,KAAKG,U,CAGpD,MAAAN,GACL,OACEJ,EAAA,SAAAK,IAAA,2CAAOF,MAAO,2BAA2BI,KAAKqB,aAAajB,KAAK,QAC9DX,EAAA,SAAAK,IAAA,4CACEL,EAAA,MAAAK,IAAA,4CACEL,EAAA,MAAAK,IAAA,4CACEL,EAAA,OAAAK,IAAA,2CACEF,MAAO,YAAYP,IACnBK,MAAO,CAACF,MAAO,cAGnBC,EAAA,MAAAK,IAAA,4CACEL,EAAA,OAAAK,IAAA,2CACEF,MAAO,YAAYP,IACnBK,MAAO,CAACF,MAAO,cAGnBC,EAAA,MAAAK,IAAA,4CACEL,EAAA,OAAAK,IAAA,2CACEF,MAAO,YAAYP,IACnBK,MAAO,CAACF,MAAO,eAKvBC,EAAA,SAAAK,IAAA,4CACGQ,MAAMC,KAAK,CAACC,OAAQR,KAAKsB,OAAO,IAC/B7B,EAAA,UACEA,EAAA,UACEA,EAAA,OACEG,MAAO,YAAYP,IACnBK,MAAO,CAACF,MAAO,eAEjBC,EAAA,OACEG,MAAO,YAAYP,IACnBK,MAAO,CAACF,MAAO,cAEjBC,EAAA,OACEG,MAAO,OAAOP,IACdK,MAAO,CAACF,MAAO,cAGnBC,EAAA,UACEA,EAAA,OACEG,MAAO,cAAcP,IACrBK,MAAO,CAACF,MAAO,YAGnBC,EAAA,UACEA,EAAA,OACEG,MAAO,cAAcP,IACrBK,MAAO,CAACF,MAAO,mB","ignoreList":[]}

package/dist/cjs/atomic-result-placeholder_8.cjs.entry.js.map

@@ -1 +0,0 @@
-{"file":"atomic-result-placeholder.atomic-result-section-actions.atomic-result-section-badges.atomic-result-section-bottom-metadata.atomic-result-section-excerpt.atomic-result-section-title.atomic-result-section-visual.atomic-result-table-placeholder.entry.cjs.js","mappings":"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","names":["placeholderClasses","h","getItemDisplayClasses","hideEmptySection"],"sources":["src/components/common/atomic-result-placeholder/atomic-result-placeholder.pcss?tag=atomic-result-placeholder&encapsulation=shadow","src/components/common/atomic-result-placeholder/atomic-result-placeholder.tsx","src/components/search/result-template-components/atomic-result-sections/atomic-result-section-actions.tsx","src/components/search/result-template-components/atomic-result-sections/atomic-result-section-badges.tsx","src/components/search/result-template-components/atomic-result-sections/atomic-result-section-bottom-metadata.tsx","src/components/search/result-template-components/atomic-result-sections/atomic-result-section-excerpt.tsx","src/components/search/result-template-components/atomic-result-sections/atomic-result-section-title.tsx","src/components/search/result-template-components/atomic-result-sections/atomic-result-section-visual.tsx","src/components/search/atomic-result-table-placeholder/atomic-result-table-placeholder.pcss?tag=atomic-result-table-placeholder&encapsulation=shadow","src/components/search/atomic-result-table-placeholder/atomic-result-table-placeholder.tsx"],"sourcesContent":["@import '../../../global/global.pcss';\n\n@import '../template-system/template-system.pcss';\n\n:host {\n  @apply atomic-template-system;\n\n  .result-root {\n    &.display-grid {\n      atomic-result-section-actions {\n        display: none;\n      }\n    }\n\n    .badge {\n      width: 14rem;\n    }\n\n    .action {\n      width: 10rem;\n    }\n\n    .title {\n      display: grid;\n      grid-auto-flow: column;\n      grid-gap: 0.5rem;\n      height: var(--line-height);\n      width: 30rem;\n      max-width: 100%;\n    }\n\n    .fields-placeholder {\n      display: grid;\n      grid-template-columns: repeat(auto-fill, min(11rem, 40%));\n      grid-column-gap: 0.5rem;\n\n      .field-value-placeholder {\n        height: var(--font-size);\n        margin: calc((var(--line-height) - var(--font-size)) / 2) 0;\n      }\n    }\n  }\n}\n","import {Component, h, Prop} from '@stencil/core';\nimport {\n  ItemDisplayLayout,\n  ItemDisplayDensity,\n  ItemDisplayImageSize,\n  getItemDisplayClasses,\n} from '../../common/layout/display-options';\n\nconst placeholderClasses = 'block bg-neutral w-full h-full rounded';\n\n/**\n * The `atomic-result-placeholder` component provides an intermediate visual state that is rendered before the first results are available.\n * @internal\n */\n@Component({\n  tag: 'atomic-result-placeholder',\n  styleUrl: 'atomic-result-placeholder.pcss',\n  shadow: true,\n})\nexport class AtomicResultPlaceholder {\n  @Prop() display!: ItemDisplayLayout;\n  @Prop() density!: ItemDisplayDensity;\n  @Prop() imageSize!: ItemDisplayImageSize;\n\n  private renderExcerptLine(width: string) {\n    return (\n      <div\n        style={{\n          height: 'var(--line-height)',\n          width,\n        }}\n      >\n        <div\n          class={placeholderClasses}\n          style={{height: 'var(--font-size)'}}\n        ></div>\n      </div>\n    );\n  }\n\n  public render() {\n    return (\n      <div\n        class={`result-root placeholder with-sections animate-pulse ${getItemDisplayClasses(\n          this.display,\n          this.density,\n          this.imageSize\n        )\n          .join(' ')\n          .trim()}`}\n      >\n        <atomic-result-section-visual>\n          <div class={placeholderClasses}></div>\n        </atomic-result-section-visual>\n        <atomic-result-section-badges>\n          <div class={`badge ${placeholderClasses}`}></div>\n        </atomic-result-section-badges>\n        <atomic-result-section-actions>\n          <div class={`action ${placeholderClasses}`}></div>\n        </atomic-result-section-actions>\n        <atomic-result-section-title>\n          <div class={`title ${placeholderClasses}`}></div>\n        </atomic-result-section-title>\n        <atomic-result-section-excerpt>\n          {this.renderExcerptLine('100%')}\n          {this.renderExcerptLine('95%')}\n          {this.renderExcerptLine('98%')}\n        </atomic-result-section-excerpt>\n        <atomic-result-section-bottom-metadata>\n          <div class=\"fields-placeholder\">\n            {Array.from({length: 4}, () => (\n              <div\n                class={`field-value-placeholder ${placeholderClasses}`}\n              ></div>\n            ))}\n          </div>\n        </atomic-result-section-bottom-metadata>\n      </div>\n    );\n  }\n}\n","import {Element, Component} from '@stencil/core';\nimport {hideEmptySection} from '../../../../utils/item-section-utils';\n\n/**\n * This section allows the information seeker to perform an action on an item without having to view its details.\n * For example, in Commerce you can add an item to the cart directly or add it to a wish list to view at a later time.\n *\n * Behavior:\n * * Exposes the `--line-height` CSS variable so child elements can adjust to the current line height.\n * ** You should ensure that elements inside of it have `height: var(--line-height)`.\n * * Is a wrapping flexbox with a gap.\n * * May appear over, next to, or beneath the visual section.\n */\n@Component({\n  tag: 'atomic-result-section-actions',\n  shadow: false,\n})\nexport class AtomicResultSectionActions {\n  @Element() private host!: HTMLElement;\n\n  public componentDidRender() {\n    hideEmptySection(this.host);\n  }\n}\n","import {Element, Component} from '@stencil/core';\nimport {hideEmptySection} from '../../../../utils/item-section-utils';\n\n/**\n * This section provides badges that highlight special features of the item.\n *\n * Behavior:\n * * Exposes the `--line-height` CSS variable so child elements can adjust to the current line height.\n * ** You should ensure that elements inside of it have `height: var(--line-height)`.\n * * Is a wrapping flexbox with a gap.\n * * May appear over, next to, or beneath the visual section.\n */\n@Component({\n  tag: 'atomic-result-section-badges',\n  shadow: false,\n})\nexport class AtomicResultSectionBadges {\n  @Element() private host!: HTMLElement;\n\n  public componentDidRender() {\n    hideEmptySection(this.host);\n  }\n}\n","import {Element, Component} from '@stencil/core';\nimport {hideEmptySection} from '../../../../utils/item-section-utils';\n\n/**\n * This section displays additional descriptive information about the item.\n *\n * Behavior:\n * * Has a maximum height of two lines.\n * ** We recommend that you use `atomic-result-fields-list` to ensure that the fields in this section don’t overflow.\n * * Exposes the `--line-height` variable so child elements can adjust to the current line height.\n * * Has a defined CSS `color` property for text.\n * * Has a font weight.\n */\n@Component({\n  tag: 'atomic-result-section-bottom-metadata',\n  shadow: false,\n})\nexport class AtomicResultSectionBottomMetadata {\n  @Element() private host!: HTMLElement;\n\n  public componentDidRender() {\n    hideEmptySection(this.host);\n  }\n}\n","import {Element, Component} from '@stencil/core';\nimport {hideEmptySection} from '../../../../utils/item-section-utils';\n\n/**\n * This section contains an informative summary of the item's content.\n *\n * Behavior:\n * * Has a fixed height of one to three lines, depending on the layout and density.\n * * Ellipses overflowing text.\n * * Exposes the `--line-height` CSS variable so child elements can adjust to the current line height.\n * * Has a defined CSS `color` property for text.\n */\n@Component({\n  tag: 'atomic-result-section-excerpt',\n  shadow: false,\n})\nexport class AtomicResultSectionExcerpt {\n  @Element() private host!: HTMLElement;\n\n  public componentDidRender() {\n    hideEmptySection(this.host);\n  }\n}\n","import {Element, Component} from '@stencil/core';\nimport {hideEmptySection} from '../../../../utils/item-section-utils';\n\n/**\n * This section identifies the item by its name, and its main use is to make the result list scannable.\n * This is usually the page title.\n *\n * Behavior:\n * * Has a fixed height of two lines on grid layouts.\n * * Exposes the `--line-height` CSS variable so child elements can adjust to the current line height.\n * * Has a defined CSS `color` property for text.\n */\n@Component({\n  tag: 'atomic-result-section-title',\n  shadow: false,\n})\nexport class AtomicResultSectionTitle {\n  @Element() private host!: HTMLElement;\n\n  public componentDidRender() {\n    hideEmptySection(this.host);\n  }\n}\n","import {Element, Component, Prop} from '@stencil/core';\nimport {hideEmptySection} from '../../../../utils/item-section-utils';\nimport {ItemDisplayImageSize} from '../../../common/layout/display-options';\n\n/**\n * This section provides visual information about the item.\n * For example, in Commerce, an image is a great shorthand for a product category.\n * An icon can quickly show the item type, or an avatar can help identify to whom it is related.\n *\n * Behavior:\n * * Has a fixed size that depends on the specified image size, the layout, the density, and the screen size.\n * ** When the image size is set to `icon`, this section stays very small.\n * ** You should ensure that elements inside of it take the available space.\n * * Always has a 1:1 aspect ratio.\n */\n@Component({\n  tag: 'atomic-result-section-visual',\n  shadow: false,\n})\nexport class AtomicResultSectionVisual {\n  @Element() private host!: HTMLElement;\n\n  /**\n   * How large or small the visual section of results using this template should be.\n   */\n  @Prop({reflect: true}) public imageSize?: ItemDisplayImageSize;\n\n  public componentDidRender() {\n    hideEmptySection(this.host);\n  }\n}\n","@import '../../../global/global.pcss';\n@import '../../common/item-list/styles/mixins.pcss';\n\n:host {\n  display: grid;\n}\n\n.list-root.display-table {\n  @apply atomic-result-table border-neutral rounded-xl border;\n\n  thead tr,\n  tbody tr:not(:last-child) {\n    position: relative;\n\n    &::after {\n      content: ' ';\n      display: block;\n      position: absolute;\n      height: 1px;\n      bottom: 0;\n      left: var(--padding);\n      right: var(--padding);\n      @apply bg-neutral;\n    }\n  }\n\n  th,\n  td {\n    border-color: transparent;\n    border-radius: initial;\n  }\n\n  th {\n    background-color: transparent;\n  }\n}\n","import {Component, h, Prop} from '@stencil/core';\nimport {\n  ItemDisplayDensity,\n  ItemDisplayImageSize,\n  getItemDisplayClasses,\n} from '../../common/layout/display-options';\n\nconst placeholderClasses = 'block bg-neutral rounded';\n\n/**\n * The `atomic-result-table-placeholder` component provides an intermediate visual state that is rendered before the first results are available.\n * @internal\n */\n@Component({\n  tag: 'atomic-result-table-placeholder',\n  styleUrl: 'atomic-result-table-placeholder.pcss',\n  shadow: true,\n})\nexport class AtomicResultTablePlaceholder {\n  @Prop() density!: ItemDisplayDensity;\n  @Prop() imageSize!: ItemDisplayImageSize;\n  @Prop() rows!: number;\n\n  private getClasses() {\n    return getItemDisplayClasses('table', this.density, this.imageSize);\n  }\n\n  public render() {\n    return (\n      <table class={`list-root animate-pulse ${this.getClasses().join(' ')}`}>\n        <thead>\n          <tr>\n            <th>\n              <div\n                class={`mt-2 h-8 ${placeholderClasses}`}\n                style={{width: '14.5rem'}}\n              ></div>\n            </th>\n            <th>\n              <div\n                class={`mt-2 h-8 ${placeholderClasses}`}\n                style={{width: '9.75rem'}}\n              ></div>\n            </th>\n            <th>\n              <div\n                class={`mt-2 h-8 ${placeholderClasses}`}\n                style={{width: '6.5rem'}}\n              ></div>\n            </th>\n          </tr>\n        </thead>\n        <tbody>\n          {Array.from({length: this.rows}, () => (\n            <tr>\n              <td>\n                <div\n                  class={`mb-6 h-8 ${placeholderClasses}`}\n                  style={{width: '22.875rem'}}\n                ></div>\n                <div\n                  class={`mb-2 h-5 ${placeholderClasses}`}\n                  style={{width: '23.75rem'}}\n                ></div>\n                <div\n                  class={`h-5 ${placeholderClasses}`}\n                  style={{width: '11.5rem'}}\n                ></div>\n              </td>\n              <td>\n                <div\n                  class={`mt-1.5 h-5 ${placeholderClasses}`}\n                  style={{width: '11rem'}}\n                ></div>\n              </td>\n              <td>\n                <div\n                  class={`mt-1.5 h-5 ${placeholderClasses}`}\n                  style={{width: '4.875rem'}}\n                ></div>\n              </td>\n            </tr>\n          ))}\n        </tbody>\n      </table>\n    );\n  }\n}\n"],"version":3}

package/dist/cjs/atomic-result-section-children.cjs.entry.js

@@ -1,23 +0,0 @@
-'use strict';
-
-Object.defineProperty(exports, '__esModule', { value: true });
-
-const index = require('./index-757bc886.js');
-const itemSectionUtils = require('./item-section-utils-37848715.js');
-require('./utils-12b49e87.js');
-require('./purify-85b542e2.js');
-require('./_commonjsHelpers-b3309d7b.js');
-
-const AtomicResultSectionChildren = class {
-    constructor(hostRef) {
-        index.registerInstance(this, hostRef);
-    }
-    componentDidRender() {
-        itemSectionUtils.hideEmptySection(this.host);
-    }
-    get host() { return index.getElement(this); }
-};
-
-exports.atomic_result_section_children = AtomicResultSectionChildren;
-
-//# sourceMappingURL=atomic-result-section-children.cjs.entry.js.map

package/dist/cjs/atomic-result-section-children.cjs.entry.js.map

@@ -1 +0,0 @@
-{"file":"atomic-result-section-children.entry.cjs.js","mappings":";;;;;;;;;;MAaa,2BAA2B;;;;IAG/B,kBAAkB;QACvBA,iCAAgB,CAAC,IAAI,CAAC,IAAI,CAAC,CAAC;KAC7B;;;;;;","names":["hideEmptySection"],"sources":["src/components/search/result-template-components/atomic-result-sections/atomic-result-section-children.tsx"],"sourcesContent":["import {Element, Component} from '@stencil/core';\nimport {hideEmptySection} from '../../../../utils/item-section-utils';\n\n/**\n * This section displays the folded results, available when using the <atomic-result-children> component.\n *\n * Behavior:\n * * Shows children at the bottom of the result, indented and wrapped in a border.\n */\n@Component({\n  tag: 'atomic-result-section-children',\n  shadow: false,\n})\nexport class AtomicResultSectionChildren {\n  @Element() private host!: HTMLElement;\n\n  public componentDidRender() {\n    hideEmptySection(this.host);\n  }\n}\n"],"version":3}

package/dist/cjs/atomic-result-section-emphasized.cjs.entry.js

@@ -1,23 +0,0 @@
-'use strict';
-
-Object.defineProperty(exports, '__esModule', { value: true });
-
-const index = require('./index-757bc886.js');
-const itemSectionUtils = require('./item-section-utils-37848715.js');
-require('./utils-12b49e87.js');
-require('./purify-85b542e2.js');
-require('./_commonjsHelpers-b3309d7b.js');
-
-const AtomicResultSectionEmphasized = class {
-    constructor(hostRef) {
-        index.registerInstance(this, hostRef);
-    }
-    componentDidRender() {
-        itemSectionUtils.hideEmptySection(this.host);
-    }
-    get host() { return index.getElement(this); }
-};
-
-exports.atomic_result_section_emphasized = AtomicResultSectionEmphasized;
-
-//# sourceMappingURL=atomic-result-section-emphasized.cjs.entry.js.map

package/dist/cjs/atomic-result-section-emphasized.cjs.entry.js.map

@@ -1 +0,0 @@
-{"file":"atomic-result-section-emphasized.entry.cjs.js","mappings":";;;;;;;;;;MAea,6BAA6B;;;;IAGjC,kBAAkB;QACvBA,iCAAgB,CAAC,IAAI,CAAC,IAAI,CAAC,CAAC;KAC7B;;;;;;","names":["hideEmptySection"],"sources":["src/components/search/result-template-components/atomic-result-sections/atomic-result-section-emphasized.tsx"],"sourcesContent":["import {Element, Component} from '@stencil/core';\nimport {hideEmptySection} from '../../../../utils/item-section-utils';\n\n/**\n * This section displays the field that's important for its search criteria.\n * For example, in Commerce, a product's cost is often more important than the title itself.\n *\n * Behavior:\n * * Has a very large font size.\n * * Is the second closest element beneath the title section.\n */\n@Component({\n  tag: 'atomic-result-section-emphasized',\n  shadow: false,\n})\nexport class AtomicResultSectionEmphasized {\n  @Element() private host!: HTMLElement;\n\n  public componentDidRender() {\n    hideEmptySection(this.host);\n  }\n}\n"],"version":3}

package/dist/cjs/atomic-result-section-title-metadata.cjs.entry.js

@@ -1,23 +0,0 @@
-'use strict';
-
-Object.defineProperty(exports, '__esModule', { value: true });
-
-const index = require('./index-757bc886.js');
-const itemSectionUtils = require('./item-section-utils-37848715.js');
-require('./utils-12b49e87.js');
-require('./purify-85b542e2.js');
-require('./_commonjsHelpers-b3309d7b.js');
-
-const AtomicResultSectionTitleMetadata = class {
-    constructor(hostRef) {
-        index.registerInstance(this, hostRef);
-    }
-    componentDidRender() {
-        itemSectionUtils.hideEmptySection(this.host);
-    }
-    get host() { return index.getElement(this); }
-};
-
-exports.atomic_result_section_title_metadata = AtomicResultSectionTitleMetadata;
-
-//# sourceMappingURL=atomic-result-section-title-metadata.cjs.entry.js.map

package/dist/cjs/atomic-result-section-title-metadata.cjs.entry.js.map

@@ -1 +0,0 @@
-{"file":"atomic-result-section-title-metadata.entry.cjs.js","mappings":";;;;;;;;;;MAgBa,gCAAgC;;;;IAGpC,kBAAkB;QACvBA,iCAAgB,CAAC,IAAI,CAAC,IAAI,CAAC,CAAC;KAC7B;;;;;;","names":["hideEmptySection"],"sources":["src/components/search/result-template-components/atomic-result-sections/atomic-result-section-title-metadata.tsx"],"sourcesContent":["import {Element, Component} from '@stencil/core';\nimport {hideEmptySection} from '../../../../utils/item-section-utils';\n\n/**\n * This section surfaces some fields that are directly related to the title of the item.\n * For example, in Commerce, this could be the item's rating, which is tied to the nature of the product itself,\n * rather than to the product's description.\n *\n * Behavior:\n * * Has a very small font size.\n * * Is the closest element beneath the title section.\n */\n@Component({\n  tag: 'atomic-result-section-title-metadata',\n  shadow: false,\n})\nexport class AtomicResultSectionTitleMetadata {\n  @Element() private host!: HTMLElement;\n\n  public componentDidRender() {\n    hideEmptySection(this.host);\n  }\n}\n"],"version":3}

package/dist/cjs/item-section-utils-37848715.js

@@ -1,11 +0,0 @@
-'use strict';
-
-const utils = require('./utils-12b49e87.js');
-
-function hideEmptySection(element) {
-    element.style.display = utils.containsVisualElement(element) ? '' : 'none';
-}
-
-exports.hideEmptySection = hideEmptySection;
-
-//# sourceMappingURL=item-section-utils-37848715.js.map

package/dist/cjs/item-section-utils-37848715.js.map

@@ -1 +0,0 @@
-{"file":"item-section-utils-37848715.js","mappings":";;;;SAEgB,gBAAgB,CAAC,OAAoB;IACnD,OAAO,CAAC,KAAK,CAAC,OAAO,GAAGA,2BAAqB,CAAC,OAAO,CAAC,GAAG,EAAE,GAAG,MAAM,CAAC;AACvE;;;;","names":["containsVisualElement"],"sources":["src/utils/item-section-utils.ts"],"sourcesContent":["import {containsVisualElement} from './utils';\n\nexport function hideEmptySection(element: HTMLElement) {\n  element.style.display = containsVisualElement(element) ? '' : 'none';\n}\n"],"version":3}

package/dist/esm/atomic-result-placeholder_8.entry.js.map

@@ -1 +0,0 @@
-{"file":"atomic-result-placeholder.atomic-result-section-actions.atomic-result-section-badges.atomic-result-section-bottom-metadata.atomic-result-section-excerpt.atomic-result-section-title.atomic-result-section-visual.atomic-result-table-placeholder.entry.js","mappings":"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","names":["placeholderClasses"],"sources":["src/components/common/atomic-result-placeholder/atomic-result-placeholder.pcss?tag=atomic-result-placeholder&encapsulation=shadow","src/components/common/atomic-result-placeholder/atomic-result-placeholder.tsx","src/components/search/result-template-components/atomic-result-sections/atomic-result-section-actions.tsx","src/components/search/result-template-components/atomic-result-sections/atomic-result-section-badges.tsx","src/components/search/result-template-components/atomic-result-sections/atomic-result-section-bottom-metadata.tsx","src/components/search/result-template-components/atomic-result-sections/atomic-result-section-excerpt.tsx","src/components/search/result-template-components/atomic-result-sections/atomic-result-section-title.tsx","src/components/search/result-template-components/atomic-result-sections/atomic-result-section-visual.tsx","src/components/search/atomic-result-table-placeholder/atomic-result-table-placeholder.pcss?tag=atomic-result-table-placeholder&encapsulation=shadow","src/components/search/atomic-result-table-placeholder/atomic-result-table-placeholder.tsx"],"sourcesContent":["@import '../../../global/global.pcss';\n\n@import '../template-system/template-system.pcss';\n\n:host {\n  @apply atomic-template-system;\n\n  .result-root {\n    &.display-grid {\n      atomic-result-section-actions {\n        display: none;\n      }\n    }\n\n    .badge {\n      width: 14rem;\n    }\n\n    .action {\n      width: 10rem;\n    }\n\n    .title {\n      display: grid;\n      grid-auto-flow: column;\n      grid-gap: 0.5rem;\n      height: var(--line-height);\n      width: 30rem;\n      max-width: 100%;\n    }\n\n    .fields-placeholder {\n      display: grid;\n      grid-template-columns: repeat(auto-fill, min(11rem, 40%));\n      grid-column-gap: 0.5rem;\n\n      .field-value-placeholder {\n        height: var(--font-size);\n        margin: calc((var(--line-height) - var(--font-size)) / 2) 0;\n      }\n    }\n  }\n}\n","import {Component, h, Prop} from '@stencil/core';\nimport {\n  ItemDisplayLayout,\n  ItemDisplayDensity,\n  ItemDisplayImageSize,\n  getItemDisplayClasses,\n} from '../../common/layout/display-options';\n\nconst placeholderClasses = 'block bg-neutral w-full h-full rounded';\n\n/**\n * The `atomic-result-placeholder` component provides an intermediate visual state that is rendered before the first results are available.\n * @internal\n */\n@Component({\n  tag: 'atomic-result-placeholder',\n  styleUrl: 'atomic-result-placeholder.pcss',\n  shadow: true,\n})\nexport class AtomicResultPlaceholder {\n  @Prop() display!: ItemDisplayLayout;\n  @Prop() density!: ItemDisplayDensity;\n  @Prop() imageSize!: ItemDisplayImageSize;\n\n  private renderExcerptLine(width: string) {\n    return (\n      <div\n        style={{\n          height: 'var(--line-height)',\n          width,\n        }}\n      >\n        <div\n          class={placeholderClasses}\n          style={{height: 'var(--font-size)'}}\n        ></div>\n      </div>\n    );\n  }\n\n  public render() {\n    return (\n      <div\n        class={`result-root placeholder with-sections animate-pulse ${getItemDisplayClasses(\n          this.display,\n          this.density,\n          this.imageSize\n        )\n          .join(' ')\n          .trim()}`}\n      >\n        <atomic-result-section-visual>\n          <div class={placeholderClasses}></div>\n        </atomic-result-section-visual>\n        <atomic-result-section-badges>\n          <div class={`badge ${placeholderClasses}`}></div>\n        </atomic-result-section-badges>\n        <atomic-result-section-actions>\n          <div class={`action ${placeholderClasses}`}></div>\n        </atomic-result-section-actions>\n        <atomic-result-section-title>\n          <div class={`title ${placeholderClasses}`}></div>\n        </atomic-result-section-title>\n        <atomic-result-section-excerpt>\n          {this.renderExcerptLine('100%')}\n          {this.renderExcerptLine('95%')}\n          {this.renderExcerptLine('98%')}\n        </atomic-result-section-excerpt>\n        <atomic-result-section-bottom-metadata>\n          <div class=\"fields-placeholder\">\n            {Array.from({length: 4}, () => (\n              <div\n                class={`field-value-placeholder ${placeholderClasses}`}\n              ></div>\n            ))}\n          </div>\n        </atomic-result-section-bottom-metadata>\n      </div>\n    );\n  }\n}\n","import {Element, Component} from '@stencil/core';\nimport {hideEmptySection} from '../../../../utils/item-section-utils';\n\n/**\n * This section allows the information seeker to perform an action on an item without having to view its details.\n * For example, in Commerce you can add an item to the cart directly or add it to a wish list to view at a later time.\n *\n * Behavior:\n * * Exposes the `--line-height` CSS variable so child elements can adjust to the current line height.\n * ** You should ensure that elements inside of it have `height: var(--line-height)`.\n * * Is a wrapping flexbox with a gap.\n * * May appear over, next to, or beneath the visual section.\n */\n@Component({\n  tag: 'atomic-result-section-actions',\n  shadow: false,\n})\nexport class AtomicResultSectionActions {\n  @Element() private host!: HTMLElement;\n\n  public componentDidRender() {\n    hideEmptySection(this.host);\n  }\n}\n","import {Element, Component} from '@stencil/core';\nimport {hideEmptySection} from '../../../../utils/item-section-utils';\n\n/**\n * This section provides badges that highlight special features of the item.\n *\n * Behavior:\n * * Exposes the `--line-height` CSS variable so child elements can adjust to the current line height.\n * ** You should ensure that elements inside of it have `height: var(--line-height)`.\n * * Is a wrapping flexbox with a gap.\n * * May appear over, next to, or beneath the visual section.\n */\n@Component({\n  tag: 'atomic-result-section-badges',\n  shadow: false,\n})\nexport class AtomicResultSectionBadges {\n  @Element() private host!: HTMLElement;\n\n  public componentDidRender() {\n    hideEmptySection(this.host);\n  }\n}\n","import {Element, Component} from '@stencil/core';\nimport {hideEmptySection} from '../../../../utils/item-section-utils';\n\n/**\n * This section displays additional descriptive information about the item.\n *\n * Behavior:\n * * Has a maximum height of two lines.\n * ** We recommend that you use `atomic-result-fields-list` to ensure that the fields in this section don’t overflow.\n * * Exposes the `--line-height` variable so child elements can adjust to the current line height.\n * * Has a defined CSS `color` property for text.\n * * Has a font weight.\n */\n@Component({\n  tag: 'atomic-result-section-bottom-metadata',\n  shadow: false,\n})\nexport class AtomicResultSectionBottomMetadata {\n  @Element() private host!: HTMLElement;\n\n  public componentDidRender() {\n    hideEmptySection(this.host);\n  }\n}\n","import {Element, Component} from '@stencil/core';\nimport {hideEmptySection} from '../../../../utils/item-section-utils';\n\n/**\n * This section contains an informative summary of the item's content.\n *\n * Behavior:\n * * Has a fixed height of one to three lines, depending on the layout and density.\n * * Ellipses overflowing text.\n * * Exposes the `--line-height` CSS variable so child elements can adjust to the current line height.\n * * Has a defined CSS `color` property for text.\n */\n@Component({\n  tag: 'atomic-result-section-excerpt',\n  shadow: false,\n})\nexport class AtomicResultSectionExcerpt {\n  @Element() private host!: HTMLElement;\n\n  public componentDidRender() {\n    hideEmptySection(this.host);\n  }\n}\n","import {Element, Component} from '@stencil/core';\nimport {hideEmptySection} from '../../../../utils/item-section-utils';\n\n/**\n * This section identifies the item by its name, and its main use is to make the result list scannable.\n * This is usually the page title.\n *\n * Behavior:\n * * Has a fixed height of two lines on grid layouts.\n * * Exposes the `--line-height` CSS variable so child elements can adjust to the current line height.\n * * Has a defined CSS `color` property for text.\n */\n@Component({\n  tag: 'atomic-result-section-title',\n  shadow: false,\n})\nexport class AtomicResultSectionTitle {\n  @Element() private host!: HTMLElement;\n\n  public componentDidRender() {\n    hideEmptySection(this.host);\n  }\n}\n","import {Element, Component, Prop} from '@stencil/core';\nimport {hideEmptySection} from '../../../../utils/item-section-utils';\nimport {ItemDisplayImageSize} from '../../../common/layout/display-options';\n\n/**\n * This section provides visual information about the item.\n * For example, in Commerce, an image is a great shorthand for a product category.\n * An icon can quickly show the item type, or an avatar can help identify to whom it is related.\n *\n * Behavior:\n * * Has a fixed size that depends on the specified image size, the layout, the density, and the screen size.\n * ** When the image size is set to `icon`, this section stays very small.\n * ** You should ensure that elements inside of it take the available space.\n * * Always has a 1:1 aspect ratio.\n */\n@Component({\n  tag: 'atomic-result-section-visual',\n  shadow: false,\n})\nexport class AtomicResultSectionVisual {\n  @Element() private host!: HTMLElement;\n\n  /**\n   * How large or small the visual section of results using this template should be.\n   */\n  @Prop({reflect: true}) public imageSize?: ItemDisplayImageSize;\n\n  public componentDidRender() {\n    hideEmptySection(this.host);\n  }\n}\n","@import '../../../global/global.pcss';\n@import '../../common/item-list/styles/mixins.pcss';\n\n:host {\n  display: grid;\n}\n\n.list-root.display-table {\n  @apply atomic-result-table border-neutral rounded-xl border;\n\n  thead tr,\n  tbody tr:not(:last-child) {\n    position: relative;\n\n    &::after {\n      content: ' ';\n      display: block;\n      position: absolute;\n      height: 1px;\n      bottom: 0;\n      left: var(--padding);\n      right: var(--padding);\n      @apply bg-neutral;\n    }\n  }\n\n  th,\n  td {\n    border-color: transparent;\n    border-radius: initial;\n  }\n\n  th {\n    background-color: transparent;\n  }\n}\n","import {Component, h, Prop} from '@stencil/core';\nimport {\n  ItemDisplayDensity,\n  ItemDisplayImageSize,\n  getItemDisplayClasses,\n} from '../../common/layout/display-options';\n\nconst placeholderClasses = 'block bg-neutral rounded';\n\n/**\n * The `atomic-result-table-placeholder` component provides an intermediate visual state that is rendered before the first results are available.\n * @internal\n */\n@Component({\n  tag: 'atomic-result-table-placeholder',\n  styleUrl: 'atomic-result-table-placeholder.pcss',\n  shadow: true,\n})\nexport class AtomicResultTablePlaceholder {\n  @Prop() density!: ItemDisplayDensity;\n  @Prop() imageSize!: ItemDisplayImageSize;\n  @Prop() rows!: number;\n\n  private getClasses() {\n    return getItemDisplayClasses('table', this.density, this.imageSize);\n  }\n\n  public render() {\n    return (\n      <table class={`list-root animate-pulse ${this.getClasses().join(' ')}`}>\n        <thead>\n          <tr>\n            <th>\n              <div\n                class={`mt-2 h-8 ${placeholderClasses}`}\n                style={{width: '14.5rem'}}\n              ></div>\n            </th>\n            <th>\n              <div\n                class={`mt-2 h-8 ${placeholderClasses}`}\n                style={{width: '9.75rem'}}\n              ></div>\n            </th>\n            <th>\n              <div\n                class={`mt-2 h-8 ${placeholderClasses}`}\n                style={{width: '6.5rem'}}\n              ></div>\n            </th>\n          </tr>\n        </thead>\n        <tbody>\n          {Array.from({length: this.rows}, () => (\n            <tr>\n              <td>\n                <div\n                  class={`mb-6 h-8 ${placeholderClasses}`}\n                  style={{width: '22.875rem'}}\n                ></div>\n                <div\n                  class={`mb-2 h-5 ${placeholderClasses}`}\n                  style={{width: '23.75rem'}}\n                ></div>\n                <div\n                  class={`h-5 ${placeholderClasses}`}\n                  style={{width: '11.5rem'}}\n                ></div>\n              </td>\n              <td>\n                <div\n                  class={`mt-1.5 h-5 ${placeholderClasses}`}\n                  style={{width: '11rem'}}\n                ></div>\n              </td>\n              <td>\n                <div\n                  class={`mt-1.5 h-5 ${placeholderClasses}`}\n                  style={{width: '4.875rem'}}\n                ></div>\n              </td>\n            </tr>\n          ))}\n        </tbody>\n      </table>\n    );\n  }\n}\n"],"version":3}

package/dist/esm/atomic-result-section-children.entry.js

@@ -1,19 +0,0 @@
-import { r as registerInstance, g as getElement } from './index-3f35faca.js';
-import { h as hideEmptySection } from './item-section-utils-d8aa24b7.js';
-import './utils-6400ebde.js';
-import './purify-c7ebd240.js';
-import './_commonjsHelpers-1789f0cf.js';
-
-const AtomicResultSectionChildren = class {
-    constructor(hostRef) {
-        registerInstance(this, hostRef);
-    }
-    componentDidRender() {
-        hideEmptySection(this.host);
-    }
-    get host() { return getElement(this); }
-};
-
-export { AtomicResultSectionChildren as atomic_result_section_children };
-
-//# sourceMappingURL=atomic-result-section-children.entry.js.map

package/dist/esm/atomic-result-section-children.entry.js.map

@@ -1 +0,0 @@
-{"file":"atomic-result-section-children.entry.js","mappings":";;;;;;MAaa,2BAA2B;;;;IAG/B,kBAAkB;QACvB,gBAAgB,CAAC,IAAI,CAAC,IAAI,CAAC,CAAC;KAC7B;;;;;;","names":[],"sources":["src/components/search/result-template-components/atomic-result-sections/atomic-result-section-children.tsx"],"sourcesContent":["import {Element, Component} from '@stencil/core';\nimport {hideEmptySection} from '../../../../utils/item-section-utils';\n\n/**\n * This section displays the folded results, available when using the <atomic-result-children> component.\n *\n * Behavior:\n * * Shows children at the bottom of the result, indented and wrapped in a border.\n */\n@Component({\n  tag: 'atomic-result-section-children',\n  shadow: false,\n})\nexport class AtomicResultSectionChildren {\n  @Element() private host!: HTMLElement;\n\n  public componentDidRender() {\n    hideEmptySection(this.host);\n  }\n}\n"],"version":3}

package/dist/esm/atomic-result-section-emphasized.entry.js

@@ -1,19 +0,0 @@
-import { r as registerInstance, g as getElement } from './index-3f35faca.js';
-import { h as hideEmptySection } from './item-section-utils-d8aa24b7.js';
-import './utils-6400ebde.js';
-import './purify-c7ebd240.js';
-import './_commonjsHelpers-1789f0cf.js';
-
-const AtomicResultSectionEmphasized = class {
-    constructor(hostRef) {
-        registerInstance(this, hostRef);
-    }
-    componentDidRender() {
-        hideEmptySection(this.host);
-    }
-    get host() { return getElement(this); }
-};
-
-export { AtomicResultSectionEmphasized as atomic_result_section_emphasized };
-
-//# sourceMappingURL=atomic-result-section-emphasized.entry.js.map

package/dist/esm/atomic-result-section-emphasized.entry.js.map

@@ -1 +0,0 @@
-{"file":"atomic-result-section-emphasized.entry.js","mappings":";;;;;;MAea,6BAA6B;;;;IAGjC,kBAAkB;QACvB,gBAAgB,CAAC,IAAI,CAAC,IAAI,CAAC,CAAC;KAC7B;;;;;;","names":[],"sources":["src/components/search/result-template-components/atomic-result-sections/atomic-result-section-emphasized.tsx"],"sourcesContent":["import {Element, Component} from '@stencil/core';\nimport {hideEmptySection} from '../../../../utils/item-section-utils';\n\n/**\n * This section displays the field that's important for its search criteria.\n * For example, in Commerce, a product's cost is often more important than the title itself.\n *\n * Behavior:\n * * Has a very large font size.\n * * Is the second closest element beneath the title section.\n */\n@Component({\n  tag: 'atomic-result-section-emphasized',\n  shadow: false,\n})\nexport class AtomicResultSectionEmphasized {\n  @Element() private host!: HTMLElement;\n\n  public componentDidRender() {\n    hideEmptySection(this.host);\n  }\n}\n"],"version":3}

package/dist/esm/atomic-result-section-title-metadata.entry.js

@@ -1,19 +0,0 @@
-import { r as registerInstance, g as getElement } from './index-3f35faca.js';
-import { h as hideEmptySection } from './item-section-utils-d8aa24b7.js';
-import './utils-6400ebde.js';
-import './purify-c7ebd240.js';
-import './_commonjsHelpers-1789f0cf.js';
-
-const AtomicResultSectionTitleMetadata = class {
-    constructor(hostRef) {
-        registerInstance(this, hostRef);
-    }
-    componentDidRender() {
-        hideEmptySection(this.host);
-    }
-    get host() { return getElement(this); }
-};
-
-export { AtomicResultSectionTitleMetadata as atomic_result_section_title_metadata };
-
-//# sourceMappingURL=atomic-result-section-title-metadata.entry.js.map

package/dist/esm/atomic-result-section-title-metadata.entry.js.map

@@ -1 +0,0 @@
-{"file":"atomic-result-section-title-metadata.entry.js","mappings":";;;;;;MAgBa,gCAAgC;;;;IAGpC,kBAAkB;QACvB,gBAAgB,CAAC,IAAI,CAAC,IAAI,CAAC,CAAC;KAC7B;;;;;;","names":[],"sources":["src/components/search/result-template-components/atomic-result-sections/atomic-result-section-title-metadata.tsx"],"sourcesContent":["import {Element, Component} from '@stencil/core';\nimport {hideEmptySection} from '../../../../utils/item-section-utils';\n\n/**\n * This section surfaces some fields that are directly related to the title of the item.\n * For example, in Commerce, this could be the item's rating, which is tied to the nature of the product itself,\n * rather than to the product's description.\n *\n * Behavior:\n * * Has a very small font size.\n * * Is the closest element beneath the title section.\n */\n@Component({\n  tag: 'atomic-result-section-title-metadata',\n  shadow: false,\n})\nexport class AtomicResultSectionTitleMetadata {\n  @Element() private host!: HTMLElement;\n\n  public componentDidRender() {\n    hideEmptySection(this.host);\n  }\n}\n"],"version":3}

package/dist/esm/item-section-utils-d8aa24b7.js

@@ -1,9 +0,0 @@
-import { e as containsVisualElement } from './utils-6400ebde.js';
-
-function hideEmptySection(element) {
-    element.style.display = containsVisualElement(element) ? '' : 'none';
-}
-
-export { hideEmptySection as h };
-
-//# sourceMappingURL=item-section-utils-d8aa24b7.js.map

package/dist/esm/item-section-utils-d8aa24b7.js.map

@@ -1 +0,0 @@
-{"file":"item-section-utils-d8aa24b7.js","mappings":";;SAEgB,gBAAgB,CAAC,OAAoB;IACnD,OAAO,CAAC,KAAK,CAAC,OAAO,GAAG,qBAAqB,CAAC,OAAO,CAAC,GAAG,EAAE,GAAG,MAAM,CAAC;AACvE;;;;","names":[],"sources":["src/utils/item-section-utils.ts"],"sourcesContent":["import {containsVisualElement} from './utils';\n\nexport function hideEmptySection(element: HTMLElement) {\n  element.style.display = containsVisualElement(element) ? '' : 'none';\n}\n"],"version":3}

package/dist/types/components/search/result-template-components/atomic-result-sections/atomic-result-section-children.d.ts

@@ -1,10 +0,0 @@
-/**
- * This section displays the folded results, available when using the <atomic-result-children> component.
- *
- * Behavior:
- * * Shows children at the bottom of the result, indented and wrapped in a border.
- */
-export declare class AtomicResultSectionChildren {
-    private host;
-    componentDidRender(): void;
-}

package/dist/types/components/search/result-template-components/atomic-result-sections/atomic-result-section-emphasized.d.ts

@@ -1,12 +0,0 @@
-/**
- * This section displays the field that's important for its search criteria.
- * For example, in Commerce, a product's cost is often more important than the title itself.
- *
- * Behavior:
- * * Has a very large font size.
- * * Is the second closest element beneath the title section.
- */
-export declare class AtomicResultSectionEmphasized {
-    private host;
-    componentDidRender(): void;
-}

package/dist/types/components/search/result-template-components/atomic-result-sections/atomic-result-section-title-metadata.d.ts

@@ -1,13 +0,0 @@
-/**
- * This section surfaces some fields that are directly related to the title of the item.
- * For example, in Commerce, this could be the item's rating, which is tied to the nature of the product itself,
- * rather than to the product's description.
- *
- * Behavior:
- * * Has a very small font size.
- * * Is the closest element beneath the title section.
- */
-export declare class AtomicResultSectionTitleMetadata {
-    private host;
-    componentDidRender(): void;
-}

package/dist/types/components/search/result-template-components/atomic-result-sections/atomic-result-section-visual.d.ts

@@ -1,20 +0,0 @@
-import { ItemDisplayImageSize } from '../../../common/layout/display-options';
-/**
- * This section provides visual information about the item.
- * For example, in Commerce, an image is a great shorthand for a product category.
- * An icon can quickly show the item type, or an avatar can help identify to whom it is related.
- *
- * Behavior:
- * * Has a fixed size that depends on the specified image size, the layout, the density, and the screen size.
- * ** When the image size is set to `icon`, this section stays very small.
- * ** You should ensure that elements inside of it take the available space.
- * * Always has a 1:1 aspect ratio.
- */
-export declare class AtomicResultSectionVisual {
-    private host;
-    /**
-     * How large or small the visual section of results using this template should be.
-     */
-    imageSize?: ItemDisplayImageSize;
-    componentDidRender(): void;
-}

package/dist/types/types/open-api.d.ts

@@ -1,3 +0,0 @@
-declare module 'https://platform.cloud.coveo.com/api-docs/*' {
-    export default any;
-}