@coveo/atomic 3.31.2-pre.ebf2a83c47 → 3.31.2-pre.fd4a2e6b54

This diff represents the content of publicly available package versions that have been released to one of the supported registries. The information contained in this diff is provided for informational purposes only and reflects changes between package versions as they appear in their respective public registries.
Files changed (111) hide show
  1. package/dist/atomic/_atomic.esm.js +1 -1
  2. package/dist/atomic/atomic.esm.js.map +1 -1
  3. package/dist/atomic/components/_index.d.ts +0 -2
  4. package/dist/atomic/components/_index.js +0 -1
  5. package/dist/atomic/components/analytics-config.js +1 -1
  6. package/dist/atomic/components/components/commerce/atomic-commerce-interface/analytics-config.js +2 -0
  7. package/dist/atomic/components/components/commerce/atomic-commerce-interface/atomic-commerce-interface.js +6 -1
  8. package/dist/atomic/components/components/commerce/atomic-commerce-recommendation-interface/atomic-commerce-recommendation-interface.js +6 -1
  9. package/dist/atomic/components/components/commerce/atomic-product-description/atomic-product-description.js +149 -0
  10. package/dist/atomic/components/components/commerce/atomic-product-description/atomic-product-description.tw.css.js +3 -0
  11. package/dist/atomic/components/components/commerce/atomic-product-template/atomic-product-template.js +1 -0
  12. package/dist/atomic/components/components/commerce/index.js +1 -0
  13. package/dist/atomic/components/components/commerce/lazy-index.js +1 -0
  14. package/dist/atomic/components/components/common/interface/analytics-config.js +38 -0
  15. package/dist/atomic/components/global/environment.js +1 -1
  16. package/dist/atomic/components/index.js.map +1 -1
  17. package/dist/atomic/components/stencil-facet-show-more-less.js +7 -1
  18. package/dist/atomic/components/stencil-facet-show-more-less.js.map +1 -1
  19. package/dist/atomic/p-1e0f2e91.entry.js +2 -0
  20. package/dist/atomic/{p-8bb323e8.entry.js.map → p-1e0f2e91.entry.js.map} +1 -1
  21. package/dist/atomic/p-29c272bb.entry.js +2 -0
  22. package/dist/atomic/{p-4e77fe24.entry.js.map → p-29c272bb.entry.js.map} +1 -1
  23. package/dist/atomic/{p-29f21264.entry.js → p-34c06911.entry.js} +2 -2
  24. package/dist/atomic/p-417b1b64.js +2 -0
  25. package/dist/atomic/{p-c100197d.js.map → p-417b1b64.js.map} +1 -1
  26. package/dist/atomic/p-44a3c052.entry.js +2 -0
  27. package/dist/atomic/{p-e215ba76.entry.js.map → p-44a3c052.entry.js.map} +1 -1
  28. package/dist/atomic/{p-43188440.entry.js → p-5876976b.entry.js} +2 -2
  29. package/dist/atomic/p-91477908.entry.js +2 -0
  30. package/dist/atomic/{p-3f881919.entry.js.map → p-91477908.entry.js.map} +1 -1
  31. package/dist/atomic/p-e8ba8acd.entry.js +2 -0
  32. package/dist/atomic/{p-0873c1b8.entry.js.map → p-e8ba8acd.entry.js.map} +1 -1
  33. package/dist/atomic/{p-f699c143.entry.js → p-ec18a965.entry.js} +2 -2
  34. package/dist/atomic/{p-a55cd386.js → p-fcc41f67.js} +2 -2
  35. package/dist/cjs/_loader.cjs.js +1 -1
  36. package/dist/cjs/{analytics-config-8482ce49.js → analytics-config-c1fcfc7f.js} +2 -2
  37. package/dist/cjs/{analytics-config-8482ce49.js.map → analytics-config-c1fcfc7f.js.map} +1 -1
  38. package/dist/cjs/atomic-category-facet.cjs.entry.js +1 -2
  39. package/dist/cjs/atomic-category-facet.cjs.entry.js.map +1 -1
  40. package/dist/cjs/atomic-color-facet.cjs.entry.js +1 -2
  41. package/dist/cjs/atomic-color-facet.cjs.entry.js.map +1 -1
  42. package/dist/cjs/atomic-commerce-category-facet_4.cjs.entry.js +1 -2
  43. package/dist/cjs/atomic-commerce-category-facet_4.cjs.entry.js.map +1 -1
  44. package/dist/cjs/atomic-facet.cjs.entry.js +1 -2
  45. package/dist/cjs/atomic-facet.cjs.entry.js.map +1 -1
  46. package/dist/cjs/atomic-insight-facet.cjs.entry.js +1 -2
  47. package/dist/cjs/atomic-insight-facet.cjs.entry.js.map +1 -1
  48. package/dist/cjs/atomic-insight-interface.cjs.entry.js +1 -1
  49. package/dist/cjs/atomic-recs-interface.cjs.entry.js +1 -1
  50. package/dist/cjs/atomic-search-interface.cjs.entry.js +1 -1
  51. package/dist/cjs/atomic.cjs.js +1 -1
  52. package/dist/cjs/index-757bc886.js +0 -4
  53. package/dist/cjs/{stencil-facet-show-more-less-21d22973.js → stencil-facet-show-more-less-541e1544.js} +10 -4
  54. package/dist/cjs/stencil-facet-show-more-less-541e1544.js.map +1 -0
  55. package/dist/cjs/version.cjs.js +2 -2
  56. package/dist/esm/_loader.js +1 -1
  57. package/dist/esm/{analytics-config-d42bd300.js → analytics-config-8265b87c.js} +2 -2
  58. package/dist/esm/{analytics-config-d42bd300.js.map → analytics-config-8265b87c.js.map} +1 -1
  59. package/dist/esm/atomic-category-facet.entry.js +1 -2
  60. package/dist/esm/atomic-category-facet.entry.js.map +1 -1
  61. package/dist/esm/atomic-color-facet.entry.js +1 -2
  62. package/dist/esm/atomic-color-facet.entry.js.map +1 -1
  63. package/dist/esm/atomic-commerce-category-facet_4.entry.js +1 -2
  64. package/dist/esm/atomic-commerce-category-facet_4.entry.js.map +1 -1
  65. package/dist/esm/atomic-facet.entry.js +1 -2
  66. package/dist/esm/atomic-facet.entry.js.map +1 -1
  67. package/dist/esm/atomic-insight-facet.entry.js +1 -2
  68. package/dist/esm/atomic-insight-facet.entry.js.map +1 -1
  69. package/dist/esm/atomic-insight-interface.entry.js +1 -1
  70. package/dist/esm/atomic-recs-interface.entry.js +1 -1
  71. package/dist/esm/atomic-search-interface.entry.js +1 -1
  72. package/dist/esm/atomic.js +1 -1
  73. package/dist/esm/index-3f35faca.js +0 -4
  74. package/dist/esm/{stencil-facet-show-more-less-4b023ee3.js → stencil-facet-show-more-less-1198472f.js} +8 -2
  75. package/dist/esm/stencil-facet-show-more-less-1198472f.js.map +1 -0
  76. package/dist/esm/version.js +2 -2
  77. package/dist/types/components/commerce/atomic-product-description/atomic-product-description.d.ts +21 -10
  78. package/dist/types/components/commerce/atomic-product-template/atomic-product-template.d.ts +1 -0
  79. package/dist/types/components/commerce/index.d.ts +1 -0
  80. package/dist/types/components.d.ts +0 -51
  81. package/docs/atomic-docs.json +1 -124
  82. package/package.json +3 -3
  83. package/dist/atomic/components/atomic-product-description.d.ts +0 -11
  84. package/dist/atomic/components/atomic-product-description.js +0 -153
  85. package/dist/atomic/components/atomic-product-description.js.map +0 -1
  86. package/dist/atomic/components/plus.js +0 -10
  87. package/dist/atomic/components/plus.js.map +0 -1
  88. package/dist/atomic/p-0873c1b8.entry.js +0 -2
  89. package/dist/atomic/p-3f881919.entry.js +0 -2
  90. package/dist/atomic/p-4e77fe24.entry.js +0 -2
  91. package/dist/atomic/p-8bb323e8.entry.js +0 -2
  92. package/dist/atomic/p-8f20d930.js +0 -2
  93. package/dist/atomic/p-8f20d930.js.map +0 -1
  94. package/dist/atomic/p-c100197d.js +0 -2
  95. package/dist/atomic/p-e215ba76.entry.js +0 -2
  96. package/dist/atomic/p-f2d31b97.entry.js +0 -2
  97. package/dist/atomic/p-f2d31b97.entry.js.map +0 -1
  98. package/dist/cjs/atomic-product-description.cjs.entry.js +0 -141
  99. package/dist/cjs/atomic-product-description.cjs.entry.js.map +0 -1
  100. package/dist/cjs/plus-07843914.js +0 -13
  101. package/dist/cjs/plus-07843914.js.map +0 -1
  102. package/dist/cjs/stencil-facet-show-more-less-21d22973.js.map +0 -1
  103. package/dist/esm/atomic-product-description.entry.js +0 -137
  104. package/dist/esm/atomic-product-description.entry.js.map +0 -1
  105. package/dist/esm/plus-00840ff6.js +0 -10
  106. package/dist/esm/plus-00840ff6.js.map +0 -1
  107. package/dist/esm/stencil-facet-show-more-less-4b023ee3.js.map +0 -1
  108. /package/dist/atomic/{p-29f21264.entry.js.map → p-34c06911.entry.js.map} +0 -0
  109. /package/dist/atomic/{p-43188440.entry.js.map → p-5876976b.entry.js.map} +0 -0
  110. /package/dist/atomic/{p-f699c143.entry.js.map → p-ec18a965.entry.js.map} +0 -0
  111. /package/dist/atomic/{p-a55cd386.js.map → p-fcc41f67.js.map} +0 -0
@@ -1 +1 @@
1
- {"file":"index.js","mappings":";;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;MAca,kBAAmB,SAAQ,KAAK;IAC3C,YAAY,WAAmB,EAAE,UAAkB;QACjD,KAAK,CACH,QAAQ,WAAW,sCAAsC,UAAU,YAAY,CAChF,CAAC;KACH;;;ACfH,MAAM,oBAAoB,GAAG,sBAAsB,CAAC;SAIpC,gBAAgB,CAAI,OAAgB,EAAE,UAAkB;IACtE,OAAO,IAAI,OAAO,CAAI,CAAC,OAAO,EAAE,MAAM;QACpC,MAAM,KAAK,GAAG,gBAAgB,CAC5B,oBAAoB,EACpB,CAAC,IAAO;YACN,OAAO,OAAO,CAAC,IAAI,CAAC,CAAC;SACtB,CACF,CAAC;QACF,OAAO,CAAC,aAAa,CAAC,KAAK,CAAC,CAAC;QAE7B,IAAI,CAAC,OAAO,CAAC,OAAO,EAAE,UAAU,CAAC,EAAE;YACjC,MAAM,CACJ,IAAI,kBAAkB,CAAC,OAAO,CAAC,QAAQ,CAAC,WAAW,EAAE,EAAE,UAAU,CAAC,CACnE,CAAC;SACH;KACF,CAAC,CAAC;AACL;;ACoDA;;;;;;;;;;SAUgB,mBAAmB,CAAoB,OAAgB;IACrE,OAAO,gBAAgB,CAAI,OAAO,EAAE,gBAAgB,CAAC,CAAC;AACxD;;;;","names":[],"sources":["src/components/common/item-list/context/item-context-controller.ts","src/components/common/item-list/fetch-item-context.ts","src/decorators/commerce/product-template-decorators.ts"],"sourcesContent":["import type {LitElement, ReactiveController, ReactiveControllerHost} from 'lit';\nimport type {InitializableComponent} from '@/src/decorators/types.js';\nimport {buildCustomEvent} from '@/src/utils/event-utils';\n\ntype LitElementWithError = Omit<\n Pick<InitializableComponent, 'error'>,\n 'error'\n> &\n LitElement & {\n error: Error | null;\n };\n\nconst itemContextEventName = 'atomic/resolveResult';\n\nexport class MissingParentError extends Error {\n constructor(elementName: string, parentName: string) {\n super(\n `The \"${elementName}\" element must be the child of an \"${parentName}\" element.`\n );\n }\n}\n\nfunction extractFolded<T = Record<string, unknown>>(\n item: Record<string, unknown>,\n returnFolded: boolean\n): T {\n if (returnFolded) {\n if ('children' in item) {\n return item as T;\n } else {\n return {children: [], result: item} as T;\n }\n }\n\n if ('children' in item && 'result' in item) {\n return item.result as T;\n }\n return item as T;\n}\n\n/**\n * A reactive controller that manages item context data from parent components.\n * Handles fetching item data via custom events and manages error states.\n */\nexport class ItemContextController<T = Record<string, unknown>>\n implements ReactiveController\n{\n private host: ReactiveControllerHost & LitElementWithError;\n private parentName: string;\n private folded: boolean;\n private _item: T | null = null;\n private _error: MissingParentError | null = null;\n\n constructor(\n host: ReactiveControllerHost & LitElementWithError,\n options: {parentName?: string; folded?: boolean} = {}\n ) {\n this.host = host;\n this.parentName = options.parentName ?? 'atomic-result';\n this.folded = options.folded ?? false;\n host.addController(this);\n }\n\n get item(): T | null {\n return this._error ? null : this._item;\n }\n\n get error(): MissingParentError | null {\n return this._error;\n }\n\n get hasError(): boolean {\n return this._error !== null;\n }\n\n hostConnected(): void {\n this._resolveItemContext();\n }\n\n private _resolveItemContext(): void {\n const event = buildCustomEvent(\n itemContextEventName,\n (item: Record<string, unknown>) => {\n this._item = extractFolded<T>(item, this.folded);\n this._error = null;\n this.host.error = null;\n this.host.requestUpdate();\n }\n );\n\n const canceled = this.host.dispatchEvent(event);\n if (canceled) {\n const elementName = (this.host as Element).nodeName.toLowerCase();\n this._error = new MissingParentError(elementName, this.parentName);\n this._item = null;\n this.host.error = this._error;\n this.host.requestUpdate();\n }\n }\n}\n\ntype ItemContextEventHandler<T> = (item: T) => void;\nexport type ItemContextEvent<T> = CustomEvent<ItemContextEventHandler<T>>;\n","import {closest} from '../../../utils/dom-utils.js';\nimport {buildCustomEvent} from '../../../utils/event-utils.js';\nimport {MissingParentError} from './context/item-context-controller.js';\n\nconst itemContextEventName = 'atomic/resolveResult';\n\ntype ItemContextEventHandler<T> = (item: T) => void;\n\nexport function fetchItemContext<T>(element: Element, parentName: string) {\n return new Promise<T>((resolve, reject) => {\n const event = buildCustomEvent<ItemContextEventHandler<T>>(\n itemContextEventName,\n (item: T) => {\n return resolve(item);\n }\n );\n element.dispatchEvent(event);\n\n if (!closest(element, parentName)) {\n reject(\n new MissingParentError(element.nodeName.toLowerCase(), parentName)\n );\n }\n });\n}\n","import type {InteractiveProduct, Product} from '@coveo/headless/commerce';\nimport type {LitElement} from 'lit';\nimport {\n InteractiveItemContextController,\n type InteractiveItemContextEvent,\n} from '@/src/components/common/item-list/context/interactive-item-context-controller';\nimport {\n ItemContextController,\n type ItemContextEvent,\n} from '@/src/components/common/item-list/context/item-context-controller';\nimport {fetchItemContext} from '@/src/components/common/item-list/fetch-item-context';\n\n/**\n * Creates a [Lit reactive controller](https://lit.dev/docs/composition/controllers/) for managing product context in product template components.\n *\n * @param host - The Lit component instance\n * @param options - Configuration options\n * @returns ItemContextController instance configured for atomic-product\n *\n * @example\n * ```typescript\n * @customElement('my-product-component')\n * export class MyProductComponent extends LitElement {\n * private productController = createProductContextController(this);\n *\n * @state() product!: Product;\n *\n * render() {\n * this.product = this.productController.item;\n * return html`<div>${this.product?.ec_name}</div>`;\n * }\n * }\n * ```\n */\nexport function createProductContextController(\n host: LitElement & {error: Error | null},\n options: {folded?: boolean} = {}\n): ItemContextController<Product> {\n return new ItemContextController<Product>(host, {\n parentName: 'atomic-product',\n folded: options.folded ?? false,\n });\n}\n\n/**\n * Creates a [Lit reactive controller](https://lit.dev/docs/composition/controllers/) for managing interactive product context in product template components.\n *\n * @param host - The Lit component instance\n * @returns InteractiveItemContextController instance\n *\n * @example\n * ```typescript\n * @customElement('my-interactive-product-component')\n * export class MyInteractiveProductComponent extends LitElement {\n * private interactiveProductController = createInteractiveProductContextController(this);\n *\n * @state() product!: Product;\n *\n * render() {\n * this.product = this.interactiveProductController.interactiveItem;\n * return html`<div>${this.product?.ec_name}</div>`;\n * }\n * }\n * ```\n */\nexport function createInteractiveProductContextController(\n host: LitElement & {error: Error}\n): InteractiveItemContextController<InteractiveProduct> {\n return new InteractiveItemContextController<InteractiveProduct>(host);\n}\n\nexport type ProductContextEvent<T = Product> = ItemContextEvent<T>;\nexport type InteractiveProductContextEvent<\n T extends InteractiveProduct = InteractiveProduct,\n> = InteractiveItemContextEvent<T>;\n\n/**\n * Retrieves `Product` on a rendered `atomic-product`.\n *\n * This utility function is useful for building custom product template elements, see [Create a Product List](https://docs.coveo.com/en/atomic/latest/cc-search/create-custom-components/native-components/#custom-product-template-component-example) for more information.\n *\n * You should use the utility function in the [`connectedCallback` lifecycle method](https://developer.mozilla.org/en-US/docs/Web/Web_Components/Using_custom_elements#using_the_lifecycle_callbacks).\n *\n * @param element - The element that the event is dispatched to, which must be the child of a rendered `atomic-product`.\n * @returns A promise that resolves on initialization of the parent `atomic-product` element, or rejects when there is no parent `atomic-product` element.\n */\nexport function fetchProductContext<T extends Product>(element: Element) {\n return fetchItemContext<T>(element, 'atomic-product');\n}\n"],"version":3}
1
+ {"file":"index.js","mappings":";;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;MAca,kBAAmB,SAAQ,KAAK;IAC3C,YAAY,WAAmB,EAAE,UAAkB;QACjD,KAAK,CACH,QAAQ,WAAW,sCAAsC,UAAU,YAAY,CAChF,CAAC;KACH;;;ACfH,MAAM,oBAAoB,GAAG,sBAAsB,CAAC;SAIpC,gBAAgB,CAAI,OAAgB,EAAE,UAAkB;IACtE,OAAO,IAAI,OAAO,CAAI,CAAC,OAAO,EAAE,MAAM;QACpC,MAAM,KAAK,GAAG,gBAAgB,CAC5B,oBAAoB,EACpB,CAAC,IAAO;YACN,OAAO,OAAO,CAAC,IAAI,CAAC,CAAC;SACtB,CACF,CAAC;QACF,OAAO,CAAC,aAAa,CAAC,KAAK,CAAC,CAAC;QAE7B,IAAI,CAAC,OAAO,CAAC,OAAO,EAAE,UAAU,CAAC,EAAE;YACjC,MAAM,CACJ,IAAI,kBAAkB,CAAC,OAAO,CAAC,QAAQ,CAAC,WAAW,EAAE,EAAE,UAAU,CAAC,CACnE,CAAC;SACH;KACF,CAAC,CAAC;AACL;;ACoDA;;;;;;;;;;SAUgB,mBAAmB,CAAoB,OAAgB;IACrE,OAAO,gBAAgB,CAAI,OAAO,EAAE,gBAAgB,CAAC,CAAC;AACxD;;;;","names":[],"sources":["src/components/common/item-list/context/item-context-controller.ts","src/components/common/item-list/fetch-item-context.ts","src/decorators/commerce/product-template-decorators.ts"],"sourcesContent":["import type {LitElement, ReactiveController, ReactiveControllerHost} from 'lit';\nimport type {InitializableComponent} from '@/src/decorators/types.js';\nimport {buildCustomEvent} from '@/src/utils/event-utils';\n\ntype LitElementWithError = Omit<\n Pick<InitializableComponent, 'error'>,\n 'error'\n> &\n LitElement & {\n error: Error | null;\n };\n\nconst itemContextEventName = 'atomic/resolveResult';\n\nexport class MissingParentError extends Error {\n constructor(elementName: string, parentName: string) {\n super(\n `The \"${elementName}\" element must be the child of an \"${parentName}\" element.`\n );\n }\n}\n\nfunction extractFolded<T = Record<string, unknown>>(\n item: Record<string, unknown>,\n returnFolded: boolean\n): T {\n if (returnFolded) {\n if ('children' in item) {\n return item as T;\n } else {\n return {children: [], result: item} as T;\n }\n }\n\n if ('children' in item && 'result' in item) {\n return item.result as T;\n }\n return item as T;\n}\n\n/**\n * A reactive controller that manages item context data from parent components.\n * Handles fetching item data via custom events and manages error states.\n */\nexport class ItemContextController<T = Record<string, unknown>>\n implements ReactiveController\n{\n private host: ReactiveControllerHost & LitElementWithError;\n private parentName: string;\n private folded: boolean;\n private _item: T | null = null;\n private _error: MissingParentError | null = null;\n\n constructor(\n host: ReactiveControllerHost & LitElementWithError,\n options: {parentName?: string; folded?: boolean} = {}\n ) {\n this.host = host;\n this.parentName = options.parentName ?? 'atomic-result';\n this.folded = options.folded ?? false;\n host.addController(this);\n }\n\n get item(): T | null {\n return this._error ? null : this._item;\n }\n\n get error(): MissingParentError | null {\n return this._error;\n }\n\n get hasError(): boolean {\n return this._error !== null;\n }\n\n hostConnected(): void {\n this._resolveItemContext();\n }\n\n private _resolveItemContext(): void {\n const event = buildCustomEvent(\n itemContextEventName,\n (item: Record<string, unknown>) => {\n this._item = extractFolded<T>(item, this.folded);\n this._error = null;\n this.host.error = null;\n this.host.requestUpdate();\n }\n );\n\n const canceled = this.host.dispatchEvent(event);\n if (canceled) {\n const elementName = (this.host as Element).nodeName.toLowerCase();\n this._error = new MissingParentError(elementName, this.parentName);\n this._item = null;\n this.host.error = this._error;\n this.host.requestUpdate();\n }\n }\n}\n\ntype ItemContextEventHandler<T> = (item: T) => void;\nexport type ItemContextEvent<T> = CustomEvent<ItemContextEventHandler<T>>;\n","import {closest} from '../../../utils/dom-utils.js';\nimport {buildCustomEvent} from '../../../utils/event-utils.js';\nimport {MissingParentError} from './context/item-context-controller.js';\n\nconst itemContextEventName = 'atomic/resolveResult';\n\ntype ItemContextEventHandler<T> = (item: T) => void;\n\nexport function fetchItemContext<T>(element: Element, parentName: string) {\n return new Promise<T>((resolve, reject) => {\n const event = buildCustomEvent<ItemContextEventHandler<T>>(\n itemContextEventName,\n (item: T) => {\n return resolve(item);\n }\n );\n element.dispatchEvent(event);\n\n if (!closest(element, parentName)) {\n reject(\n new MissingParentError(element.nodeName.toLowerCase(), parentName)\n );\n }\n });\n}\n","import type {InteractiveProduct, Product} from '@coveo/headless/commerce';\nimport type {LitElement} from 'lit';\nimport {\n InteractiveItemContextController,\n type InteractiveItemContextEvent,\n} from '@/src/components/common/item-list/context/interactive-item-context-controller';\nimport {\n ItemContextController,\n type ItemContextEvent,\n} from '@/src/components/common/item-list/context/item-context-controller';\nimport {fetchItemContext} from '@/src/components/common/item-list/fetch-item-context';\n\n/**\n * Creates a [Lit reactive controller](https://lit.dev/docs/composition/controllers/) for managing product context in product template components.\n *\n * @param host - The Lit component instance\n * @param options - Configuration options\n * @returns ItemContextController instance configured for atomic-product\n *\n * @example\n * ```typescript\n * @customElement('my-product-component')\n * export class MyProductComponent extends LitElement {\n * private productController = createProductContextController(this);\n *\n * @state() product!: Product;\n *\n * render() {\n * this.product = this.productController.item;\n * return html`<div>${this.product?.ec_name}</div>`;\n * }\n * }\n * ```\n */\nexport function createProductContextController(\n host: LitElement & {error: Error | null},\n options: {folded?: boolean} = {}\n): ItemContextController<Product> {\n return new ItemContextController<Product>(host, {\n parentName: 'atomic-product',\n folded: options.folded ?? false,\n });\n}\n\n/**\n * Creates a [Lit reactive controller](https://lit.dev/docs/composition/controllers/) for managing interactive product context in product template components.\n *\n * @param host - The Lit component instance\n * @returns InteractiveItemContextController instance\n *\n * @example\n * ```typescript\n * @customElement('my-interactive-product-component')\n * export class MyInteractiveProductComponent extends LitElement {\n * private interactiveProductController = createInteractiveProductContextController(this);\n *\n * @state() product!: Product;\n *\n * render() {\n * this.product = this.interactiveProductController.interactiveItem;\n * return html`<div>${this.product?.ec_name}</div>`;\n * }\n * }\n * ```\n */\nexport function createInteractiveProductContextController(\n host: LitElement & {error: Error}\n): InteractiveItemContextController<InteractiveProduct> {\n return new InteractiveItemContextController<InteractiveProduct>(host);\n}\n\nexport type ProductContextEvent<T = Product> = ItemContextEvent<T>;\nexport type InteractiveProductContextEvent<\n T extends InteractiveProduct = InteractiveProduct,\n> = InteractiveItemContextEvent<T>;\n\n/**\n * Retrieves `Product` on a rendered `atomic-product`.\n *\n * This utility function is useful for building custom product template elements, see [Create a Product List](https://docs.coveo.com/en/atomic/latest/cc-search/create-custom-components/native-components/#custom-product-template-component-example) for more information.\n *\n * You should use the utility function in the [`connectedCallback` lifecycle method](https://developer.mozilla.org/en-US/docs/Web/Web_Components/Using_custom_elements#using_the_lifecycle_callbacks).\n *\n * @param element - The element that the event is dispatched to, which must be the child of a rendered `atomic-product`.\n * @returns A promise that resolves on initialization of the parent `atomic-product` element, or rejects when there is no parent `atomic-product` element.\n */\nexport function fetchProductContext<T extends Product>(element: Element) {\n return fetchItemContext<T>(element, 'atomic-product');\n}\n"],"version":3}
@@ -1,6 +1,5 @@
1
1
  import { s as shouldUpdateFacetSearchComponent } from './stencil-facet-value-label-highlight.js';
2
2
  import { h } from '@stencil/core/internal/client';
3
- import { M as MinusIcon, P as PlusIcon } from './plus.js';
4
3
  import { B as Button } from './stencil-button.js';
5
4
 
6
5
  function announceFacetSearchResultsWithAriaLive(facet, label, setAriaLive, i18n) {
@@ -17,6 +16,13 @@ function announceFacetSearchResultsWithAriaLive(facet, label, setAriaLive, i18n)
17
16
  });
18
17
  }
19
18
 
19
+ const MinusIcon = `<svg viewBox="0 0 512 512" xmlns="http://www.w3.org/2000/svg"><path d="m64 208h384v96h-384z"/></svg>`;
20
+
21
+ const PlusIcon = `<svg viewBox="0 0 512 512" xmlns="http://www.w3.org/2000/svg">
22
+ <path d="M496 208H304V16h-96v192H16v96h192v192h96V304h192"/>
23
+ </svg>
24
+ `;
25
+
20
26
  const FacetShowMoreLess = (props) => {
21
27
  const label = props.i18n.t(props.label);
22
28
  const showMore = props.i18n.t('show-more');
@@ -1 +1 @@
1
- {"file":"stencil-facet-show-more-less.js","mappings":";;;;;SAIgB,sCAAsC,CACpD,KAA0E,EAC1E,KAAa,EACb,WAAkC,EAClC,IAAU;IAEV,IAAI,SAAS,GAAG,KAAK,CAAC,KAAK,CAAC,WAAW,CAAC;IACxC,KAAK,CAAC,SAAS,CAAC;QACd,IACE,gCAAgC,CAAC,KAAK,CAAC,KAAK,CAAC,WAAW,EAAE,SAAS,CAAC;YACpE,KAAK,CAAC,KAAK,CAAC,WAAW,CAAC,KAAK,EAC7B;YACA,SAAS,GAAG,KAAK,CAAC,KAAK,CAAC,WAAW,CAAC;YAEpC,WAAW,CACT,IAAI,CAAC,CAAC,CAAC,4BAA4B,EAAE;gBACnC,KAAK,EAAE,KAAK,CAAC,KAAK,CAAC,WAAW,CAAC,MAAM,CAAC,MAAM;gBAC5C,KAAK;aACN,CAAC,CACH,CAAC;SACH;KACF,CAAC,CAAC;AACL;;MCTa,iBAAiB,GAA4C,CACxE,KAAK;IAEL,MAAM,KAAK,GAAG,KAAK,CAAC,IAAI,CAAC,CAAC,CAAC,KAAK,CAAC,KAAK,CAAC,CAAC;IACxC,MAAM,QAAQ,GAAG,KAAK,CAAC,IAAI,CAAC,CAAC,CAAC,WAAW,CAAC,CAAC;IAC3C,MAAM,mBAAmB,GAAG,KAAK,CAAC,IAAI,CAAC,CAAC,CAAC,wBAAwB,EAAE;QACjE,KAAK;KACN,CAAC,CAAC;IACH,MAAM,QAAQ,GAAG,KAAK,CAAC,IAAI,CAAC,CAAC,CAAC,WAAW,CAAC,CAAC;IAC3C,MAAM,mBAAmB,GAAG,KAAK,CAAC,IAAI,CAAC,CAAC,CAAC,wBAAwB,EAAE;QACjE,KAAK;KACN,CAAC,CAAC;IACH,MAAM,UAAU,GAAG,sDAAsD,CAAC;IAC1E,MAAM,WAAW,GAAG,cAAc,CAAC;IACnC,IAAI,CAAC,KAAK,CAAC,iBAAiB,IAAI,CAAC,KAAK,CAAC,iBAAiB,EAAE;QACxD,OAAO;KACR;IAED,QACE,WAAK,KAAK,EAAC,MAAM;QACf,EAAC,MAAM,IACL,KAAK,EAAC,cAAc,EACpB,IAAI,EAAC,WAAW,EAChB,KAAK,EAAE,GAAG,UAAU,IAAI,KAAK,CAAC,iBAAiB,GAAG,EAAE,GAAG,QAAQ,EAAE,EACjE,SAAS,EAAE,mBAAmB,EAC9B,OAAO,EAAE,MAAM,KAAK,CAAC,UAAU,EAAE,EACjC,GAAG,EAAE,KAAK,CAAC,WAAW;YAEtB,mBACE,IAAI,EAAC,qBAAqB,EAC1B,KAAK,EAAE,WAAW,EAClB,IAAI,EAAE,SAAS,GACF;YACf,YAAM,KAAK,EAAC,UAAU,IAAE,QAAQ,CAAQ,CACjC;QACT,EAAC,MAAM,IACL,KAAK,EAAC,cAAc,EACpB,IAAI,EAAC,WAAW,EAChB,KAAK,EAAE,GAAG,UAAU,IAAI,KAAK,CAAC,iBAAiB,GAAG,EAAE,GAAG,QAAQ,EAAE,EACjE,SAAS,EAAE,mBAAmB,EAC9B,OAAO,EAAE,MAAM,KAAK,CAAC,UAAU,EAAE,EACjC,GAAG,EAAE,KAAK,CAAC,WAAW;YAEtB,mBACE,IAAI,EAAC,qBAAqB,EAC1B,KAAK,EAAE,WAAW,EAClB,IAAI,EAAE,QAAQ,GACD;YACf,YAAM,KAAK,EAAC,UAAU,IAAE,QAAQ,CAAQ,CACjC,CACL,EACN;AACJ;;;;","names":[],"sources":["src/components/common/facets/facet-search/facet-search-aria-live.ts","src/components/common/facets/facet-show-more-less/stencil-facet-show-more-less.tsx"],"sourcesContent":["import type {Facet, FacetSearchState} from '@coveo/headless';\nimport type {i18n} from 'i18next';\nimport {shouldUpdateFacetSearchComponent} from './facet-search-utils';\n\nexport function announceFacetSearchResultsWithAriaLive(\n facet: Pick<Facet, 'subscribe'> & {state: {facetSearch: FacetSearchState}},\n label: string,\n setAriaLive: (msg: string) => void,\n i18n: i18n\n) {\n let prevState = facet.state.facetSearch;\n facet.subscribe(() => {\n if (\n shouldUpdateFacetSearchComponent(facet.state.facetSearch, prevState) &&\n facet.state.facetSearch.query\n ) {\n prevState = facet.state.facetSearch;\n\n setAriaLive(\n i18n.t('facet-search-results-count', {\n count: facet.state.facetSearch.values.length,\n label,\n })\n );\n }\n });\n}\n","import {FunctionalComponent, h} from '@stencil/core';\nimport {i18n} from 'i18next';\nimport MinusIcon from '../../../../images/minus.svg';\nimport PlusIcon from '../../../../images/plus.svg';\nimport {Button} from '../../stencil-button';\n\ninterface FacetShowMoreProps {\n label: string;\n i18n: i18n;\n canShowLessValues: boolean;\n canShowMoreValues: boolean;\n onShowMore(): void;\n onShowLess(): void;\n showMoreRef?: (element?: HTMLButtonElement) => void;\n showLessRef?: (element?: HTMLButtonElement) => void;\n}\n\nexport const FacetShowMoreLess: FunctionalComponent<FacetShowMoreProps> = (\n props\n) => {\n const label = props.i18n.t(props.label);\n const showMore = props.i18n.t('show-more');\n const showMoreFacetValues = props.i18n.t('show-more-facet-values', {\n label,\n });\n const showLess = props.i18n.t('show-less');\n const showLessFacetValues = props.i18n.t('show-less-facet-values', {\n label,\n });\n const btnClasses = 'flex items-baseline text-left p-2 text-sm max-w-full';\n const iconClasses = 'w-2 h-2 mr-1';\n if (!props.canShowLessValues && !props.canShowMoreValues) {\n return;\n }\n\n return (\n <div class=\"mt-2\">\n <Button\n style=\"text-primary\"\n part=\"show-less\"\n class={`${btnClasses} ${props.canShowLessValues ? '' : 'hidden'}`}\n ariaLabel={showLessFacetValues}\n onClick={() => props.onShowLess()}\n ref={props.showLessRef}\n >\n <atomic-icon\n part=\"show-more-less-icon\"\n class={iconClasses}\n icon={MinusIcon}\n ></atomic-icon>\n <span class=\"truncate\">{showLess}</span>\n </Button>\n <Button\n style=\"text-primary\"\n part=\"show-more\"\n class={`${btnClasses} ${props.canShowMoreValues ? '' : 'hidden'}`}\n ariaLabel={showMoreFacetValues}\n onClick={() => props.onShowMore()}\n ref={props.showMoreRef}\n >\n <atomic-icon\n part=\"show-more-less-icon\"\n class={iconClasses}\n icon={PlusIcon}\n ></atomic-icon>\n <span class=\"truncate\">{showMore}</span>\n </Button>\n </div>\n );\n};\n"],"version":3}
1
+ {"file":"stencil-facet-show-more-less.js","mappings":";;;;SAIgB,sCAAsC,CACpD,KAA0E,EAC1E,KAAa,EACb,WAAkC,EAClC,IAAU;IAEV,IAAI,SAAS,GAAG,KAAK,CAAC,KAAK,CAAC,WAAW,CAAC;IACxC,KAAK,CAAC,SAAS,CAAC;QACd,IACE,gCAAgC,CAAC,KAAK,CAAC,KAAK,CAAC,WAAW,EAAE,SAAS,CAAC;YACpE,KAAK,CAAC,KAAK,CAAC,WAAW,CAAC,KAAK,EAC7B;YACA,SAAS,GAAG,KAAK,CAAC,KAAK,CAAC,WAAW,CAAC;YAEpC,WAAW,CACT,IAAI,CAAC,CAAC,CAAC,4BAA4B,EAAE;gBACnC,KAAK,EAAE,KAAK,CAAC,KAAK,CAAC,WAAW,CAAC,MAAM,CAAC,MAAM;gBAC5C,KAAK;aACN,CAAC,CACH,CAAC;SACH;KACF,CAAC,CAAC;AACL;;;;;;;;;MCTa,iBAAiB,GAA4C,CACxE,KAAK;IAEL,MAAM,KAAK,GAAG,KAAK,CAAC,IAAI,CAAC,CAAC,CAAC,KAAK,CAAC,KAAK,CAAC,CAAC;IACxC,MAAM,QAAQ,GAAG,KAAK,CAAC,IAAI,CAAC,CAAC,CAAC,WAAW,CAAC,CAAC;IAC3C,MAAM,mBAAmB,GAAG,KAAK,CAAC,IAAI,CAAC,CAAC,CAAC,wBAAwB,EAAE;QACjE,KAAK;KACN,CAAC,CAAC;IACH,MAAM,QAAQ,GAAG,KAAK,CAAC,IAAI,CAAC,CAAC,CAAC,WAAW,CAAC,CAAC;IAC3C,MAAM,mBAAmB,GAAG,KAAK,CAAC,IAAI,CAAC,CAAC,CAAC,wBAAwB,EAAE;QACjE,KAAK;KACN,CAAC,CAAC;IACH,MAAM,UAAU,GAAG,sDAAsD,CAAC;IAC1E,MAAM,WAAW,GAAG,cAAc,CAAC;IACnC,IAAI,CAAC,KAAK,CAAC,iBAAiB,IAAI,CAAC,KAAK,CAAC,iBAAiB,EAAE;QACxD,OAAO;KACR;IAED,QACE,WAAK,KAAK,EAAC,MAAM;QACf,EAAC,MAAM,IACL,KAAK,EAAC,cAAc,EACpB,IAAI,EAAC,WAAW,EAChB,KAAK,EAAE,GAAG,UAAU,IAAI,KAAK,CAAC,iBAAiB,GAAG,EAAE,GAAG,QAAQ,EAAE,EACjE,SAAS,EAAE,mBAAmB,EAC9B,OAAO,EAAE,MAAM,KAAK,CAAC,UAAU,EAAE,EACjC,GAAG,EAAE,KAAK,CAAC,WAAW;YAEtB,mBACE,IAAI,EAAC,qBAAqB,EAC1B,KAAK,EAAE,WAAW,EAClB,IAAI,EAAE,SAAS,GACF;YACf,YAAM,KAAK,EAAC,UAAU,IAAE,QAAQ,CAAQ,CACjC;QACT,EAAC,MAAM,IACL,KAAK,EAAC,cAAc,EACpB,IAAI,EAAC,WAAW,EAChB,KAAK,EAAE,GAAG,UAAU,IAAI,KAAK,CAAC,iBAAiB,GAAG,EAAE,GAAG,QAAQ,EAAE,EACjE,SAAS,EAAE,mBAAmB,EAC9B,OAAO,EAAE,MAAM,KAAK,CAAC,UAAU,EAAE,EACjC,GAAG,EAAE,KAAK,CAAC,WAAW;YAEtB,mBACE,IAAI,EAAC,qBAAqB,EAC1B,KAAK,EAAE,WAAW,EAClB,IAAI,EAAE,QAAQ,GACD;YACf,YAAM,KAAK,EAAC,UAAU,IAAE,QAAQ,CAAQ,CACjC,CACL,EACN;AACJ;;;;","names":[],"sources":["src/components/common/facets/facet-search/facet-search-aria-live.ts","src/components/common/facets/facet-show-more-less/stencil-facet-show-more-less.tsx"],"sourcesContent":["import type {Facet, FacetSearchState} from '@coveo/headless';\nimport type {i18n} from 'i18next';\nimport {shouldUpdateFacetSearchComponent} from './facet-search-utils';\n\nexport function announceFacetSearchResultsWithAriaLive(\n facet: Pick<Facet, 'subscribe'> & {state: {facetSearch: FacetSearchState}},\n label: string,\n setAriaLive: (msg: string) => void,\n i18n: i18n\n) {\n let prevState = facet.state.facetSearch;\n facet.subscribe(() => {\n if (\n shouldUpdateFacetSearchComponent(facet.state.facetSearch, prevState) &&\n facet.state.facetSearch.query\n ) {\n prevState = facet.state.facetSearch;\n\n setAriaLive(\n i18n.t('facet-search-results-count', {\n count: facet.state.facetSearch.values.length,\n label,\n })\n );\n }\n });\n}\n","import {FunctionalComponent, h} from '@stencil/core';\nimport {i18n} from 'i18next';\nimport MinusIcon from '../../../../images/minus.svg';\nimport PlusIcon from '../../../../images/plus.svg';\nimport {Button} from '../../stencil-button';\n\ninterface FacetShowMoreProps {\n label: string;\n i18n: i18n;\n canShowLessValues: boolean;\n canShowMoreValues: boolean;\n onShowMore(): void;\n onShowLess(): void;\n showMoreRef?: (element?: HTMLButtonElement) => void;\n showLessRef?: (element?: HTMLButtonElement) => void;\n}\n\nexport const FacetShowMoreLess: FunctionalComponent<FacetShowMoreProps> = (\n props\n) => {\n const label = props.i18n.t(props.label);\n const showMore = props.i18n.t('show-more');\n const showMoreFacetValues = props.i18n.t('show-more-facet-values', {\n label,\n });\n const showLess = props.i18n.t('show-less');\n const showLessFacetValues = props.i18n.t('show-less-facet-values', {\n label,\n });\n const btnClasses = 'flex items-baseline text-left p-2 text-sm max-w-full';\n const iconClasses = 'w-2 h-2 mr-1';\n if (!props.canShowLessValues && !props.canShowMoreValues) {\n return;\n }\n\n return (\n <div class=\"mt-2\">\n <Button\n style=\"text-primary\"\n part=\"show-less\"\n class={`${btnClasses} ${props.canShowLessValues ? '' : 'hidden'}`}\n ariaLabel={showLessFacetValues}\n onClick={() => props.onShowLess()}\n ref={props.showLessRef}\n >\n <atomic-icon\n part=\"show-more-less-icon\"\n class={iconClasses}\n icon={MinusIcon}\n ></atomic-icon>\n <span class=\"truncate\">{showLess}</span>\n </Button>\n <Button\n style=\"text-primary\"\n part=\"show-more\"\n class={`${btnClasses} ${props.canShowMoreValues ? '' : 'hidden'}`}\n ariaLabel={showMoreFacetValues}\n onClick={() => props.onShowMore()}\n ref={props.showMoreRef}\n >\n <atomic-icon\n part=\"show-more-less-icon\"\n class={iconClasses}\n icon={PlusIcon}\n ></atomic-icon>\n <span class=\"truncate\">{showMore}</span>\n </Button>\n </div>\n );\n};\n"],"version":3}
@@ -0,0 +1,2 @@
1
+ import{r as n,h as r,F as t,g as e}from"./p-dc3df5ce.js";import{buildFacet as o,buildSearchStatus as i,buildTabManager as a,buildFacetConditionsManager as l}from"@coveo/headless";import{a as s}from"./p-55d2bcf3.js";import{I as c,B as d}from"./p-d6e6dbc3.js";import{A as h,M as m}from"./p-86428057.js";import{A as b,F as u}from"./p-96a6f84f.js";import{p}from"./p-0f13077e.js";import{a as w,F as v}from"./p-506bb38b.js";import{F as g}from"./p-d9ff279e.js";import{F as f}from"./p-a3f0aaf4.js";import{F as y,a as x}from"./p-417b1b64.js";import{s as k,a as z}from"./p-d4c2b7c0.js";import{F as j,a as S}from"./p-f8cd64b9.js";import{F as M,a as F}from"./p-4bf140ca.js";import{F as V}from"./p-aa10238a.js";import{F as C}from"./p-2a02812b.js";import{i as E}from"./p-406f7e5a.js";import"./p-c9074946.js";import"./p-1580513b.js";import"./p-05de7ca3.js";import"./p-f77160c6.js";import"@coveo/bueno";import"./p-bc96b8f6.js";import"./p-f284897c.js";import"./p-0462f723.js";import"./p-b700cfe1.js";import"./p-35fb03be.js";import"./p-fafae456.js";import"./p-28a6dd9b.js";import"./p-ef905286.js";import"./p-21ab6f55.js";import"./p-66d48d1a.js";import"./p-8f5830b4.js";import"./p-cfb3c589.js";import"./p-5fa99042.js";import"./p-3dabd73e.js";import"./p-7da7b187.js";import"./p-1cf33009.js";import"./p-4b1dc787.js";const O='/*! tailwindcss v4.1.11 | MIT License | https://tailwindcss.com */\n@layer properties;\n@layer theme, base, components, utilities;\n@layer theme;\n@layer base {\n *, ::after, ::before, ::backdrop, ::file-selector-button {\n box-sizing: border-box;\n margin: 0;\n padding: 0;\n border: 0 solid;\n }\n html, :host {\n line-height: 1.5;\n -webkit-text-size-adjust: 100%;\n tab-size: 4;\n font-family: var(--default-font-family, var(--atomic-font-family, ui-sans-serif, system-ui, sans-serif, "Apple Color Emoji", "Segoe UI Emoji", "Segoe UI Symbol", "Noto Color Emoji"));\n font-feature-settings: var(--default-font-feature-settings, normal);\n font-variation-settings: var(--default-font-variation-settings, normal);\n -webkit-tap-highlight-color: transparent;\n }\n hr {\n height: 0;\n color: inherit;\n border-top-width: 1px;\n }\n abbr:where([title]) {\n -webkit-text-decoration: underline dotted;\n text-decoration: underline dotted;\n }\n h1, h2, h3, h4, h5, h6 {\n font-size: inherit;\n font-weight: inherit;\n }\n a {\n color: inherit;\n -webkit-text-decoration: inherit;\n text-decoration: inherit;\n }\n b, strong {\n font-weight: bolder;\n }\n code, kbd, samp, pre {\n font-family: var(--default-mono-font-family, ui-monospace, SFMono-Regular, Menlo, Monaco, Consolas, "Liberation Mono",\n "Courier New", monospace);\n font-feature-settings: var(--default-mono-font-feature-settings, normal);\n font-variation-settings: var(--default-mono-font-variation-settings, normal);\n font-size: 1em;\n }\n small {\n font-size: 80%;\n }\n sub, sup {\n font-size: 75%;\n line-height: 0;\n position: relative;\n vertical-align: baseline;\n }\n sub {\n bottom: -0.25em;\n }\n sup {\n top: -0.5em;\n }\n table {\n text-indent: 0;\n border-color: inherit;\n border-collapse: collapse;\n }\n :-moz-focusring {\n outline: auto;\n }\n progress {\n vertical-align: baseline;\n }\n summary {\n display: list-item;\n }\n ol, ul, menu {\n list-style: none;\n }\n img, svg, video, canvas, audio, iframe, embed, object {\n display: block;\n vertical-align: middle;\n }\n img, video {\n max-width: 100%;\n height: auto;\n }\n button, input, select, optgroup, textarea, ::file-selector-button {\n font: inherit;\n font-feature-settings: inherit;\n font-variation-settings: inherit;\n letter-spacing: inherit;\n color: inherit;\n border-radius: 0;\n background-color: transparent;\n opacity: 1;\n }\n :where(select:is([multiple], [size])) optgroup {\n font-weight: bolder;\n }\n :where(select:is([multiple], [size])) optgroup option {\n padding-inline-start: 20px;\n }\n ::file-selector-button {\n margin-inline-end: 4px;\n }\n ::placeholder {\n opacity: 1;\n }\n @supports (not (-webkit-appearance: -apple-pay-button)) or (contain-intrinsic-size: 1px) {\n ::placeholder {\n color: currentcolor;\n }\n @supports (color: color-mix(in lab, red, red)) {\n ::placeholder {\n color: color-mix(in oklab, currentcolor 50%, transparent);\n }\n }\n }\n textarea {\n resize: vertical;\n }\n ::-webkit-search-decoration {\n -webkit-appearance: none;\n }\n ::-webkit-date-and-time-value {\n min-height: 1lh;\n text-align: inherit;\n }\n ::-webkit-datetime-edit {\n display: inline-flex;\n }\n ::-webkit-datetime-edit-fields-wrapper {\n padding: 0;\n }\n ::-webkit-datetime-edit, ::-webkit-datetime-edit-year-field, ::-webkit-datetime-edit-month-field, ::-webkit-datetime-edit-day-field, ::-webkit-datetime-edit-hour-field, ::-webkit-datetime-edit-minute-field, ::-webkit-datetime-edit-second-field, ::-webkit-datetime-edit-millisecond-field, ::-webkit-datetime-edit-meridiem-field {\n padding-block: 0;\n }\n :-moz-ui-invalid {\n box-shadow: none;\n }\n button, input:where([type="button"], [type="reset"], [type="submit"]), ::file-selector-button {\n appearance: button;\n }\n ::-webkit-inner-spin-button, ::-webkit-outer-spin-button {\n height: auto;\n }\n [hidden]:where(:not([hidden="until-found"])) {\n display: none !important;\n }\n}\n@layer utilities {\n .\\@container {\n container-type: inline-size;\n }\n .pointer-events-auto {\n pointer-events: auto;\n }\n .pointer-events-none {\n pointer-events: none;\n }\n .collapse {\n visibility: collapse;\n }\n .invisible {\n visibility: hidden;\n }\n .visible {\n visibility: visible;\n }\n .sr-only {\n position: absolute;\n width: 1px;\n height: 1px;\n padding: 0;\n margin: -1px;\n overflow: hidden;\n clip: rect(0, 0, 0, 0);\n white-space: nowrap;\n border-width: 0;\n }\n .absolute {\n position: absolute;\n }\n .fixed {\n position: fixed;\n }\n .relative {\n position: relative;\n }\n .static {\n position: static;\n }\n .sticky {\n position: sticky;\n }\n .-top-2 {\n top: calc(0.25rem * -2);\n }\n .-top-4 {\n top: calc(0.25rem * -4);\n }\n .top-0 {\n top: calc(0.25rem * 0);\n }\n .top-1\\/2 {\n top: calc(1/2 * 100%);\n }\n .top-6 {\n top: calc(0.25rem * 6);\n }\n .top-\\[4px\\] {\n top: 4px;\n }\n .top-full {\n top: 100%;\n }\n .top-px {\n top: 1px;\n }\n .-right-2 {\n right: calc(0.25rem * -2);\n }\n .right-0 {\n right: calc(0.25rem * 0);\n }\n .right-2 {\n right: calc(0.25rem * 2);\n }\n .right-6 {\n right: calc(0.25rem * 6);\n }\n .right-12 {\n right: calc(0.25rem * 12);\n }\n .right-20 {\n right: calc(0.25rem * 20);\n }\n .right-px {\n right: 1px;\n }\n .bottom-0 {\n bottom: calc(0.25rem * 0);\n }\n .bottom-1 {\n bottom: calc(0.25rem * 1);\n }\n .bottom-2 {\n bottom: calc(0.25rem * 2);\n }\n .bottom-px {\n bottom: 1px;\n }\n .left-0 {\n left: calc(0.25rem * 0);\n }\n .left-1 {\n left: calc(0.25rem * 1);\n }\n .left-2 {\n left: calc(0.25rem * 2);\n }\n .left-\\[15px\\] {\n left: 15px;\n }\n .isolate {\n isolation: isolate;\n }\n .z-0 {\n z-index: 0;\n }\n .z-1 {\n z-index: 1;\n }\n .z-10 {\n z-index: 10;\n }\n .z-9998 {\n z-index: 9998;\n }\n .z-9999 {\n z-index: 9999;\n }\n .order-last {\n order: 9999;\n }\n .col-span-2 {\n grid-column: span 2 / span 2;\n }\n .container {\n width: 100%;\n }\n @media (width >= 1024px) {\n .container {\n max-width: 1024px;\n }\n }\n @media (width >= 40rem) {\n .container {\n max-width: 40rem;\n }\n }\n @media (width >= 48rem) {\n .container {\n max-width: 48rem;\n }\n }\n @media (width >= 64rem) {\n .container {\n max-width: 64rem;\n }\n }\n @media (width >= 80rem) {\n .container {\n max-width: 80rem;\n }\n }\n @media (width >= 96rem) {\n .container {\n max-width: 96rem;\n }\n }\n .m-0 {\n margin: calc(0.25rem * 0);\n }\n .m-2 {\n margin: calc(0.25rem * 2);\n }\n .mx-0\\.5 {\n margin-inline: calc(0.25rem * 0.5);\n }\n .mx-1 {\n margin-inline: calc(0.25rem * 1);\n }\n .mx-6 {\n margin-inline: calc(0.25rem * 6);\n }\n .mx-16 {\n margin-inline: calc(0.25rem * 16);\n }\n .mx-auto {\n margin-inline: auto;\n }\n .my-2 {\n margin-block: calc(0.25rem * 2);\n }\n .my-3 {\n margin-block: calc(0.25rem * 3);\n }\n .my-4 {\n margin-block: calc(0.25rem * 4);\n }\n .my-6 {\n margin-block: calc(0.25rem * 6);\n }\n .my-auto {\n margin-block: auto;\n }\n .mt-0 {\n margin-top: calc(0.25rem * 0);\n }\n .mt-1 {\n margin-top: calc(0.25rem * 1);\n }\n .mt-1\\.5 {\n margin-top: calc(0.25rem * 1.5);\n }\n .mt-2 {\n margin-top: calc(0.25rem * 2);\n }\n .mt-2\\.5 {\n margin-top: calc(0.25rem * 2.5);\n }\n .mt-3 {\n margin-top: calc(0.25rem * 3);\n }\n .mt-4 {\n margin-top: calc(0.25rem * 4);\n }\n .mt-6 {\n margin-top: calc(0.25rem * 6);\n }\n .mt-7 {\n margin-top: calc(0.25rem * 7);\n }\n .mt-8 {\n margin-top: calc(0.25rem * 8);\n }\n .mt-10 {\n margin-top: calc(0.25rem * 10);\n }\n .mt-px {\n margin-top: 1px;\n }\n .mr-0 {\n margin-right: calc(0.25rem * 0);\n }\n .mr-0\\.5 {\n margin-right: calc(0.25rem * 0.5);\n }\n .mr-1 {\n margin-right: calc(0.25rem * 1);\n }\n .mr-1\\.5 {\n margin-right: calc(0.25rem * 1.5);\n }\n .mr-2 {\n margin-right: calc(0.25rem * 2);\n }\n .mr-3 {\n margin-right: calc(0.25rem * 3);\n }\n .mr-6 {\n margin-right: calc(0.25rem * 6);\n }\n .mb-0 {\n margin-bottom: calc(0.25rem * 0);\n }\n .mb-1 {\n margin-bottom: calc(0.25rem * 1);\n }\n .mb-2 {\n margin-bottom: calc(0.25rem * 2);\n }\n .mb-3 {\n margin-bottom: calc(0.25rem * 3);\n }\n .mb-4 {\n margin-bottom: calc(0.25rem * 4);\n }\n .mb-6 {\n margin-bottom: calc(0.25rem * 6);\n }\n .ml-0\\.5 {\n margin-left: calc(0.25rem * 0.5);\n }\n .ml-1 {\n margin-left: calc(0.25rem * 1);\n }\n .ml-2 {\n margin-left: calc(0.25rem * 2);\n }\n .ml-4 {\n margin-left: calc(0.25rem * 4);\n }\n .ml-6 {\n margin-left: calc(0.25rem * 6);\n }\n .ml-auto {\n margin-left: auto;\n }\n .box-border {\n box-sizing: border-box;\n }\n .box-content {\n box-sizing: content-box;\n }\n .line-clamp-1 {\n overflow: hidden;\n display: -webkit-box;\n -webkit-box-orient: vertical;\n -webkit-line-clamp: 1;\n }\n .line-clamp-2 {\n overflow: hidden;\n display: -webkit-box;\n -webkit-box-orient: vertical;\n -webkit-line-clamp: 2;\n }\n .line-clamp-3 {\n overflow: hidden;\n display: -webkit-box;\n -webkit-box-orient: vertical;\n -webkit-line-clamp: 3;\n }\n .line-clamp-4 {\n overflow: hidden;\n display: -webkit-box;\n -webkit-box-orient: vertical;\n -webkit-line-clamp: 4;\n }\n .line-clamp-none {\n overflow: visible;\n display: block;\n -webkit-box-orient: horizontal;\n -webkit-line-clamp: unset;\n }\n .block {\n display: block;\n }\n .contents {\n display: contents;\n }\n .flex {\n display: flex;\n }\n .grid {\n display: grid;\n }\n .hidden {\n display: none;\n }\n .inline {\n display: inline;\n }\n .inline-block {\n display: inline-block;\n }\n .inline-flex {\n display: inline-flex;\n }\n .table {\n display: table;\n }\n .aspect-square {\n aspect-ratio: 1 / 1;\n }\n .size-\\[27px\\] {\n width: 27px;\n height: 27px;\n }\n .h-1 {\n height: calc(0.25rem * 1);\n }\n .h-2 {\n height: calc(0.25rem * 2);\n }\n .h-2\\.5 {\n height: calc(0.25rem * 2.5);\n }\n .h-3 {\n height: calc(0.25rem * 3);\n }\n .h-4 {\n height: calc(0.25rem * 4);\n }\n .h-5 {\n height: calc(0.25rem * 5);\n }\n .h-5\\/6 {\n height: calc(5/6 * 100%);\n }\n .h-6 {\n height: calc(0.25rem * 6);\n }\n .h-7 {\n height: calc(0.25rem * 7);\n }\n .h-8 {\n height: calc(0.25rem * 8);\n }\n .h-9 {\n height: calc(0.25rem * 9);\n }\n .h-10 {\n height: calc(0.25rem * 10);\n }\n .h-12 {\n height: calc(0.25rem * 12);\n }\n .h-\\[2\\.6rem\\] {\n height: 2.6rem;\n }\n .h-\\[9px\\] {\n height: 9px;\n }\n .h-full {\n height: 100%;\n }\n .max-h-96 {\n max-height: calc(0.25rem * 96);\n }\n .min-h-10 {\n min-height: calc(0.25rem * 10);\n }\n .w-0\\.5 {\n width: calc(0.25rem * 0.5);\n }\n .w-1 {\n width: calc(0.25rem * 1);\n }\n .w-1\\/2 {\n width: calc(1/2 * 100%);\n }\n .w-2 {\n width: calc(0.25rem * 2);\n }\n .w-2\\.5 {\n width: calc(0.25rem * 2.5);\n }\n .w-3 {\n width: calc(0.25rem * 3);\n }\n .w-3\\.5 {\n width: calc(0.25rem * 3.5);\n }\n .w-3\\/5 {\n width: calc(3/5 * 100%);\n }\n .w-4 {\n width: calc(0.25rem * 4);\n }\n .w-5 {\n width: calc(0.25rem * 5);\n }\n .w-5\\/6 {\n width: calc(5/6 * 100%);\n }\n .w-6 {\n width: calc(0.25rem * 6);\n }\n .w-7 {\n width: calc(0.25rem * 7);\n }\n .w-8 {\n width: calc(0.25rem * 8);\n }\n .w-9 {\n width: calc(0.25rem * 9);\n }\n .w-10 {\n width: calc(0.25rem * 10);\n }\n .w-12 {\n width: calc(0.25rem * 12);\n }\n .w-20 {\n width: calc(0.25rem * 20);\n }\n .w-26 {\n width: calc(0.25rem * 26);\n }\n .w-28 {\n width: calc(0.25rem * 28);\n }\n .w-32 {\n width: calc(0.25rem * 32);\n }\n .w-36 {\n width: calc(0.25rem * 36);\n }\n .w-44 {\n width: calc(0.25rem * 44);\n }\n .w-48 {\n width: calc(0.25rem * 48);\n }\n .w-60 {\n width: calc(0.25rem * 60);\n }\n .w-64 {\n width: calc(0.25rem * 64);\n }\n .w-72 {\n width: calc(0.25rem * 72);\n }\n .w-100 {\n width: calc(0.25rem * 100);\n }\n .w-\\[2\\.6rem\\] {\n width: 2.6rem;\n }\n .w-auto {\n width: auto;\n }\n .w-fit {\n width: fit-content;\n }\n .w-full {\n width: 100%;\n }\n .w-max {\n width: max-content;\n }\n .max-w-4\\/5 {\n max-width: calc(4/5 * 100%);\n }\n .max-w-60 {\n max-width: calc(0.25rem * 60);\n }\n .max-w-\\[30ch\\] {\n max-width: 30ch;\n }\n .max-w-full {\n max-width: 100%;\n }\n .max-w-lg {\n max-width: 32rem;\n }\n .max-w-max {\n max-width: max-content;\n }\n .min-w-0 {\n min-width: calc(0.25rem * 0);\n }\n .min-w-10 {\n min-width: calc(0.25rem * 10);\n }\n .min-w-20 {\n min-width: calc(0.25rem * 20);\n }\n .min-w-24 {\n min-width: calc(0.25rem * 24);\n }\n .min-w-full {\n min-width: 100%;\n }\n .flex-1 {\n flex: 1;\n }\n .flex-none {\n flex: none;\n }\n .flex-shrink {\n flex-shrink: 1;\n }\n .shrink-0 {\n flex-shrink: 0;\n }\n .flex-grow {\n flex-grow: 1;\n }\n .grow {\n flex-grow: 1;\n }\n .basis-1\\/2 {\n flex-basis: calc(1/2 * 100%);\n }\n .basis-8 {\n flex-basis: calc(0.25rem * 8);\n }\n .border-collapse {\n border-collapse: collapse;\n }\n .-translate-x-1\\/2 {\n --tw-translate-x: calc(calc(1/2 * 100%) * -1);\n translate: var(--tw-translate-x) var(--tw-translate-y);\n }\n .translate-x-1\\/2 {\n --tw-translate-x: calc(1/2 * 100%);\n translate: var(--tw-translate-x) var(--tw-translate-y);\n }\n .-translate-y-1\\/2 {\n --tw-translate-y: calc(calc(1/2 * 100%) * -1);\n translate: var(--tw-translate-x) var(--tw-translate-y);\n }\n .scale-75 {\n --tw-scale-x: 75%;\n --tw-scale-y: 75%;\n --tw-scale-z: 75%;\n scale: var(--tw-scale-x) var(--tw-scale-y);\n }\n .scale-100 {\n --tw-scale-x: 100%;\n --tw-scale-y: 100%;\n --tw-scale-z: 100%;\n scale: var(--tw-scale-x) var(--tw-scale-y);\n }\n .rotate-180 {\n rotate: 180deg;\n }\n .transform {\n transform: var(--tw-rotate-x,) var(--tw-rotate-y,) var(--tw-rotate-z,) var(--tw-skew-x,) var(--tw-skew-y,);\n }\n .animate-pulse {\n animation: pulse 2s cubic-bezier(0.4, 0, 0.6, 1) infinite;\n }\n .animate-spin {\n animation: spin 1s linear infinite;\n }\n .cursor-\\[inherit\\] {\n cursor: inherit;\n }\n .cursor-pointer {\n cursor: pointer;\n }\n .resize {\n resize: both;\n }\n .resize-none {\n resize: none;\n }\n .list-outside {\n list-style-position: outside;\n }\n .list-decimal {\n list-style-type: decimal;\n }\n .list-disc {\n list-style-type: disc;\n }\n .list-none {\n list-style-type: none;\n }\n .appearance-none {\n appearance: none;\n }\n .grid-cols-\\[min-content_1fr\\] {\n grid-template-columns: min-content 1fr;\n }\n .grid-cols-\\[min-content_auto\\] {\n grid-template-columns: min-content auto;\n }\n .flex-col {\n flex-direction: column;\n }\n .flex-row {\n flex-direction: row;\n }\n .flex-nowrap {\n flex-wrap: nowrap;\n }\n .flex-wrap {\n flex-wrap: wrap;\n }\n .place-items-center {\n place-items: center;\n }\n .content-center {\n align-content: center;\n }\n .items-baseline {\n align-items: baseline;\n }\n .items-center {\n align-items: center;\n }\n .items-start {\n align-items: flex-start;\n }\n .justify-between {\n justify-content: space-between;\n }\n .justify-center {\n justify-content: center;\n }\n .justify-end {\n justify-content: flex-end;\n }\n .gap-0\\.5 {\n gap: calc(0.25rem * 0.5);\n }\n .gap-1 {\n gap: calc(0.25rem * 1);\n }\n .gap-2 {\n gap: calc(0.25rem * 2);\n }\n .gap-3 {\n gap: calc(0.25rem * 3);\n }\n .gap-4 {\n gap: calc(0.25rem * 4);\n }\n .gap-8 {\n gap: calc(0.25rem * 8);\n }\n .gap-x-1\\.5 {\n column-gap: calc(0.25rem * 1.5);\n }\n .gap-x-2 {\n column-gap: calc(0.25rem * 2);\n }\n .gap-x-4 {\n column-gap: calc(0.25rem * 4);\n }\n :where(.space-x-1\\.5 > :not(:last-child)) {\n --tw-space-x-reverse: 0;\n margin-inline-start: calc(calc(0.25rem * 1.5) * var(--tw-space-x-reverse));\n margin-inline-end: calc(calc(0.25rem * 1.5) * calc(1 - var(--tw-space-x-reverse)));\n }\n .gap-y-0\\.5 {\n row-gap: calc(0.25rem * 0.5);\n }\n :where(.divide-y > :not(:last-child)) {\n --tw-divide-y-reverse: 0;\n border-bottom-style: var(--tw-border-style);\n border-top-style: var(--tw-border-style);\n border-top-width: calc(1px * var(--tw-divide-y-reverse));\n border-bottom-width: calc(1px * calc(1 - var(--tw-divide-y-reverse)));\n }\n :where(.divide-neutral > :not(:last-child)) {\n border-color: var(--atomic-neutral);\n }\n .self-center {\n align-self: center;\n }\n .self-start {\n align-self: flex-start;\n }\n .truncate {\n overflow: hidden;\n text-overflow: ellipsis;\n white-space: nowrap;\n }\n .overflow-auto {\n overflow: auto;\n }\n .overflow-hidden {\n overflow: hidden;\n }\n .overflow-x-auto {\n overflow-x: auto;\n }\n .overflow-x-clip {\n overflow-x: clip;\n }\n .overflow-x-scroll {\n overflow-x: scroll;\n }\n .overflow-y-auto {\n overflow-y: auto;\n }\n .overflow-y-visible {\n overflow-y: visible;\n }\n .scroll-smooth {\n scroll-behavior: smooth;\n }\n .rounded {\n border-radius: var(--atomic-border-radius);\n }\n .rounded-full {\n border-radius: calc(infinity * 1px);\n }\n .rounded-lg {\n border-radius: var(--atomic-border-radius-lg);\n }\n .rounded-md {\n border-radius: var(--atomic-border-radius-md);\n }\n .rounded-none {\n border-radius: 0;\n }\n .rounded-sm {\n border-radius: var(--atomic-border-radius);\n }\n .rounded-xl {\n border-radius: var(--atomic-border-radius-xl);\n }\n .rounded-tl-none {\n border-top-left-radius: 0;\n }\n .rounded-r-none {\n border-top-right-radius: 0;\n border-bottom-right-radius: 0;\n }\n .border {\n border-style: var(--tw-border-style);\n border-width: 1px;\n }\n .border-0 {\n border-style: var(--tw-border-style);\n border-width: 0px;\n }\n .border-t {\n border-top-style: var(--tw-border-style);\n border-top-width: 1px;\n }\n .border-r {\n border-right-style: var(--tw-border-style);\n border-right-width: 1px;\n }\n .border-b {\n border-bottom-style: var(--tw-border-style);\n border-bottom-width: 1px;\n }\n .border-l {\n border-left-style: var(--tw-border-style);\n border-left-width: 1px;\n }\n .border-solid {\n --tw-border-style: solid;\n border-style: solid;\n }\n .border-neutral {\n border-color: var(--atomic-neutral);\n }\n .border-neutral-dark {\n border-color: var(--atomic-neutral-dark);\n }\n .border-neutral-dim {\n border-color: var(--atomic-neutral-dim);\n }\n .border-primary {\n border-color: var(--atomic-primary);\n }\n .border-primary-light {\n border-color: var(--atomic-primary-light);\n }\n .border-t-neutral {\n border-top-color: var(--atomic-neutral);\n }\n .border-b-neutral {\n border-bottom-color: var(--atomic-neutral);\n }\n .border-b-neutral-dim {\n border-bottom-color: var(--atomic-neutral-dim);\n }\n .border-l-neutral {\n border-left-color: var(--atomic-neutral);\n }\n .border-l-neutral-dim {\n border-left-color: var(--atomic-neutral-dim);\n }\n .bg-\\[\\#F1F2FF\\] {\n background-color: #F1F2FF;\n }\n .bg-background {\n background-color: var(--atomic-background);\n }\n .bg-error {\n background-color: var(--atomic-error);\n }\n .bg-neutral {\n background-color: var(--atomic-neutral);\n }\n .bg-neutral-dark {\n background-color: var(--atomic-neutral-dark);\n }\n .bg-neutral-light {\n background-color: var(--atomic-neutral-light);\n }\n .bg-primary {\n background-color: var(--atomic-primary);\n }\n .bg-primary-background {\n background-color: var(--atomic-primary-background);\n }\n .bg-transparent {\n background-color: transparent;\n }\n .bg-white {\n background-color: #fff;\n }\n .bg-linear-to-l {\n --tw-gradient-position: to left;\n }\n @supports (background-image: linear-gradient(in lab, red, red)) {\n .bg-linear-to-l {\n --tw-gradient-position: to left in oklab;\n }\n }\n .bg-linear-to-l {\n background-image: linear-gradient(var(--tw-gradient-stops));\n }\n .bg-linear-to-r {\n --tw-gradient-position: to right;\n }\n @supports (background-image: linear-gradient(in lab, red, red)) {\n .bg-linear-to-r {\n --tw-gradient-position: to right in oklab;\n }\n }\n .bg-linear-to-r {\n background-image: linear-gradient(var(--tw-gradient-stops));\n }\n .from-background\\/60 {\n --tw-gradient-from: color-mix(in srgb, #ffffff 60%, transparent);\n }\n @supports (color: color-mix(in lab, red, red)) {\n .from-background\\/60 {\n --tw-gradient-from: color-mix(in oklab, var(--atomic-background) 60%, transparent);\n }\n }\n .from-background\\/60 {\n --tw-gradient-stops: var(--tw-gradient-via-stops, var(--tw-gradient-position), var(--tw-gradient-from) var(--tw-gradient-from-position), var(--tw-gradient-to) var(--tw-gradient-to-position));\n }\n .fill-current {\n fill: currentcolor;\n }\n .stroke-\\[1\\.25\\] {\n stroke-width: 1.25;\n }\n .p-0 {\n padding: calc(0.25rem * 0);\n }\n .p-1 {\n padding: calc(0.25rem * 1);\n }\n .p-2 {\n padding: calc(0.25rem * 2);\n }\n .p-2\\.5 {\n padding: calc(0.25rem * 2.5);\n }\n .p-3 {\n padding: calc(0.25rem * 3);\n }\n .p-3\\.5 {\n padding: calc(0.25rem * 3.5);\n }\n .p-4 {\n padding: calc(0.25rem * 4);\n }\n .p-6 {\n padding: calc(0.25rem * 6);\n }\n .p-7 {\n padding: calc(0.25rem * 7);\n }\n .p-8 {\n padding: calc(0.25rem * 8);\n }\n .px-1 {\n padding-inline: calc(0.25rem * 1);\n }\n .px-2 {\n padding-inline: calc(0.25rem * 2);\n }\n .px-2\\.5 {\n padding-inline: calc(0.25rem * 2.5);\n }\n .px-3 {\n padding-inline: calc(0.25rem * 3);\n }\n .px-4 {\n padding-inline: calc(0.25rem * 4);\n }\n .px-6 {\n padding-inline: calc(0.25rem * 6);\n }\n .px-9 {\n padding-inline: calc(0.25rem * 9);\n }\n .py-0\\.5 {\n padding-block: calc(0.25rem * 0.5);\n }\n .py-1 {\n padding-block: calc(0.25rem * 1);\n }\n .py-1\\.5 {\n padding-block: calc(0.25rem * 1.5);\n }\n .py-2 {\n padding-block: calc(0.25rem * 2);\n }\n .py-2\\.5 {\n padding-block: calc(0.25rem * 2.5);\n }\n .py-3 {\n padding-block: calc(0.25rem * 3);\n }\n .py-3\\.5 {\n padding-block: calc(0.25rem * 3.5);\n }\n .py-4 {\n padding-block: calc(0.25rem * 4);\n }\n .py-5 {\n padding-block: calc(0.25rem * 5);\n }\n .pt-0\\.5 {\n padding-top: calc(0.25rem * 0.5);\n }\n .pt-8 {\n padding-top: calc(0.25rem * 8);\n }\n .pr-2 {\n padding-right: calc(0.25rem * 2);\n }\n .pr-6 {\n padding-right: calc(0.25rem * 6);\n }\n .pr-24 {\n padding-right: calc(0.25rem * 24);\n }\n .pb-1 {\n padding-bottom: calc(0.25rem * 1);\n }\n .pb-3 {\n padding-bottom: calc(0.25rem * 3);\n }\n .pb-4 {\n padding-bottom: calc(0.25rem * 4);\n }\n .pb-6 {\n padding-bottom: calc(0.25rem * 6);\n }\n .pl-0 {\n padding-left: calc(0.25rem * 0);\n }\n .pl-1 {\n padding-left: calc(0.25rem * 1);\n }\n .pl-3 {\n padding-left: calc(0.25rem * 3);\n }\n .pl-7 {\n padding-left: calc(0.25rem * 7);\n }\n .pl-9 {\n padding-left: calc(0.25rem * 9);\n }\n .pl-10 {\n padding-left: calc(0.25rem * 10);\n }\n .text-center {\n text-align: center;\n }\n .text-left {\n text-align: left;\n }\n .align-baseline {\n vertical-align: baseline;\n }\n .align-bottom {\n vertical-align: bottom;\n }\n .align-middle {\n vertical-align: middle;\n }\n .font-sans {\n font-family: var(--atomic-font-family);\n }\n .text-2xl {\n font-size: var(--atomic-text-2xl);\n line-height: var(--tw-leading, calc(2 / 1.5));\n }\n .text-base {\n font-size: var(--atomic-text-base);\n line-height: var(--tw-leading, calc(1.5 / 1));\n }\n .text-lg {\n font-size: var(--atomic-text-lg);\n line-height: var(--tw-leading, calc(1.75 / 1.125));\n }\n .text-sm {\n font-size: var(--atomic-text-sm);\n line-height: var(--tw-leading, calc(1.25 / 0.875));\n }\n .text-xl {\n font-size: var(--atomic-text-xl);\n line-height: var(--tw-leading, calc(1.75 / 1.25));\n }\n .text-xs {\n font-size: 0.75rem;\n line-height: var(--tw-leading, calc(1 / 0.75));\n }\n .text-xs\\/\\[1rem\\] {\n font-size: 0.75rem;\n line-height: 1rem;\n }\n .leading-4 {\n --tw-leading: calc(0.25rem * 4);\n line-height: calc(0.25rem * 4);\n }\n .leading-5 {\n --tw-leading: calc(0.25rem * 5);\n line-height: calc(0.25rem * 5);\n }\n .leading-6 {\n --tw-leading: calc(0.25rem * 6);\n line-height: calc(0.25rem * 6);\n }\n .leading-8 {\n --tw-leading: calc(0.25rem * 8);\n line-height: calc(0.25rem * 8);\n }\n .leading-10 {\n --tw-leading: calc(0.25rem * 10);\n line-height: calc(0.25rem * 10);\n }\n .leading-\\[calc\\(1\\/\\.75\\)\\] {\n --tw-leading: calc(1 / .75);\n line-height: calc(1 / .75);\n }\n .font-bold {\n --tw-font-weight: var(--atomic-font-bold);\n font-weight: var(--atomic-font-bold);\n }\n .font-light {\n --tw-font-weight: 300;\n font-weight: 300;\n }\n .font-medium {\n --tw-font-weight: 500;\n font-weight: 500;\n }\n .font-normal {\n --tw-font-weight: var(--atomic-font-normal);\n font-weight: var(--atomic-font-normal);\n }\n .font-semibold {\n --tw-font-weight: 600;\n font-weight: 600;\n }\n .break-words {\n overflow-wrap: break-word;\n }\n .break-all {\n word-break: break-all;\n }\n .break-keep {\n word-break: keep-all;\n }\n .text-ellipsis {\n text-overflow: ellipsis;\n }\n .whitespace-normal {\n white-space: normal;\n }\n .whitespace-nowrap {\n white-space: nowrap;\n }\n .whitespace-pre-wrap {\n white-space: pre-wrap;\n }\n .text-\\[\\#54698D\\] {\n color: #54698D;\n }\n .text-\\[inherit\\] {\n color: inherit;\n }\n .text-black {\n color: #000;\n }\n .text-error {\n color: var(--atomic-error);\n }\n .text-inline-code {\n color: var(--atomic-inline-code);\n }\n .text-neutral {\n color: var(--atomic-neutral);\n }\n .text-neutral-dark {\n color: var(--atomic-neutral-dark);\n }\n .text-on-background {\n color: var(--atomic-on-background);\n }\n .text-on-primary {\n color: var(--atomic-on-primary);\n }\n .text-primary {\n color: var(--atomic-primary);\n }\n .text-primary-light {\n color: var(--atomic-primary-light);\n }\n .text-success {\n color: var(--atomic-success);\n }\n .text-transparent {\n color: transparent;\n }\n .capitalize {\n text-transform: capitalize;\n }\n .lowercase {\n text-transform: lowercase;\n }\n .italic {\n font-style: italic;\n }\n .line-through {\n text-decoration-line: line-through;\n }\n .placeholder-neutral-dark::placeholder {\n color: var(--atomic-neutral-dark);\n }\n .opacity-0 {\n opacity: 0%;\n }\n .opacity-50 {\n opacity: 50%;\n }\n .opacity-80 {\n opacity: 80%;\n }\n .shadow {\n --tw-shadow: 0 1px 3px 0 var(--tw-shadow-color, rgb(0 0 0 / 0.1)), 0 1px 2px -1px var(--tw-shadow-color, rgb(0 0 0 / 0.1));\n box-shadow: var(--tw-inset-shadow), var(--tw-inset-ring-shadow), var(--tw-ring-offset-shadow), var(--tw-ring-shadow), var(--tw-shadow);\n }\n .shadow-inner-primary {\n --tw-shadow: inset 0 0 0 1px var(--tw-shadow-color, var(--atomic-primary));\n box-shadow: var(--tw-inset-shadow), var(--tw-inset-ring-shadow), var(--tw-ring-offset-shadow), var(--tw-ring-shadow), var(--tw-shadow);\n }\n .shadow-lg {\n --tw-shadow: 0px 2px 8px var(--tw-shadow-color, rgba(229, 232, 232, 0.75));\n box-shadow: var(--tw-inset-shadow), var(--tw-inset-ring-shadow), var(--tw-ring-offset-shadow), var(--tw-ring-shadow), var(--tw-shadow);\n }\n .shadow-sm {\n --tw-shadow: 0 1px 3px 0 var(--tw-shadow-color, rgb(0 0 0 / 0.1)), 0 1px 2px -1px var(--tw-shadow-color, rgb(0 0 0 / 0.1));\n box-shadow: var(--tw-inset-shadow), var(--tw-inset-ring-shadow), var(--tw-ring-offset-shadow), var(--tw-ring-shadow), var(--tw-shadow);\n }\n .shadow-t-lg {\n --tw-shadow: 0px -2px 8px var(--tw-shadow-color, rgba(229, 232, 232, 0.75));\n box-shadow: var(--tw-inset-shadow), var(--tw-inset-ring-shadow), var(--tw-ring-offset-shadow), var(--tw-ring-shadow), var(--tw-shadow);\n }\n .ring {\n --tw-ring-shadow: var(--tw-ring-inset,) 0 0 0 calc(1px + var(--tw-ring-offset-width)) var(--tw-ring-color, currentcolor);\n box-shadow: var(--tw-inset-shadow), var(--tw-inset-ring-shadow), var(--tw-ring-offset-shadow), var(--tw-ring-shadow), var(--tw-shadow);\n }\n .ring-1 {\n --tw-ring-shadow: var(--tw-ring-inset,) 0 0 0 calc(1px + var(--tw-ring-offset-width)) var(--tw-ring-color, currentcolor);\n box-shadow: var(--tw-inset-shadow), var(--tw-inset-ring-shadow), var(--tw-ring-offset-shadow), var(--tw-ring-shadow), var(--tw-shadow);\n }\n .ring-3 {\n --tw-ring-shadow: var(--tw-ring-inset,) 0 0 0 calc(3px + var(--tw-ring-offset-width)) var(--tw-ring-color, currentcolor);\n box-shadow: var(--tw-inset-shadow), var(--tw-inset-ring-shadow), var(--tw-ring-offset-shadow), var(--tw-ring-shadow), var(--tw-shadow);\n }\n .ring-primary {\n --tw-ring-color: var(--atomic-primary);\n }\n .ring-primary-light {\n --tw-ring-color: var(--atomic-primary-light);\n }\n .ring-ring-primary {\n --tw-ring-color: var(--atomic-ring-primary);\n }\n .outline {\n outline-style: var(--tw-outline-style);\n outline-width: 1px;\n }\n .outline-error {\n outline-color: var(--atomic-error);\n }\n .outline-neutral {\n outline-color: var(--atomic-neutral);\n }\n .outline-primary {\n outline-color: var(--atomic-primary);\n }\n .blur {\n --tw-blur: blur(8px);\n filter: var(--tw-blur,) var(--tw-brightness,) var(--tw-contrast,) var(--tw-grayscale,) var(--tw-hue-rotate,) var(--tw-invert,) var(--tw-saturate,) var(--tw-sepia,) var(--tw-drop-shadow,);\n }\n .invert {\n --tw-invert: invert(100%);\n filter: var(--tw-blur,) var(--tw-brightness,) var(--tw-contrast,) var(--tw-grayscale,) var(--tw-hue-rotate,) var(--tw-invert,) var(--tw-saturate,) var(--tw-sepia,) var(--tw-drop-shadow,);\n }\n .filter {\n filter: var(--tw-blur,) var(--tw-brightness,) var(--tw-contrast,) var(--tw-grayscale,) var(--tw-hue-rotate,) var(--tw-invert,) var(--tw-saturate,) var(--tw-sepia,) var(--tw-drop-shadow,);\n }\n .transition {\n transition-property: color, background-color, border-color, outline-color, text-decoration-color, fill, stroke, --tw-gradient-from, --tw-gradient-via, --tw-gradient-to, opacity, box-shadow, transform, translate, scale, rotate, filter, -webkit-backdrop-filter, backdrop-filter, display, visibility, content-visibility, overlay, pointer-events;\n transition-timing-function: var(--tw-ease, var(--default-transition-timing-function, cubic-bezier(0.4, 0, 0.2, 1)));\n transition-duration: var(--tw-duration, var(--default-transition-duration, 150ms));\n }\n .transition-\\[visibility\\] {\n transition-property: visibility;\n transition-timing-function: var(--tw-ease, var(--default-transition-timing-function, cubic-bezier(0.4, 0, 0.2, 1)));\n transition-duration: var(--tw-duration, var(--default-transition-duration, 150ms));\n }\n .transition-all {\n transition-property: all;\n transition-timing-function: var(--tw-ease, var(--default-transition-timing-function, cubic-bezier(0.4, 0, 0.2, 1)));\n transition-duration: var(--tw-duration, var(--default-transition-duration, 150ms));\n }\n .transition-opacity {\n transition-property: opacity;\n transition-timing-function: var(--tw-ease, var(--default-transition-timing-function, cubic-bezier(0.4, 0, 0.2, 1)));\n transition-duration: var(--tw-duration, var(--default-transition-duration, 150ms));\n }\n .duration-200 {\n --tw-duration: 200ms;\n transition-duration: 200ms;\n }\n .duration-300 {\n --tw-duration: 300ms;\n transition-duration: 300ms;\n }\n .ease-in-out {\n --tw-ease: cubic-bezier(0.4, 0, 0.2, 1);\n transition-timing-function: cubic-bezier(0.4, 0, 0.2, 1);\n }\n @media (hover: hover) {\n .group-hover\\:visible:is(:where(.group):hover *) {\n visibility: visible;\n }\n }\n @media (hover: hover) {\n .group-hover\\:text-error:is(:where(.group):hover *) {\n color: var(--atomic-error);\n }\n }\n @media (hover: hover) {\n .group-hover\\:text-primary:is(:where(.group):hover *) {\n color: var(--atomic-primary);\n }\n }\n @media (hover: hover) {\n .group-hover\\:text-primary-light:is(:where(.group):hover *) {\n color: var(--atomic-primary-light);\n }\n }\n .group-focus\\:text-primary:is(:where(.group):focus *) {\n color: var(--atomic-primary);\n }\n .group-focus\\:text-primary-light:is(:where(.group):focus *) {\n color: var(--atomic-primary-light);\n }\n .group-focus-visible\\:text-error:is(:where(.group):focus-visible *) {\n color: var(--atomic-error);\n }\n .group-focus-visible\\:text-primary:is(:where(.group):focus-visible *) {\n color: var(--atomic-primary);\n }\n @media (hover: hover) {\n .peer-hover\\:text-error:is(:where(.peer):hover ~ *) {\n color: var(--atomic-error);\n }\n }\n .after\\:absolute::after {\n content: var(--tw-content);\n position: absolute;\n }\n .after\\:-bottom-0\\.5::after {\n content: var(--tw-content);\n bottom: calc(0.25rem * -0.5);\n }\n .after\\:block::after {\n content: var(--tw-content);\n display: block;\n }\n .after\\:h-1::after {\n content: var(--tw-content);\n height: calc(0.25rem * 1);\n }\n .after\\:w-full::after {\n content: var(--tw-content);\n width: 100%;\n }\n .after\\:rounded::after {\n content: var(--tw-content);\n border-radius: var(--atomic-border-radius);\n }\n .after\\:bg-primary::after {\n content: var(--tw-content);\n background-color: var(--atomic-primary);\n }\n .focus-within\\:border-disabled:focus-within {\n border-color: var(--atomic-disabled);\n }\n .focus-within\\:border-primary:focus-within {\n border-color: var(--atomic-primary);\n }\n .focus-within\\:ring-3:focus-within {\n --tw-ring-shadow: var(--tw-ring-inset,) 0 0 0 calc(3px + var(--tw-ring-offset-width)) var(--tw-ring-color, currentcolor);\n box-shadow: var(--tw-inset-shadow), var(--tw-inset-ring-shadow), var(--tw-ring-offset-shadow), var(--tw-ring-shadow), var(--tw-shadow);\n }\n .focus-within\\:ring-neutral:focus-within {\n --tw-ring-color: var(--atomic-neutral);\n }\n .focus-within\\:ring-ring-primary:focus-within {\n --tw-ring-color: var(--atomic-ring-primary);\n }\n @media (hover: hover) {\n .hover\\:border:hover {\n border-style: var(--tw-border-style);\n border-width: 1px;\n }\n }\n @media (hover: hover) {\n .hover\\:border-error:hover {\n border-color: var(--atomic-error);\n }\n }\n @media (hover: hover) {\n .hover\\:border-primary-light:hover {\n border-color: var(--atomic-primary-light);\n }\n }\n @media (hover: hover) {\n .hover\\:bg-error:hover {\n background-color: var(--atomic-error);\n }\n }\n @media (hover: hover) {\n .hover\\:bg-neutral-light:hover {\n background-color: var(--atomic-neutral-light);\n }\n }\n @media (hover: hover) {\n .hover\\:bg-primary-light:hover {\n background-color: var(--atomic-primary-light);\n }\n }\n @media (hover: hover) {\n .hover\\:bg-transparent:hover {\n background-color: transparent;\n }\n }\n @media (hover: hover) {\n .hover\\:fill-white:hover {\n fill: #fff;\n }\n }\n @media (hover: hover) {\n .hover\\:text-primary-light:hover {\n color: var(--atomic-primary-light);\n }\n }\n @media (hover: hover) {\n .hover\\:underline:hover {\n text-decoration-line: underline;\n }\n }\n @media (hover: hover) {\n .hover\\:opacity-100:hover {\n opacity: 100%;\n }\n }\n @media (hover: hover) {\n .hover\\:shadow-sm:hover {\n --tw-shadow: 0 1px 3px 0 var(--tw-shadow-color, rgb(0 0 0 / 0.1)), 0 1px 2px -1px var(--tw-shadow-color, rgb(0 0 0 / 0.1));\n box-shadow: var(--tw-inset-shadow), var(--tw-inset-ring-shadow), var(--tw-ring-offset-shadow), var(--tw-ring-shadow), var(--tw-shadow);\n }\n }\n .focus\\:opacity-100:focus {\n opacity: 100%;\n }\n .focus\\:outline-hidden:focus {\n --tw-outline-style: none;\n outline-style: none;\n }\n @media (forced-colors: active) {\n .focus\\:outline-hidden:focus {\n outline: 2px solid transparent;\n outline-offset: 2px;\n }\n }\n .focus-visible\\:border:focus-visible {\n border-style: var(--tw-border-style);\n border-width: 1px;\n }\n .focus-visible\\:border-error:focus-visible {\n border-color: var(--atomic-error);\n }\n .focus-visible\\:border-primary:focus-visible {\n border-color: var(--atomic-primary);\n }\n .focus-visible\\:border-primary-light:focus-visible {\n border-color: var(--atomic-primary-light);\n }\n .focus-visible\\:bg-error:focus-visible {\n background-color: var(--atomic-error);\n }\n .focus-visible\\:bg-neutral-light:focus-visible {\n background-color: var(--atomic-neutral-light);\n }\n .focus-visible\\:bg-primary-light:focus-visible {\n background-color: var(--atomic-primary-light);\n }\n .focus-visible\\:text-primary-light:focus-visible {\n color: var(--atomic-primary-light);\n }\n .focus-visible\\:underline:focus-visible {\n text-decoration-line: underline;\n }\n .focus-visible\\:ring-2:focus-visible {\n --tw-ring-shadow: var(--tw-ring-inset,) 0 0 0 calc(2px + var(--tw-ring-offset-width)) var(--tw-ring-color, currentcolor);\n box-shadow: var(--tw-inset-shadow), var(--tw-inset-ring-shadow), var(--tw-ring-offset-shadow), var(--tw-ring-shadow), var(--tw-shadow);\n }\n .focus-visible\\:outline-none:focus-visible {\n --tw-outline-style: none;\n outline-style: none;\n }\n @media (width >= 40rem) {\n .sm\\:px-6 {\n padding-inline: calc(0.25rem * 6);\n }\n }\n .\\[part\\=\\"breadcrumb-button\\"\\]\\:visible:is(part="breadcrumb-button") {\n visibility: visible;\n }\n}\n@layer theme, base, components, utilities;\n@layer components {\n .input-primary {\n border-radius: var(--atomic-border-radius);\n border-style: var(--tw-border-style);\n border-width: 1px;\n border-color: var(--atomic-neutral);\n background-color: var(--atomic-background);\n }\n @media (hover: hover) {\n .input-primary:hover {\n border-color: var(--atomic-primary-light);\n }\n }\n .input-primary:focus-visible {\n border-color: var(--atomic-primary);\n }\n .input-primary:focus-visible {\n --tw-ring-shadow: var(--tw-ring-inset,) 0 0 0 calc(2px + var(--tw-ring-offset-width)) var(--tw-ring-color, currentcolor);\n box-shadow: var(--tw-inset-shadow), var(--tw-inset-ring-shadow), var(--tw-ring-offset-shadow), var(--tw-ring-shadow), var(--tw-shadow);\n }\n .input-primary:focus-visible {\n --tw-ring-color: var(--atomic-ring-primary);\n }\n .input-primary:focus-visible {\n --tw-outline-style: none;\n outline-style: none;\n }\n .btn-radio {\n -webkit-appearance: none;\n -moz-appearance: none;\n appearance: none;\n }\n .btn-radio::before {\n content: var(--tw-content);\n --tw-content: attr(value);\n content: var(--tw-content);\n }\n .btn-primary {\n border-radius: var(--atomic-border-radius);\n background-color: var(--atomic-primary);\n color: var(--atomic-on-primary);\n }\n @media (hover: hover) {\n .btn-primary:hover {\n background-color: var(--atomic-primary-light);\n }\n }\n .btn-primary:focus-visible {\n background-color: var(--atomic-primary-light);\n }\n .btn-primary:focus-visible {\n --tw-ring-shadow: var(--tw-ring-inset,) 0 0 0 calc(2px + var(--tw-ring-offset-width)) var(--tw-ring-color, currentcolor);\n box-shadow: var(--tw-inset-shadow), var(--tw-inset-ring-shadow), var(--tw-ring-offset-shadow), var(--tw-ring-shadow), var(--tw-shadow);\n }\n .btn-primary:focus-visible {\n --tw-ring-color: var(--atomic-ring-primary);\n }\n .btn-primary:focus-visible {\n --tw-outline-style: none;\n outline-style: none;\n }\n .btn-primary:disabled {\n cursor: not-allowed;\n }\n .btn-primary:disabled {\n background-color: var(--atomic-disabled);\n }\n .btn-outline-primary {\n border-radius: var(--atomic-border-radius);\n border-style: var(--tw-border-style);\n border-width: 1px;\n border-color: var(--atomic-neutral);\n background-color: var(--atomic-background);\n color: var(--atomic-primary);\n }\n @media (hover: hover) {\n .btn-outline-primary:hover {\n border-color: var(--atomic-primary-light);\n }\n }\n @media (hover: hover) {\n .btn-outline-primary:hover {\n color: var(--atomic-primary-light);\n }\n }\n .btn-outline-primary:focus-visible {\n border-color: var(--atomic-primary);\n }\n .btn-outline-primary:focus-visible {\n color: var(--atomic-primary);\n }\n .btn-outline-primary:focus-visible {\n --tw-ring-shadow: var(--tw-ring-inset,) 0 0 0 calc(2px + var(--tw-ring-offset-width)) var(--tw-ring-color, currentcolor);\n box-shadow: var(--tw-inset-shadow), var(--tw-inset-ring-shadow), var(--tw-ring-offset-shadow), var(--tw-ring-shadow), var(--tw-shadow);\n }\n .btn-outline-primary:focus-visible {\n --tw-ring-color: var(--atomic-ring-primary);\n }\n .btn-outline-primary:focus-visible {\n --tw-outline-style: none;\n outline-style: none;\n }\n .btn-outline-primary:disabled {\n cursor: not-allowed;\n }\n .btn-outline-primary:disabled {\n border-color: var(--atomic-neutral);\n }\n .btn-outline-primary:disabled {\n color: var(--atomic-neutral);\n }\n .btn-text-primary {\n border-radius: var(--atomic-border-radius);\n background-color: var(--atomic-background);\n color: var(--atomic-primary);\n }\n @media (hover: hover) {\n .btn-text-primary:hover {\n background-color: var(--atomic-neutral-light);\n }\n }\n .btn-text-primary:focus-visible {\n background-color: var(--atomic-neutral-light);\n }\n .btn-text-primary:focus-visible {\n --tw-outline-style: none;\n outline-style: none;\n }\n .btn-outline-neutral {\n border-radius: var(--atomic-border-radius);\n border-style: var(--tw-border-style);\n border-width: 1px;\n border-color: var(--atomic-neutral);\n background-color: var(--atomic-background);\n color: var(--atomic-on-background);\n }\n @media (hover: hover) {\n .btn-outline-neutral:hover {\n border-color: var(--atomic-primary);\n }\n }\n @media (hover: hover) {\n .btn-outline-neutral:hover {\n color: var(--atomic-primary);\n }\n }\n .btn-outline-neutral:focus-visible {\n border-color: var(--atomic-primary);\n }\n .btn-outline-neutral:focus-visible {\n color: var(--atomic-primary);\n }\n .btn-outline-neutral:focus-visible {\n --tw-ring-shadow: var(--tw-ring-inset,) 0 0 0 calc(2px + var(--tw-ring-offset-width)) var(--tw-ring-color, currentcolor);\n box-shadow: var(--tw-inset-shadow), var(--tw-inset-ring-shadow), var(--tw-ring-offset-shadow), var(--tw-ring-shadow), var(--tw-shadow);\n }\n .btn-outline-neutral:focus-visible {\n --tw-ring-color: var(--atomic-ring-primary);\n }\n .btn-outline-neutral:focus-visible {\n --tw-outline-style: none;\n outline-style: none;\n }\n .btn-outline-neutral:disabled {\n cursor: not-allowed;\n }\n .btn-outline-neutral:disabled {\n border-color: var(--atomic-neutral);\n }\n .btn-outline-neutral:disabled {\n color: var(--atomic-on-background);\n }\n .btn-outline-neutral:disabled {\n opacity: 50%;\n }\n .btn-outline-bg-neutral {\n border-radius: var(--atomic-border-radius);\n border-style: var(--tw-border-style);\n border-width: 1px;\n border-color: var(--atomic-neutral);\n background-color: var(--atomic-background);\n color: var(--atomic-on-background);\n }\n @media (hover: hover) {\n .btn-outline-bg-neutral:hover {\n border-color: var(--atomic-primary);\n }\n }\n @media (hover: hover) {\n .btn-outline-bg-neutral:hover {\n background-color: var(--atomic-neutral-light);\n }\n }\n @media (hover: hover) {\n .btn-outline-bg-neutral:hover {\n color: var(--atomic-primary);\n }\n }\n .btn-outline-bg-neutral:focus-visible {\n border-color: var(--atomic-primary);\n }\n .btn-outline-bg-neutral:focus-visible {\n background-color: var(--atomic-neutral-light);\n }\n .btn-outline-bg-neutral:focus-visible {\n color: var(--atomic-primary);\n }\n .btn-outline-bg-neutral:focus-visible {\n --tw-ring-shadow: var(--tw-ring-inset,) 0 0 0 calc(2px + var(--tw-ring-offset-width)) var(--tw-ring-color, currentcolor);\n box-shadow: var(--tw-inset-shadow), var(--tw-inset-ring-shadow), var(--tw-ring-offset-shadow), var(--tw-ring-shadow), var(--tw-shadow);\n }\n .btn-outline-bg-neutral:focus-visible {\n --tw-ring-color: var(--atomic-ring-primary);\n }\n .btn-outline-bg-neutral:focus-visible {\n --tw-outline-style: none;\n outline-style: none;\n }\n .btn-outline-bg-neutral:disabled {\n cursor: not-allowed;\n }\n .btn-outline-bg-neutral:disabled {\n border-color: var(--atomic-neutral);\n }\n .btn-outline-bg-neutral:disabled {\n color: var(--atomic-on-background);\n }\n .btn-outline-bg-neutral:disabled {\n opacity: 50%;\n }\n .btn-outline-bg-error {\n border-radius: var(--atomic-border-radius);\n border-style: var(--tw-border-style);\n border-width: 1px;\n border-color: var(--atomic-neutral);\n background-color: var(--atomic-background);\n color: var(--atomic-on-background);\n }\n @media (hover: hover) {\n .btn-outline-bg-error:hover {\n border-color: var(--atomic-primary);\n }\n }\n @media (hover: hover) {\n .btn-outline-bg-error:hover {\n background-color: var(--atomic-neutral-light);\n }\n }\n @media (hover: hover) {\n .btn-outline-bg-error:hover {\n color: var(--atomic-primary);\n }\n }\n .btn-outline-bg-error:focus-visible {\n border-color: var(--atomic-primary);\n }\n .btn-outline-bg-error:focus-visible {\n background-color: var(--atomic-neutral-light);\n }\n .btn-outline-bg-error:focus-visible {\n color: var(--atomic-primary);\n }\n .btn-outline-bg-error:focus-visible {\n --tw-ring-shadow: var(--tw-ring-inset,) 0 0 0 calc(2px + var(--tw-ring-offset-width)) var(--tw-ring-color, currentcolor);\n box-shadow: var(--tw-inset-shadow), var(--tw-inset-ring-shadow), var(--tw-ring-offset-shadow), var(--tw-ring-shadow), var(--tw-shadow);\n }\n .btn-outline-bg-error:focus-visible {\n --tw-ring-color: var(--atomic-ring-primary);\n }\n .btn-outline-bg-error:focus-visible {\n --tw-outline-style: none;\n outline-style: none;\n }\n .btn-outline-bg-error:disabled {\n cursor: not-allowed;\n }\n .btn-outline-bg-error:disabled {\n border-color: var(--atomic-neutral);\n }\n .btn-outline-bg-error:disabled {\n color: var(--atomic-on-background);\n }\n .btn-outline-bg-error:disabled {\n opacity: 50%;\n }\n .btn-outline-error {\n border-radius: var(--atomic-border-radius);\n border-style: var(--tw-border-style);\n border-width: 1px;\n border-color: var(--atomic-neutral);\n background-color: var(--atomic-background);\n color: var(--atomic-on-background);\n }\n @media (hover: hover) {\n .btn-outline-error:hover {\n border-color: var(--atomic-error);\n }\n }\n @media (hover: hover) {\n .btn-outline-error:hover {\n color: var(--atomic-error);\n }\n }\n .btn-outline-error:focus-visible {\n border-color: var(--atomic-error);\n }\n .btn-outline-error:focus-visible {\n color: var(--atomic-error);\n }\n .btn-outline-error:focus-visible {\n --tw-ring-shadow: var(--tw-ring-inset,) 0 0 0 calc(2px + var(--tw-ring-offset-width)) var(--tw-ring-color, currentcolor);\n box-shadow: var(--tw-inset-shadow), var(--tw-inset-ring-shadow), var(--tw-ring-offset-shadow), var(--tw-ring-shadow), var(--tw-shadow);\n }\n .btn-outline-error:focus-visible {\n --tw-ring-color: var(--atomic-ring-primary);\n }\n .btn-outline-error:focus-visible {\n --tw-outline-style: none;\n outline-style: none;\n }\n .btn-outline-error:disabled {\n cursor: not-allowed;\n }\n .btn-outline-error:disabled {\n border-color: var(--atomic-neutral);\n }\n .btn-outline-error:disabled {\n color: var(--atomic-on-background);\n }\n .btn-outline-error:disabled {\n opacity: 50%;\n }\n .btn-text-neutral {\n border-radius: var(--atomic-border-radius);\n background-color: var(--atomic-background);\n color: var(--atomic-on-background);\n }\n @media (hover: hover) {\n .btn-text-neutral:hover {\n background-color: var(--atomic-neutral-light);\n }\n }\n @media (hover: hover) {\n .btn-text-neutral:hover {\n color: var(--atomic-primary);\n }\n }\n .btn-text-neutral:focus-visible {\n background-color: var(--atomic-neutral-light);\n }\n .btn-text-neutral:focus-visible {\n color: var(--atomic-primary);\n }\n .btn-text-neutral:focus-visible {\n --tw-outline-style: none;\n outline-style: none;\n }\n .btn-text-transparent {\n color: var(--atomic-on-background);\n }\n @media (hover: hover) {\n .btn-text-transparent:hover {\n color: var(--atomic-primary-light);\n }\n }\n .btn-text-transparent:focus-visible {\n color: var(--atomic-primary-light);\n }\n .btn-square-neutral {\n border-style: var(--tw-border-style);\n border-width: 1px;\n border-color: var(--atomic-neutral);\n background-color: var(--atomic-background);\n color: var(--atomic-on-background);\n }\n @media (hover: hover) {\n .btn-square-neutral:hover {\n background-color: var(--atomic-neutral-light);\n }\n }\n .btn-square-neutral:focus-visible {\n background-color: var(--atomic-neutral-light);\n }\n .btn-square-neutral:focus-visible {\n --tw-outline-style: none;\n outline-style: none;\n }\n .btn-page {\n display: grid;\n height: calc(0.25rem * 10);\n width: calc(0.25rem * 10);\n place-items: center;\n border-style: var(--tw-border-style);\n border-width: 0px;\n font-size: var(--atomic-text-lg);\n line-height: var(--tw-leading, calc(1.75 / 1.125));\n }\n @media (hover: hover) {\n .btn-page:hover {\n border-style: var(--tw-border-style);\n border-width: 1px;\n }\n }\n .btn-page:focus-visible {\n border-style: var(--tw-border-style);\n border-width: 1px;\n }\n .btn-page.selected {\n border-style: var(--tw-border-style);\n border-width: 2px;\n border-color: var(--atomic-primary);\n --tw-font-weight: var(--atomic-font-bold);\n font-weight: var(--atomic-font-bold);\n }\n}\n@layer base {\n *, ::after, ::before, ::backdrop, ::file-selector-button {\n border-color: oklch(0.928 0.006 264.531);\n }\n :host {\n display: block;\n }\n :host, button, input, select {\n font-family: var(--atomic-font-family);\n font-size: var(--atomic-text-base);\n line-height: var(--tw-leading, calc(1.5 / 1));\n --tw-font-weight: var(--atomic-font-normal);\n font-weight: var(--atomic-font-normal);\n }\n button {\n cursor: pointer;\n }\n :host(.atomic-hidden) {\n display: none;\n }\n .ripple {\n position: absolute;\n pointer-events: none;\n transform: scale(0);\n border-radius: 50%;\n animation: ripple var(--animation-duration) linear;\n }\n .ripple-relative {\n position: relative;\n }\n .ripple-parent {\n overflow: hidden;\n }\n @keyframes ripple {\n to {\n transform: scale(4);\n opacity: 0;\n }\n }\n}\n@keyframes scaleUp {\n 0% {\n transform: scale(0.7) translateY(150vh);\n opacity: 0.7;\n }\n 100% {\n transform: scale(1) translateY(0px);\n opacity: 1;\n }\n}\n@keyframes slideDown {\n 0% {\n transform: translateY(0px);\n opacity: 1;\n }\n 100% {\n transform: translateY(150vh);\n opacity: 0.7;\n }\n}\ninput[type=\'text\']:focus-visible ~ .search-icon {\n color: var(--atomic-primary);\n}\ninput[type=\'text\']:hover ~ .search-icon {\n color: var(--atomic-primary-light);\n}\n.search-icon atomic-icon {\n width: var(--atomic-facet-search-icon-size, 0.75rem);\n height: var(--atomic-facet-search-icon-size, 0.75rem);\n}\n.search-clear-button atomic-icon {\n width: var(--atomic-facet-search-clear-icon-size, 0.625rem);\n height: var(--atomic-facet-search-clear-icon-size, 0.625rem);\n}\n@layer theme, base, components, utilities;\n@layer theme;\n@layer base {\n *, ::after, ::before, ::backdrop, ::file-selector-button {\n box-sizing: border-box;\n margin: 0;\n padding: 0;\n border: 0 solid;\n }\n html, :host {\n line-height: 1.5;\n -webkit-text-size-adjust: 100%;\n tab-size: 4;\n font-family: var(--default-font-family, var(--atomic-font-family, ui-sans-serif, system-ui, sans-serif, "Apple Color Emoji", "Segoe UI Emoji", "Segoe UI Symbol", "Noto Color Emoji"));\n font-feature-settings: var(--default-font-feature-settings, normal);\n font-variation-settings: var(--default-font-variation-settings, normal);\n -webkit-tap-highlight-color: transparent;\n }\n hr {\n height: 0;\n color: inherit;\n border-top-width: 1px;\n }\n abbr:where([title]) {\n -webkit-text-decoration: underline dotted;\n text-decoration: underline dotted;\n }\n h1, h2, h3, h4, h5, h6 {\n font-size: inherit;\n font-weight: inherit;\n }\n a {\n color: inherit;\n -webkit-text-decoration: inherit;\n text-decoration: inherit;\n }\n b, strong {\n font-weight: bolder;\n }\n code, kbd, samp, pre {\n font-family: var(--default-mono-font-family, ui-monospace, SFMono-Regular, Menlo, Monaco, Consolas, "Liberation Mono",\n "Courier New", monospace);\n font-feature-settings: var(--default-mono-font-feature-settings, normal);\n font-variation-settings: var(--default-mono-font-variation-settings, normal);\n font-size: 1em;\n }\n small {\n font-size: 80%;\n }\n sub, sup {\n font-size: 75%;\n line-height: 0;\n position: relative;\n vertical-align: baseline;\n }\n sub {\n bottom: -0.25em;\n }\n sup {\n top: -0.5em;\n }\n table {\n text-indent: 0;\n border-color: inherit;\n border-collapse: collapse;\n }\n :-moz-focusring {\n outline: auto;\n }\n progress {\n vertical-align: baseline;\n }\n summary {\n display: list-item;\n }\n ol, ul, menu {\n list-style: none;\n }\n img, svg, video, canvas, audio, iframe, embed, object {\n display: block;\n vertical-align: middle;\n }\n img, video {\n max-width: 100%;\n height: auto;\n }\n button, input, select, optgroup, textarea, ::file-selector-button {\n font: inherit;\n font-feature-settings: inherit;\n font-variation-settings: inherit;\n letter-spacing: inherit;\n color: inherit;\n border-radius: 0;\n background-color: transparent;\n opacity: 1;\n }\n :where(select:is([multiple], [size])) optgroup {\n font-weight: bolder;\n }\n :where(select:is([multiple], [size])) optgroup option {\n padding-inline-start: 20px;\n }\n ::file-selector-button {\n margin-inline-end: 4px;\n }\n ::placeholder {\n opacity: 1;\n }\n @supports (not (-webkit-appearance: -apple-pay-button)) or (contain-intrinsic-size: 1px) {\n ::placeholder {\n color: currentcolor;\n }\n @supports (color: color-mix(in lab, red, red)) {\n ::placeholder {\n color: color-mix(in oklab, currentcolor 50%, transparent);\n }\n }\n }\n textarea {\n resize: vertical;\n }\n ::-webkit-search-decoration {\n -webkit-appearance: none;\n }\n ::-webkit-date-and-time-value {\n min-height: 1lh;\n text-align: inherit;\n }\n ::-webkit-datetime-edit {\n display: inline-flex;\n }\n ::-webkit-datetime-edit-fields-wrapper {\n padding: 0;\n }\n ::-webkit-datetime-edit, ::-webkit-datetime-edit-year-field, ::-webkit-datetime-edit-month-field, ::-webkit-datetime-edit-day-field, ::-webkit-datetime-edit-hour-field, ::-webkit-datetime-edit-minute-field, ::-webkit-datetime-edit-second-field, ::-webkit-datetime-edit-millisecond-field, ::-webkit-datetime-edit-meridiem-field {\n padding-block: 0;\n }\n :-moz-ui-invalid {\n box-shadow: none;\n }\n button, input:where([type="button"], [type="reset"], [type="submit"]), ::file-selector-button {\n appearance: button;\n }\n ::-webkit-inner-spin-button, ::-webkit-outer-spin-button {\n height: auto;\n }\n [hidden]:where(:not([hidden="until-found"])) {\n display: none !important;\n }\n}\n@layer utilities;\n@layer theme, base, components, utilities;\n@layer components {\n .input-primary {\n border-radius: var(--atomic-border-radius);\n border-style: var(--tw-border-style);\n border-width: 1px;\n border-color: var(--atomic-neutral);\n background-color: var(--atomic-background);\n }\n @media (hover: hover) {\n .input-primary:hover {\n border-color: var(--atomic-primary-light);\n }\n }\n .input-primary:focus-visible {\n border-color: var(--atomic-primary);\n }\n .input-primary:focus-visible {\n --tw-ring-shadow: var(--tw-ring-inset,) 0 0 0 calc(2px + var(--tw-ring-offset-width)) var(--tw-ring-color, currentcolor);\n box-shadow: var(--tw-inset-shadow), var(--tw-inset-ring-shadow), var(--tw-ring-offset-shadow), var(--tw-ring-shadow), var(--tw-shadow);\n }\n .input-primary:focus-visible {\n --tw-ring-color: var(--atomic-ring-primary);\n }\n .input-primary:focus-visible {\n --tw-outline-style: none;\n outline-style: none;\n }\n .btn-radio {\n -webkit-appearance: none;\n -moz-appearance: none;\n appearance: none;\n }\n .btn-radio::before {\n content: var(--tw-content);\n --tw-content: attr(value);\n content: var(--tw-content);\n }\n .btn-primary {\n border-radius: var(--atomic-border-radius);\n background-color: var(--atomic-primary);\n color: var(--atomic-on-primary);\n }\n @media (hover: hover) {\n .btn-primary:hover {\n background-color: var(--atomic-primary-light);\n }\n }\n .btn-primary:focus-visible {\n background-color: var(--atomic-primary-light);\n }\n .btn-primary:focus-visible {\n --tw-ring-shadow: var(--tw-ring-inset,) 0 0 0 calc(2px + var(--tw-ring-offset-width)) var(--tw-ring-color, currentcolor);\n box-shadow: var(--tw-inset-shadow), var(--tw-inset-ring-shadow), var(--tw-ring-offset-shadow), var(--tw-ring-shadow), var(--tw-shadow);\n }\n .btn-primary:focus-visible {\n --tw-ring-color: var(--atomic-ring-primary);\n }\n .btn-primary:focus-visible {\n --tw-outline-style: none;\n outline-style: none;\n }\n .btn-primary:disabled {\n cursor: not-allowed;\n }\n .btn-primary:disabled {\n background-color: var(--atomic-disabled);\n }\n .btn-outline-primary {\n border-radius: var(--atomic-border-radius);\n border-style: var(--tw-border-style);\n border-width: 1px;\n border-color: var(--atomic-neutral);\n background-color: var(--atomic-background);\n color: var(--atomic-primary);\n }\n @media (hover: hover) {\n .btn-outline-primary:hover {\n border-color: var(--atomic-primary-light);\n }\n }\n @media (hover: hover) {\n .btn-outline-primary:hover {\n color: var(--atomic-primary-light);\n }\n }\n .btn-outline-primary:focus-visible {\n border-color: var(--atomic-primary);\n }\n .btn-outline-primary:focus-visible {\n color: var(--atomic-primary);\n }\n .btn-outline-primary:focus-visible {\n --tw-ring-shadow: var(--tw-ring-inset,) 0 0 0 calc(2px + var(--tw-ring-offset-width)) var(--tw-ring-color, currentcolor);\n box-shadow: var(--tw-inset-shadow), var(--tw-inset-ring-shadow), var(--tw-ring-offset-shadow), var(--tw-ring-shadow), var(--tw-shadow);\n }\n .btn-outline-primary:focus-visible {\n --tw-ring-color: var(--atomic-ring-primary);\n }\n .btn-outline-primary:focus-visible {\n --tw-outline-style: none;\n outline-style: none;\n }\n .btn-outline-primary:disabled {\n cursor: not-allowed;\n }\n .btn-outline-primary:disabled {\n border-color: var(--atomic-neutral);\n }\n .btn-outline-primary:disabled {\n color: var(--atomic-neutral);\n }\n .btn-text-primary {\n border-radius: var(--atomic-border-radius);\n background-color: var(--atomic-background);\n color: var(--atomic-primary);\n }\n @media (hover: hover) {\n .btn-text-primary:hover {\n background-color: var(--atomic-neutral-light);\n }\n }\n .btn-text-primary:focus-visible {\n background-color: var(--atomic-neutral-light);\n }\n .btn-text-primary:focus-visible {\n --tw-outline-style: none;\n outline-style: none;\n }\n .btn-outline-neutral {\n border-radius: var(--atomic-border-radius);\n border-style: var(--tw-border-style);\n border-width: 1px;\n border-color: var(--atomic-neutral);\n background-color: var(--atomic-background);\n color: var(--atomic-on-background);\n }\n @media (hover: hover) {\n .btn-outline-neutral:hover {\n border-color: var(--atomic-primary);\n }\n }\n @media (hover: hover) {\n .btn-outline-neutral:hover {\n color: var(--atomic-primary);\n }\n }\n .btn-outline-neutral:focus-visible {\n border-color: var(--atomic-primary);\n }\n .btn-outline-neutral:focus-visible {\n color: var(--atomic-primary);\n }\n .btn-outline-neutral:focus-visible {\n --tw-ring-shadow: var(--tw-ring-inset,) 0 0 0 calc(2px + var(--tw-ring-offset-width)) var(--tw-ring-color, currentcolor);\n box-shadow: var(--tw-inset-shadow), var(--tw-inset-ring-shadow), var(--tw-ring-offset-shadow), var(--tw-ring-shadow), var(--tw-shadow);\n }\n .btn-outline-neutral:focus-visible {\n --tw-ring-color: var(--atomic-ring-primary);\n }\n .btn-outline-neutral:focus-visible {\n --tw-outline-style: none;\n outline-style: none;\n }\n .btn-outline-neutral:disabled {\n cursor: not-allowed;\n }\n .btn-outline-neutral:disabled {\n border-color: var(--atomic-neutral);\n }\n .btn-outline-neutral:disabled {\n color: var(--atomic-on-background);\n }\n .btn-outline-neutral:disabled {\n opacity: 50%;\n }\n .btn-outline-bg-neutral {\n border-radius: var(--atomic-border-radius);\n border-style: var(--tw-border-style);\n border-width: 1px;\n border-color: var(--atomic-neutral);\n background-color: var(--atomic-background);\n color: var(--atomic-on-background);\n }\n @media (hover: hover) {\n .btn-outline-bg-neutral:hover {\n border-color: var(--atomic-primary);\n }\n }\n @media (hover: hover) {\n .btn-outline-bg-neutral:hover {\n background-color: var(--atomic-neutral-light);\n }\n }\n @media (hover: hover) {\n .btn-outline-bg-neutral:hover {\n color: var(--atomic-primary);\n }\n }\n .btn-outline-bg-neutral:focus-visible {\n border-color: var(--atomic-primary);\n }\n .btn-outline-bg-neutral:focus-visible {\n background-color: var(--atomic-neutral-light);\n }\n .btn-outline-bg-neutral:focus-visible {\n color: var(--atomic-primary);\n }\n .btn-outline-bg-neutral:focus-visible {\n --tw-ring-shadow: var(--tw-ring-inset,) 0 0 0 calc(2px + var(--tw-ring-offset-width)) var(--tw-ring-color, currentcolor);\n box-shadow: var(--tw-inset-shadow), var(--tw-inset-ring-shadow), var(--tw-ring-offset-shadow), var(--tw-ring-shadow), var(--tw-shadow);\n }\n .btn-outline-bg-neutral:focus-visible {\n --tw-ring-color: var(--atomic-ring-primary);\n }\n .btn-outline-bg-neutral:focus-visible {\n --tw-outline-style: none;\n outline-style: none;\n }\n .btn-outline-bg-neutral:disabled {\n cursor: not-allowed;\n }\n .btn-outline-bg-neutral:disabled {\n border-color: var(--atomic-neutral);\n }\n .btn-outline-bg-neutral:disabled {\n color: var(--atomic-on-background);\n }\n .btn-outline-bg-neutral:disabled {\n opacity: 50%;\n }\n .btn-outline-bg-error {\n border-radius: var(--atomic-border-radius);\n border-style: var(--tw-border-style);\n border-width: 1px;\n border-color: var(--atomic-neutral);\n background-color: var(--atomic-background);\n color: var(--atomic-on-background);\n }\n @media (hover: hover) {\n .btn-outline-bg-error:hover {\n border-color: var(--atomic-primary);\n }\n }\n @media (hover: hover) {\n .btn-outline-bg-error:hover {\n background-color: var(--atomic-neutral-light);\n }\n }\n @media (hover: hover) {\n .btn-outline-bg-error:hover {\n color: var(--atomic-primary);\n }\n }\n .btn-outline-bg-error:focus-visible {\n border-color: var(--atomic-primary);\n }\n .btn-outline-bg-error:focus-visible {\n background-color: var(--atomic-neutral-light);\n }\n .btn-outline-bg-error:focus-visible {\n color: var(--atomic-primary);\n }\n .btn-outline-bg-error:focus-visible {\n --tw-ring-shadow: var(--tw-ring-inset,) 0 0 0 calc(2px + var(--tw-ring-offset-width)) var(--tw-ring-color, currentcolor);\n box-shadow: var(--tw-inset-shadow), var(--tw-inset-ring-shadow), var(--tw-ring-offset-shadow), var(--tw-ring-shadow), var(--tw-shadow);\n }\n .btn-outline-bg-error:focus-visible {\n --tw-ring-color: var(--atomic-ring-primary);\n }\n .btn-outline-bg-error:focus-visible {\n --tw-outline-style: none;\n outline-style: none;\n }\n .btn-outline-bg-error:disabled {\n cursor: not-allowed;\n }\n .btn-outline-bg-error:disabled {\n border-color: var(--atomic-neutral);\n }\n .btn-outline-bg-error:disabled {\n color: var(--atomic-on-background);\n }\n .btn-outline-bg-error:disabled {\n opacity: 50%;\n }\n .btn-outline-error {\n border-radius: var(--atomic-border-radius);\n border-style: var(--tw-border-style);\n border-width: 1px;\n border-color: var(--atomic-neutral);\n background-color: var(--atomic-background);\n color: var(--atomic-on-background);\n }\n @media (hover: hover) {\n .btn-outline-error:hover {\n border-color: var(--atomic-error);\n }\n }\n @media (hover: hover) {\n .btn-outline-error:hover {\n color: var(--atomic-error);\n }\n }\n .btn-outline-error:focus-visible {\n border-color: var(--atomic-error);\n }\n .btn-outline-error:focus-visible {\n color: var(--atomic-error);\n }\n .btn-outline-error:focus-visible {\n --tw-ring-shadow: var(--tw-ring-inset,) 0 0 0 calc(2px + var(--tw-ring-offset-width)) var(--tw-ring-color, currentcolor);\n box-shadow: var(--tw-inset-shadow), var(--tw-inset-ring-shadow), var(--tw-ring-offset-shadow), var(--tw-ring-shadow), var(--tw-shadow);\n }\n .btn-outline-error:focus-visible {\n --tw-ring-color: var(--atomic-ring-primary);\n }\n .btn-outline-error:focus-visible {\n --tw-outline-style: none;\n outline-style: none;\n }\n .btn-outline-error:disabled {\n cursor: not-allowed;\n }\n .btn-outline-error:disabled {\n border-color: var(--atomic-neutral);\n }\n .btn-outline-error:disabled {\n color: var(--atomic-on-background);\n }\n .btn-outline-error:disabled {\n opacity: 50%;\n }\n .btn-text-neutral {\n border-radius: var(--atomic-border-radius);\n background-color: var(--atomic-background);\n color: var(--atomic-on-background);\n }\n @media (hover: hover) {\n .btn-text-neutral:hover {\n background-color: var(--atomic-neutral-light);\n }\n }\n @media (hover: hover) {\n .btn-text-neutral:hover {\n color: var(--atomic-primary);\n }\n }\n .btn-text-neutral:focus-visible {\n background-color: var(--atomic-neutral-light);\n }\n .btn-text-neutral:focus-visible {\n color: var(--atomic-primary);\n }\n .btn-text-neutral:focus-visible {\n --tw-outline-style: none;\n outline-style: none;\n }\n .btn-text-transparent {\n color: var(--atomic-on-background);\n }\n @media (hover: hover) {\n .btn-text-transparent:hover {\n color: var(--atomic-primary-light);\n }\n }\n .btn-text-transparent:focus-visible {\n color: var(--atomic-primary-light);\n }\n .btn-square-neutral {\n border-style: var(--tw-border-style);\n border-width: 1px;\n border-color: var(--atomic-neutral);\n background-color: var(--atomic-background);\n color: var(--atomic-on-background);\n }\n @media (hover: hover) {\n .btn-square-neutral:hover {\n background-color: var(--atomic-neutral-light);\n }\n }\n .btn-square-neutral:focus-visible {\n background-color: var(--atomic-neutral-light);\n }\n .btn-square-neutral:focus-visible {\n --tw-outline-style: none;\n outline-style: none;\n }\n .btn-page {\n display: grid;\n height: calc(0.25rem * 10);\n width: calc(0.25rem * 10);\n place-items: center;\n border-style: var(--tw-border-style);\n border-width: 0px;\n font-size: var(--atomic-text-lg);\n line-height: var(--tw-leading, calc(1.75 / 1.125));\n }\n @media (hover: hover) {\n .btn-page:hover {\n border-style: var(--tw-border-style);\n border-width: 1px;\n }\n }\n .btn-page:focus-visible {\n border-style: var(--tw-border-style);\n border-width: 1px;\n }\n .btn-page.selected {\n border-style: var(--tw-border-style);\n border-width: 2px;\n border-color: var(--atomic-primary);\n --tw-font-weight: var(--atomic-font-bold);\n font-weight: var(--atomic-font-bold);\n }\n}\n@layer base {\n *, ::after, ::before, ::backdrop, ::file-selector-button {\n border-color: oklch(0.928 0.006 264.531);\n }\n :host {\n display: block;\n }\n :host, button, input, select {\n font-family: var(--atomic-font-family);\n font-size: var(--atomic-text-base);\n line-height: var(--tw-leading, calc(1.5 / 1));\n --tw-font-weight: var(--atomic-font-normal);\n font-weight: var(--atomic-font-normal);\n }\n button {\n cursor: pointer;\n }\n :host(.atomic-hidden) {\n display: none;\n }\n .ripple {\n position: absolute;\n pointer-events: none;\n transform: scale(0);\n border-radius: 50%;\n animation: ripple var(--animation-duration) linear;\n }\n .ripple-relative {\n position: relative;\n }\n .ripple-parent {\n overflow: hidden;\n }\n @keyframes ripple {\n to {\n transform: scale(4);\n opacity: 0;\n }\n }\n}\n@keyframes scaleUp {\n 0% {\n transform: scale(0.7) translateY(150vh);\n opacity: 0.7;\n }\n 100% {\n transform: scale(1) translateY(0px);\n opacity: 1;\n }\n}\n@keyframes slideDown {\n 0% {\n transform: translateY(0px);\n opacity: 1;\n }\n 100% {\n transform: translateY(150vh);\n opacity: 0.7;\n }\n}\n.value-count {\n margin-left: calc(0.25rem * 1.5);\n color: var(--atomic-neutral-dark);\n}\n[part=\'value-exclude-button\'] + .value-count {\n margin-right: calc(0.25rem * 2);\n}\n:host(.popover-nested) {\n min-width: 18rem;\n}\n:host(.popover-nested)::part(label-button) {\n display: none;\n}\n:host(.popover-nested)::part(facet) {\n --tw-shadow: 0px 2px 8px var(--tw-shadow-color, rgba(229, 232, 232, 0.75));\n box-shadow: var(--tw-inset-shadow), var(--tw-inset-ring-shadow), var(--tw-ring-offset-shadow), var(--tw-ring-shadow), var(--tw-shadow);\n}\n:host(.popover-nested)::part(values) {\n margin-top: calc(0.25rem * 0);\n max-height: calc(0.25rem * 96);\n overflow-y: auto;\n}\n:host(.popover-nested)::part(search-wrapper) {\n margin-bottom: calc(0.25rem * 2);\n}\n.value-checkbox {\n width: var(--atomic-facet-checkbox-size, 1rem);\n height: var(--atomic-facet-checkbox-size, 1rem);\n position: absolute;\n left: calc(0.25rem * 2);\n z-index: 1;\n}\n.value-checkbox + label {\n display: flex;\n width: 100%;\n cursor: pointer;\n flex-direction: row;\n overflow: hidden;\n text-overflow: ellipsis;\n white-space: nowrap;\n padding-block: calc(0.25rem * 2.5);\n padding-right: calc(0.25rem * 2);\n padding-left: calc(0.25rem * 8);\n color: var(--atomic-on-background);\n}\n@media (hover: hover) {\n .value-checkbox + label:hover {\n background-color: var(--atomic-neutral-light);\n }\n}\n.value-checkbox.selected:focus-visible + label .value-label, .value-checkbox.selected:hover + label .value-label {\n color: var(--atomic-primary);\n}\n.value-checkbox.excluded:focus-visible + label .value-label, .value-checkbox.excluded:hover + label .value-label {\n color: var(--atomic-error);\n}\n.value-exclude-button:focus-visible atomic-icon {\n visibility: visible;\n}\n.box-container {\n display: grid;\n padding-inline: calc(0.25rem * 2);\n grid-template-columns: repeat(var(--atomic-facet-boxes-per-row, 4), minmax(0, 1fr));\n gap: var(--atomic-facet-boxes-gap, 0.5rem);\n}\n.value-box .value-label, .value-box-count {\n display: block;\n width: 100%;\n}\n.value-box.selected {\n box-shadow: 0 0 0 1px var(--atomic-primary);\n}\n@property --tw-translate-x {\n syntax: "*";\n inherits: false;\n initial-value: 0;\n}\n@property --tw-translate-y {\n syntax: "*";\n inherits: false;\n initial-value: 0;\n}\n@property --tw-translate-z {\n syntax: "*";\n inherits: false;\n initial-value: 0;\n}\n@property --tw-scale-x {\n syntax: "*";\n inherits: false;\n initial-value: 1;\n}\n@property --tw-scale-y {\n syntax: "*";\n inherits: false;\n initial-value: 1;\n}\n@property --tw-scale-z {\n syntax: "*";\n inherits: false;\n initial-value: 1;\n}\n@property --tw-rotate-x {\n syntax: "*";\n inherits: false;\n}\n@property --tw-rotate-y {\n syntax: "*";\n inherits: false;\n}\n@property --tw-rotate-z {\n syntax: "*";\n inherits: false;\n}\n@property --tw-skew-x {\n syntax: "*";\n inherits: false;\n}\n@property --tw-skew-y {\n syntax: "*";\n inherits: false;\n}\n@property --tw-space-x-reverse {\n syntax: "*";\n inherits: false;\n initial-value: 0;\n}\n@property --tw-divide-y-reverse {\n syntax: "*";\n inherits: false;\n initial-value: 0;\n}\n@property --tw-border-style {\n syntax: "*";\n inherits: false;\n initial-value: solid;\n}\n@property --tw-gradient-position {\n syntax: "*";\n inherits: false;\n}\n@property --tw-gradient-from {\n syntax: "<color>";\n inherits: false;\n initial-value: #0000;\n}\n@property --tw-gradient-via {\n syntax: "<color>";\n inherits: false;\n initial-value: #0000;\n}\n@property --tw-gradient-to {\n syntax: "<color>";\n inherits: false;\n initial-value: #0000;\n}\n@property --tw-gradient-stops {\n syntax: "*";\n inherits: false;\n}\n@property --tw-gradient-via-stops {\n syntax: "*";\n inherits: false;\n}\n@property --tw-gradient-from-position {\n syntax: "<length-percentage>";\n inherits: false;\n initial-value: 0%;\n}\n@property --tw-gradient-via-position {\n syntax: "<length-percentage>";\n inherits: false;\n initial-value: 50%;\n}\n@property --tw-gradient-to-position {\n syntax: "<length-percentage>";\n inherits: false;\n initial-value: 100%;\n}\n@property --tw-leading {\n syntax: "*";\n inherits: false;\n}\n@property --tw-font-weight {\n syntax: "*";\n inherits: false;\n}\n@property --tw-shadow {\n syntax: "*";\n inherits: false;\n initial-value: 0 0 #0000;\n}\n@property --tw-shadow-color {\n syntax: "*";\n inherits: false;\n}\n@property --tw-shadow-alpha {\n syntax: "<percentage>";\n inherits: false;\n initial-value: 100%;\n}\n@property --tw-inset-shadow {\n syntax: "*";\n inherits: false;\n initial-value: 0 0 #0000;\n}\n@property --tw-inset-shadow-color {\n syntax: "*";\n inherits: false;\n}\n@property --tw-inset-shadow-alpha {\n syntax: "<percentage>";\n inherits: false;\n initial-value: 100%;\n}\n@property --tw-ring-color {\n syntax: "*";\n inherits: false;\n}\n@property --tw-ring-shadow {\n syntax: "*";\n inherits: false;\n initial-value: 0 0 #0000;\n}\n@property --tw-inset-ring-color {\n syntax: "*";\n inherits: false;\n}\n@property --tw-inset-ring-shadow {\n syntax: "*";\n inherits: false;\n initial-value: 0 0 #0000;\n}\n@property --tw-ring-inset {\n syntax: "*";\n inherits: false;\n}\n@property --tw-ring-offset-width {\n syntax: "<length>";\n inherits: false;\n initial-value: 0px;\n}\n@property --tw-ring-offset-color {\n syntax: "*";\n inherits: false;\n initial-value: #fff;\n}\n@property --tw-ring-offset-shadow {\n syntax: "*";\n inherits: false;\n initial-value: 0 0 #0000;\n}\n@property --tw-outline-style {\n syntax: "*";\n inherits: false;\n initial-value: solid;\n}\n@property --tw-blur {\n syntax: "*";\n inherits: false;\n}\n@property --tw-brightness {\n syntax: "*";\n inherits: false;\n}\n@property --tw-contrast {\n syntax: "*";\n inherits: false;\n}\n@property --tw-grayscale {\n syntax: "*";\n inherits: false;\n}\n@property --tw-hue-rotate {\n syntax: "*";\n inherits: false;\n}\n@property --tw-invert {\n syntax: "*";\n inherits: false;\n}\n@property --tw-opacity {\n syntax: "*";\n inherits: false;\n}\n@property --tw-saturate {\n syntax: "*";\n inherits: false;\n}\n@property --tw-sepia {\n syntax: "*";\n inherits: false;\n}\n@property --tw-drop-shadow {\n syntax: "*";\n inherits: false;\n}\n@property --tw-drop-shadow-color {\n syntax: "*";\n inherits: false;\n}\n@property --tw-drop-shadow-alpha {\n syntax: "<percentage>";\n inherits: false;\n initial-value: 100%;\n}\n@property --tw-drop-shadow-size {\n syntax: "*";\n inherits: false;\n}\n@property --tw-duration {\n syntax: "*";\n inherits: false;\n}\n@property --tw-ease {\n syntax: "*";\n inherits: false;\n}\n@property --tw-content {\n syntax: "*";\n initial-value: "";\n inherits: false;\n}\n@keyframes spin {\n to {\n transform: rotate(360deg);\n }\n}\n@keyframes pulse {\n 50% {\n opacity: 0.5;\n }\n}\n@keyframes spin {\n to {\n transform: rotate(360deg);\n }\n}\n@keyframes pulse {\n 50% {\n opacity: 0.5;\n }\n}\n@keyframes spin {\n to {\n transform: rotate(360deg);\n }\n}\n@keyframes pulse {\n 50% {\n opacity: 0.5;\n }\n}\n@keyframes spin {\n to {\n transform: rotate(360deg);\n }\n}\n@keyframes pulse {\n 50% {\n opacity: 0.5;\n }\n}\n@keyframes spin {\n to {\n transform: rotate(360deg);\n }\n}\n@keyframes pulse {\n 50% {\n opacity: 0.5;\n }\n}\n@keyframes spin {\n to {\n transform: rotate(360deg);\n }\n}\n@keyframes pulse {\n 50% {\n opacity: 0.5;\n }\n}\n@keyframes spin {\n to {\n transform: rotate(360deg);\n }\n}\n@keyframes pulse {\n 50% {\n opacity: 0.5;\n }\n}\n@keyframes spin {\n to {\n transform: rotate(360deg);\n }\n}\n@keyframes pulse {\n 50% {\n opacity: 0.5;\n }\n}\n@layer properties {\n @supports ((-webkit-hyphens: none) and (not (margin-trim: inline))) or ((-moz-orient: inline) and (not (color:rgb(from red r g b)))) {\n *, ::before, ::after, ::backdrop {\n --tw-translate-x: 0;\n --tw-translate-y: 0;\n --tw-translate-z: 0;\n --tw-scale-x: 1;\n --tw-scale-y: 1;\n --tw-scale-z: 1;\n --tw-rotate-x: initial;\n --tw-rotate-y: initial;\n --tw-rotate-z: initial;\n --tw-skew-x: initial;\n --tw-skew-y: initial;\n --tw-space-x-reverse: 0;\n --tw-divide-y-reverse: 0;\n --tw-border-style: solid;\n --tw-gradient-position: initial;\n --tw-gradient-from: #0000;\n --tw-gradient-via: #0000;\n --tw-gradient-to: #0000;\n --tw-gradient-stops: initial;\n --tw-gradient-via-stops: initial;\n --tw-gradient-from-position: 0%;\n --tw-gradient-via-position: 50%;\n --tw-gradient-to-position: 100%;\n --tw-leading: initial;\n --tw-font-weight: initial;\n --tw-shadow: 0 0 #0000;\n --tw-shadow-color: initial;\n --tw-shadow-alpha: 100%;\n --tw-inset-shadow: 0 0 #0000;\n --tw-inset-shadow-color: initial;\n --tw-inset-shadow-alpha: 100%;\n --tw-ring-color: initial;\n --tw-ring-shadow: 0 0 #0000;\n --tw-inset-ring-color: initial;\n --tw-inset-ring-shadow: 0 0 #0000;\n --tw-ring-inset: initial;\n --tw-ring-offset-width: 0px;\n --tw-ring-offset-color: #fff;\n --tw-ring-offset-shadow: 0 0 #0000;\n --tw-outline-style: solid;\n --tw-blur: initial;\n --tw-brightness: initial;\n --tw-contrast: initial;\n --tw-grayscale: initial;\n --tw-hue-rotate: initial;\n --tw-invert: initial;\n --tw-opacity: initial;\n --tw-saturate: initial;\n --tw-sepia: initial;\n --tw-drop-shadow: initial;\n --tw-drop-shadow-color: initial;\n --tw-drop-shadow-alpha: 100%;\n --tw-drop-shadow-size: initial;\n --tw-duration: initial;\n --tw-ease: initial;\n --tw-content: "";\n }\n }\n}\n';const q=O;var L=undefined&&undefined.__decorate||function(n,r,t,e){var o=arguments.length,i=o<3?r:e===null?e=Object.getOwnPropertyDescriptor(r,t):e,a;if(typeof Reflect==="object"&&typeof Reflect.decorate==="function")i=Reflect.decorate(n,r,t,e);else for(var l=n.length-1;l>=0;l--)if(a=n[l])i=(o<3?a(i):o>3?a(r,t,i):a(r,t))||i;return o>3&&i&&Object.defineProperty(r,t,i),i};const I=class{constructor(r){n(this,r);this.label="no-label";this.tabsIncluded="[]";this.tabsExcluded="[]";this.numberOfValues=8;this.withSearch=true;this.sortCriteria="automatic";this.resultsMustMatch="atLeastOneValue";this.displayValuesAs="checkbox";this.isCollapsed=false;this.headingLevel=0;this.filterFacetCount=true;this.enableExclusion=false;this.injectionDepth=1e3;this.dependsOn={};this.allowedValues="[]";this.customSort="[]";this.facetState=undefined;this.searchStatusState=undefined;this.tabManagerState=undefined;this.error=undefined;this.facetId=undefined;this.label="no-label";this.field=undefined;this.tabsIncluded="[]";this.tabsExcluded="[]";this.numberOfValues=8;this.withSearch=true;this.sortCriteria="automatic";this.resultsMustMatch="atLeastOneValue";this.displayValuesAs="checkbox";this.isCollapsed=false;this.headingLevel=0;this.filterFacetCount=true;this.enableExclusion=false;this.injectionDepth=1e3;this.dependsOn={};this.allowedValues="[]";this.customSort="[]"}initialize(){if([...this.tabsIncluded].length>0&&[...this.tabsExcluded].length>0){console.warn('Values for both "tabs-included" and "tabs-excluded" have been provided. This is could lead to unexpected behaviors.')}if(this.displayValuesAs!=="checkbox"&&this.enableExclusion){console.warn('The "enableExclusion" property is only available when "displayValuesAs" is set to "checkbox".')}this.facet=o(this.bindings.engine,{options:this.facetOptions});this.facetId=this.facet.state.facetId;this.searchStatus=i(this.bindings.engine);this.tabManager=a(this.bindings.engine);this.initAriaLive();this.initConditionManager();this.initPopover();this.registerFacet()}disconnectedCallback(){if(this.host.isConnected){return}this.facetConditionsManager?.stopWatching()}componentShouldUpdate(n,r,t){if(this.isFacetState(r,t)&&this.isFacetState(n,t)){return k(n.facetSearch,r.facetSearch)}return true}render(){return r(g,{key:"872e5b25fdec96ad0d35e2dd75fa68a2ed804be2",enabled:this.facetState.enabled,hasError:this.searchStatusState.hasError,firstSearchExecuted:this.searchStatusState.firstSearchExecuted,hasResults:this.facetState.values.length>0},this.searchStatusState.firstSearchExecuted?r(w,null,r(v,{i18n:this.bindings.i18n,label:this.definedLabel,onClearFilters:()=>{this.focusTargets.header.focusAfterSearch();this.facet.deselectAll()},numberOfActiveValues:this.activeValues.length,isCollapsed:this.isCollapsed,headingLevel:this.headingLevel,onToggleCollapse:()=>this.isCollapsed=!this.isCollapsed,headerRef:n=>this.focusTargets.header.setTarget(n)}),this.renderBody()):r(f,{numberOfValues:this.numberOfValues,isCollapsed:this.isCollapsed}))}renderBody(){if(this.isCollapsed){return}return r(t,null,r(M,{canShowMoreValues:this.facetState.canShowMoreValues,numberOfDisplayedValues:this.facetState.values.length,withSearch:this.withSearch},r(j,{i18n:this.bindings.i18n,label:this.definedLabel,onChange:n=>{if(n===""){this.facet.facetSearch.clear();return}this.facet.facetSearch.updateCaptions(s(this.field,this.bindings.i18n));this.facet.facetSearch.updateText(n);this.facet.facetSearch.search()},onClear:()=>this.facet.facetSearch.clear(),query:this.facetState.facetSearch.query})),z(this.facetState.facetSearch)?[this.renderSearchResults(),this.renderMatches()]:[this.renderValues(),this.renderShowMoreLess()])}renderValuesContainer(n,t){const e=`mt-3 ${this.displayValuesAs==="box"?"box-container":""}`;return r(C,{i18n:this.bindings.i18n,label:this.label,query:t},r("ul",{class:e,part:"values"},n))}renderSearchResults(){return this.renderValuesContainer(this.facet.state.facetSearch.values.map((n=>r(F,{...this.facetValueProps,facetCount:n.count,onExclude:()=>this.facet.facetSearch.exclude(n),onSelect:()=>this.displayValuesAs==="link"?this.facet.facetSearch.singleSelect(n):this.facet.facetSearch.select(n),facetValue:n.rawValue}))))}renderValues(){return this.renderValuesContainer(this.facet.state.values.map(((n,t)=>{const e=t===0;const o=t===(this.sortCriteria==="automatic"?0:this.facet.state.values.length-this.numberOfValues);return r(V,{...this.facetValueProps,facetCount:n.numberOfResults,onExclude:()=>this.facet.toggleExclude(n),onSelect:()=>this.displayValuesAs==="link"?this.facet.toggleSingleSelect(n):this.facet.toggleSelect(n),facetValue:n.value,facetState:n.state,setRef:n=>{if(e){this.showLessFocus?.setTarget(n)}if(o){this.showMoreFocus?.setTarget(n)}}})})))}renderShowMoreLess(){return r(y,{label:this.label,i18n:this.bindings.i18n,onShowMore:()=>{this.focusTargets.showMore.focusAfterSearch();this.facet.showMoreValues()},onShowLess:()=>{this.focusTargets.showLess.focusAfterSearch();this.facet.showLessValues()},canShowMoreValues:this.facet.state.canShowMoreValues,canShowLessValues:this.facet.state.canShowLessValues})}renderMatches(){return r(S,{i18n:this.bindings.i18n,query:this.facet.state.facetSearch.query,numberOfMatches:this.facet.state.facetSearch.values.length,hasMoreMatches:this.facet.state.facetSearch.moreValuesAvailable,showMoreMatches:()=>this.facet.facetSearch.showMoreResults()})}get activeValues(){return this.facet.state.values.filter((({state:n})=>n!=="idle"))}get facetOptions(){return{facetId:this.facetId,field:this.field,numberOfValues:this.numberOfValues,sortCriteria:this.sortCriteria,resultsMustMatch:this.resultsMustMatch,facetSearch:{numberOfValues:this.numberOfValues},filterFacetCount:this.filterFacetCount,injectionDepth:this.injectionDepth,allowedValues:this.allowedValues.length?[...this.allowedValues]:undefined,customSort:this.customSort.length?[...this.customSort]:undefined,tabs:{included:[...this.tabsIncluded],excluded:[...this.tabsExcluded]}}}get facetValueProps(){return{facetSearchQuery:this.facetState.facetSearch.query,displayValuesAs:this.displayValuesAs,enableExclusion:this.enableExclusion,field:this.field,i18n:this.bindings.i18n}}get isHidden(){return!this.facet.state.enabled||!this.facet.state.values.length}initConditionManager(){this.facetConditionsManager=l(this.bindings.engine,{facetId:this.facetId,conditions:p(this.dependsOn)})}registerFacet(){this.bindings.store.registerFacet("facets",this.facetInfo)}initPopover(){E(this.host,{...this.facetInfo,hasValues:()=>!!this.facet.state.values.length,numberOfActiveValues:()=>this.activeValues.length})}initAriaLive(){x(this.facet,this.label,(n=>this.facetSearchAriaMessage=n),this.bindings.i18n)}get facetInfo(){return{label:()=>this.bindings.i18n.t(this.label),facetId:this.facetId,element:this.host,isHidden:()=>this.isHidden}}get definedLabel(){return this.label==="no-label"&&this.facetState?.label?this.facetState.label:this.label}get focusTargets(){if(!this.showLessFocus){this.showLessFocus=new u(this)}if(!this.showMoreFocus){this.showMoreFocus=new u(this)}if(!this.headerFocus){this.headerFocus=new u(this)}return{showLess:this.showLessFocus,showMore:this.showMoreFocus,header:this.headerFocus}}isFacetState(n,r){return r==="facetState"&&typeof n?.facetId==="string"}get host(){return e(this)}};L([c()],I.prototype,"bindings",void 0);L([d("facet")],I.prototype,"facetState",void 0);L([d("searchStatus")],I.prototype,"searchStatusState",void 0);L([d("tabManager")],I.prototype,"tabManagerState",void 0);L([h()],I.prototype,"tabsIncluded",void 0);L([h()],I.prototype,"tabsExcluded",void 0);L([m()],I.prototype,"dependsOn",void 0);L([h()],I.prototype,"allowedValues",void 0);L([h()],I.prototype,"customSort",void 0);L([b("facet-search")],I.prototype,"facetSearchAriaMessage",void 0);I.style=q;export{I as atomic_facet};
2
+ //# sourceMappingURL=p-1e0f2e91.entry.js.map
@@ -1 +1 @@
1
- {"version":3,"names":["atomicFacetCss","AtomicFacetStyle0","AtomicFacet","this","label","tabsIncluded","tabsExcluded","numberOfValues","withSearch","sortCriteria","resultsMustMatch","displayValuesAs","isCollapsed","headingLevel","filterFacetCount","enableExclusion","injectionDepth","dependsOn","allowedValues","customSort","initialize","length","console","warn","facet","buildFacet","bindings","engine","options","facetOptions","facetId","state","searchStatus","buildSearchStatus","tabManager","buildTabManager","initAriaLive","initConditionManager","initPopover","registerFacet","disconnectedCallback","host","isConnected","facetConditionsManager","stopWatching","componentShouldUpdate","next","prev","propName","isFacetState","shouldUpdateFacetSearchComponent","facetSearch","render","h","FacetGuard","key","enabled","facetState","hasError","searchStatusState","firstSearchExecuted","hasResults","values","FacetContainer","FacetHeader","i18n","definedLabel","onClearFilters","focusTargets","header","focusAfterSearch","deselectAll","numberOfActiveValues","activeValues","onToggleCollapse","headerRef","el","setTarget","renderBody","FacetPlaceholder","Fragment","FacetSearchInputGuard","canShowMoreValues","numberOfDisplayedValues","FacetSearchInput","onChange","value","clear","updateCaptions","getFieldCaptions","field","updateText","search","onClear","query","shouldDisplaySearchResults","renderSearchResults","renderMatches","renderValues","renderShowMoreLess","renderValuesContainer","children","classes","FacetValuesGroup","class","part","map","FacetSearchValue","facetValueProps","facetCount","count","onExclude","exclude","onSelect","singleSelect","select","facetValue","rawValue","i","shouldFocusOnShowLessAfterInteraction","shouldFocusOnShowMoreAfterInteraction","FacetValue","numberOfResults","toggleExclude","toggleSingleSelect","toggleSelect","setRef","btn","showLessFocus","showMoreFocus","FacetShowMoreLess","onShowMore","showMore","showMoreValues","onShowLess","showLess","showLessValues","canShowLessValues","FacetSearchMatches","numberOfMatches","hasMoreMatches","moreValuesAvailable","showMoreMatches","showMoreResults","filter","undefined","tabs","included","excluded","facetSearchQuery","isHidden","buildFacetConditionsManager","conditions","parseDependsOn","store","facetInfo","initializePopover","hasValues","announceFacetSearchResultsWithAriaLive","msg","facetSearchAriaMessage","t","element","FocusTargetController","headerFocus","__decorate","InitializeBindings","BindStateToController","ArrayProp","MapProp","AriaLiveRegion"],"sources":["src/components/search/facets/atomic-facet/atomic-facet.pcss?tag=atomic-facet&encapsulation=shadow","src/components/search/facets/atomic-facet/atomic-facet.tsx"],"sourcesContent":["@import '../../../../global/global.pcss';\n@import '../../../common/facets/facet-search/facet-search.pcss';\n@import '../../../common/facets/facet-common.pcss';\n@import '../../../common/facets/facet-value-checkbox/facet-value-checkbox.pcss';\n@import '../../../common/facets/facet-value-exclude/facet-value-exclude.pcss';\n@import '../../../common/facets/facet-value-box/facet-value-box.pcss';\n","import {\n Facet,\n buildFacet,\n FacetState,\n FacetOptions,\n FacetSortCriterion,\n SearchStatus,\n SearchStatusState,\n buildSearchStatus,\n buildFacetConditionsManager,\n FacetResultsMustMatch,\n FacetConditionsManager,\n FacetValueRequest,\n CategoryFacetValueRequest,\n TabManagerState,\n TabManager,\n buildTabManager,\n} from '@coveo/headless';\nimport {\n Component,\n h,\n State,\n Prop,\n Element,\n VNode,\n Fragment,\n} from '@stencil/core';\nimport {getFieldCaptions} from '../../../../utils/field-utils';\nimport {\n BindStateToController,\n InitializableComponent,\n InitializeBindings,\n} from '../../../../utils/initialization-utils';\nimport {ArrayProp, MapProp} from '../../../../utils/props-utils';\nimport {\n AriaLiveRegion,\n FocusTargetController,\n} from '../../../../utils/stencil-accessibility-utils';\nimport {parseDependsOn} from '../../../common/facets/depends-on';\nimport {FacetInfo} from '../../../common/facets/facet-common-store';\nimport {FacetContainer} from '../../../common/facets/facet-container/stencil-facet-container';\nimport {FacetGuard} from '../../../common/facets/facet-guard';\nimport {FacetHeader} from '../../../common/facets/facet-header/stencil-facet-header';\nimport {FacetPlaceholder} from '../../../common/facets/facet-placeholder/facet-placeholder';\nimport {announceFacetSearchResultsWithAriaLive} from '../../../common/facets/facet-search/facet-search-aria-live';\nimport {\n shouldDisplaySearchResults,\n shouldUpdateFacetSearchComponent,\n} from '../../../common/facets/facet-search/facet-search-utils';\nimport {FacetSearchInput} from '../../../common/facets/facet-search/stencil-facet-search-input';\nimport {FacetSearchInputGuard} from '../../../common/facets/facet-search/stencil-facet-search-input-guard';\nimport {FacetSearchMatches} from '../../../common/facets/facet-search/stencil-facet-search-matches';\nimport {FacetSearchValue} from '../../../common/facets/facet-search/stencil-facet-search-value';\nimport {FacetShowMoreLess} from '../../../common/facets/facet-show-more-less/stencil-facet-show-more-less';\nimport {\n FacetValueProps,\n FacetValue,\n} from '../../../common/facets/facet-value/stencil-facet-value';\nimport {FacetValuesGroup} from '../../../common/facets/facet-values-group/stencil-facet-values-group';\nimport {initializePopover} from '../../../common/facets/popover/popover-type';\nimport {Bindings} from '../../atomic-search-interface/atomic-search-interface';\n\n/**\n * A facet is a list of values for a certain field occurring in the results, ordered using a configurable criteria (e.g., number of occurrences).\n * An `atomic-facet` displays a facet of the results for the current query.\n *\n * @part facet - The wrapper for the entire facet.\n * @part placeholder - The placeholder shown before the first search is executed.\n *\n * @part label-button - The button that displays the label and allows to expand/collapse the facet.\n * @part label-button-icon - The label button icon.\n * @part clear-button - The button that resets the actively selected facet values.\n * @part clear-button-icon - The clear button icon.\n *\n * @part search-wrapper - The search box wrapper.\n * @part search-input - The search box input.\n * @part search-icon - The search box submit button.\n * @part search-clear-button - The button to clear the search box of input.\n * @part more-matches - The label indicating there are more matches for the current facet search query.\n * @part no-matches - The label indicating there are no matches for the current facet search query.\n * @part matches-query - The highlighted query inside the matches labels.\n * @part search-highlight - The highlighted query inside the facet values.\n *\n * @part values - The facet values container.\n * @part value-label - The facet value label, common for all displays.\n * @part value-count - The facet value count, common for all displays.\n *\n * @part value-checkbox - The facet value checkbox, available when display is 'checkbox'.\n * @part value-checkbox-checked - The checked facet value checkbox, available when display is 'checkbox'.\n * @part value-checkbox-label - The facet value checkbox clickable label, available when display is 'checkbox'.\n * @part value-checkbox-icon - The facet value checkbox icon, available when display is 'checkbox'.\n * @part value-link - The facet value when display is 'link'.\n * @part value-link-selected - The selected facet value when display is 'link'.\n * @part value-box - The facet value when display is 'box'.\n * @part value-box-selected - The selected facet value when display is 'box'.\n * @part value-exclude-button - The button to exclude a facet value, available when display is 'checkbox'.\n *\n * @part show-more - The show more results button.\n * @part show-less - The show less results button.\n * @part show-more-less-icon - The icons of the show more & show less buttons.\n */\n@Component({\n tag: 'atomic-facet',\n styleUrl: 'atomic-facet.pcss',\n shadow: true,\n})\nexport class AtomicFacet implements InitializableComponent {\n @InitializeBindings() public bindings!: Bindings;\n public facet!: Facet;\n public searchStatus!: SearchStatus;\n public tabManager!: TabManager;\n @Element() private host!: HTMLElement;\n\n @BindStateToController('facet')\n @State()\n public facetState!: FacetState;\n @BindStateToController('searchStatus')\n @State()\n public searchStatusState!: SearchStatusState;\n @BindStateToController('tabManager')\n @State()\n public tabManagerState!: TabManagerState;\n @State() public error!: Error;\n\n /**\n * Specifies a unique identifier for the facet.\n */\n @Prop({mutable: true, reflect: true}) public facetId?: string;\n /**\n * The non-localized label for the facet.\n * Used in the `atomic-breadbox` component through the bindings store.\n */\n @Prop({reflect: true}) public label = 'no-label';\n /**\n * The field whose values you want to display in the facet.\n */\n @Prop({reflect: true}) public field!: string;\n /**\n * The tabs on which the facet can be displayed. This property should not be used at the same time as `tabs-excluded`.\n *\n * Set this property as a stringified JSON array, e.g.,\n * ```html\n * <atomic-facet tabs-included='[\"tabIDA\", \"tabIDB\"]'></atomic-facet>\n * ```\n * If you don't set this property, the facet can be displayed on any tab. Otherwise, the facet can only be displayed on the specified tabs.\n */\n @ArrayProp()\n @Prop({reflect: true, mutable: true})\n public tabsIncluded: string[] | string = '[]';\n\n /**\n * The tabs on which this facet must not be displayed. This property should not be used at the same time as `tabs-included`.\n *\n * Set this property as a stringified JSON array, e.g.,\n * ```html\n * <atomic-facet tabs-excluded='[\"tabIDA\", \"tabIDB\"]'></atomic-facet>\n * ```\n * If you don't set this property, the facet can be displayed on any tab. Otherwise, the facet won't be displayed on any of the specified tabs.\n */\n @ArrayProp()\n @Prop({reflect: true, mutable: true})\n public tabsExcluded: string[] | string = '[]';\n\n /**\n * The number of values to request for this facet.\n * Also determines the number of additional values to request each time more values are shown.\n */\n @Prop({reflect: true}) public numberOfValues = 8;\n\n /**\n * Whether this facet should contain a search box.\n *\n */\n @Prop({reflect: true}) public withSearch = true;\n /**\n * The sort criterion to apply to the returned facet values.\n * Possible values are 'score', 'alphanumeric', 'alphanumericDescending', 'occurrences', alphanumericNatural', 'alphanumericNaturalDescending' and 'automatic'.\n */\n @Prop({reflect: true}) public sortCriteria: FacetSortCriterion = 'automatic';\n /**\n * Specifies how a result must match the selected facet values.\n * Allowed values:\n * - `atLeastOneValue`: A result will match if at least one of the corresponding facet values is selected.\n * - `allValues`: A result will match if all corresponding facet values are selected.\n */\n @Prop({reflect: true}) public resultsMustMatch: FacetResultsMustMatch =\n 'atLeastOneValue';\n /**\n * Whether to display the facet values as checkboxes (multiple selection), links (single selection) or boxes (multiple selection).\n * Possible values are 'checkbox', 'link', and 'box'.\n */\n @Prop({reflect: true}) public displayValuesAs: 'checkbox' | 'link' | 'box' =\n 'checkbox';\n /**\n * Specifies whether the facet is collapsed. When the facet is the child of an `atomic-facet-manager` component, the facet manager controls this property.\n */\n @Prop({reflect: true, mutable: true}) public isCollapsed = false;\n /**\n * The [heading level](https://developer.mozilla.org/en-US/docs/Web/HTML/Element/Heading_Elements) to use for the heading over the facet, from 1 to 6.\n */\n @Prop({reflect: true}) public headingLevel = 0;\n /**\n * Whether to exclude the parents of folded results when estimating the result count for each facet value.\n *\n *\n * Note: Resulting count is only an estimation, in some cases this value could be incorrect.\n */\n @Prop({reflect: true}) public filterFacetCount = true;\n /**\n * Whether to allow excluding values from the facet.\n */\n @Prop({reflect: true}) public enableExclusion = false;\n /**\n * The maximum number of results to scan in the index to ensure that the facet lists all potential facet values.\n * Note: A high injectionDepth may negatively impact the facet request performance.\n * Minimum: `0`\n * Default: `1000`\n */\n @Prop() public injectionDepth = 1000;\n\n /**\n * The required facets and values for this facet to be displayed.\n * Examples:\n * ```html\n * <atomic-facet facet-id=\"abc\" field=\"objecttype\" ...></atomic-facet>\n *\n * <!-- To show the facet when any value is selected in the facet with id \"abc\": -->\n * <atomic-facet\n * depends-on-abc\n * ...\n * ></atomic-facet>\n *\n * <!-- To show the facet when value \"doc\" is selected in the facet with id \"abc\": -->\n * <atomic-facet\n * depends-on-abc=\"doc\"\n * ...\n * ></atomic-facet>\n * ```\n */\n @MapProp() @Prop() public dependsOn: Record<string, string> = {};\n /**\n * Specifies an explicit list of `allowedValues` in the Search API request, as a JSON string representation.\n *\n * If you specify a list of values for this option, the facet uses only these values (if they are available in\n * the current result set).\n *\n * Example:\n *\n * The following facet only uses the `Contact`, `Account`, and `File` values of the `objecttype` field. Even if the\n * current result set contains other `objecttype` values, such as `Message`, or `Product`, the facet does not use\n * those other values.\n *\n * ```html\n * <atomic-facet field=\"objecttype\" allowed-values='[\"Contact\",\"Account\",\"File\"]'></atomic-facet>\n * ```\n *\n * The maximum amount of allowed values is 25.\n *\n * Default value is `undefined`, and the facet uses all available values for its `field` in the current result set.\n */\n @ArrayProp()\n @Prop({mutable: true})\n public allowedValues: string[] | string = '[]';\n\n /**\n * Identifies the facet values that must appear at the top, in this order.\n * This parameter can be used in conjunction with the `sortCriteria` parameter.\n *\n * Facet values not part of the `customSort` list will be sorted according to the `sortCriteria`.\n *\n * Example:\n *\n * The following facet will sort the `Contact`, `Account`, and `File` values at the top of the list for the `objecttype` field.\n *\n * If there are more than these 3 values available, the rest of the list will be sorted using `occurrences`.\n *\n * ```html\n * <atomic-facet field=\"objecttype\" custom-sort='[\"Contact\",\"Account\",\"File\"]' sort-criteria='occurrences'></atomic-facet>\n * ```\n * The maximum amount of custom sort values is 25.\n *\n * The default value is `undefined`, and the facet values will be sorted using only the `sortCriteria`.\n */\n @ArrayProp()\n @Prop({mutable: true})\n public customSort: string[] | string = '[]';\n\n private showLessFocus?: FocusTargetController;\n private showMoreFocus?: FocusTargetController;\n private headerFocus?: FocusTargetController;\n private facetConditionsManager?: FacetConditionsManager;\n\n @AriaLiveRegion('facet-search')\n protected facetSearchAriaMessage!: string;\n\n public initialize() {\n if (\n [...this.tabsIncluded].length > 0 &&\n [...this.tabsExcluded].length > 0\n ) {\n console.warn(\n 'Values for both \"tabs-included\" and \"tabs-excluded\" have been provided. This is could lead to unexpected behaviors.'\n );\n }\n\n if (this.displayValuesAs !== 'checkbox' && this.enableExclusion) {\n console.warn(\n 'The \"enableExclusion\" property is only available when \"displayValuesAs\" is set to \"checkbox\".'\n );\n }\n\n this.facet = buildFacet(this.bindings.engine, {options: this.facetOptions});\n this.facetId = this.facet.state.facetId;\n this.searchStatus = buildSearchStatus(this.bindings.engine);\n this.tabManager = buildTabManager(this.bindings.engine);\n this.initAriaLive();\n this.initConditionManager();\n this.initPopover();\n this.registerFacet();\n }\n\n public disconnectedCallback() {\n if (this.host.isConnected) {\n return;\n }\n this.facetConditionsManager?.stopWatching();\n }\n\n public componentShouldUpdate(\n next: FacetState,\n prev: FacetState,\n propName: keyof AtomicFacet\n ) {\n if (\n this.isFacetState(prev, propName) &&\n this.isFacetState(next, propName)\n ) {\n return shouldUpdateFacetSearchComponent(\n next.facetSearch,\n prev.facetSearch\n );\n }\n return true;\n }\n\n public render() {\n return (\n <FacetGuard\n enabled={this.facetState.enabled}\n hasError={this.searchStatusState.hasError}\n firstSearchExecuted={this.searchStatusState.firstSearchExecuted}\n hasResults={this.facetState.values.length > 0}\n >\n {this.searchStatusState.firstSearchExecuted ? (\n <FacetContainer>\n <FacetHeader\n i18n={this.bindings.i18n}\n label={this.definedLabel}\n onClearFilters={() => {\n this.focusTargets.header.focusAfterSearch();\n this.facet.deselectAll();\n }}\n numberOfActiveValues={this.activeValues.length}\n isCollapsed={this.isCollapsed}\n headingLevel={this.headingLevel}\n onToggleCollapse={() => (this.isCollapsed = !this.isCollapsed)}\n headerRef={(el) => this.focusTargets.header.setTarget(el)}\n ></FacetHeader>\n {this.renderBody()}\n </FacetContainer>\n ) : (\n <FacetPlaceholder\n numberOfValues={this.numberOfValues}\n isCollapsed={this.isCollapsed}\n />\n )}\n </FacetGuard>\n );\n }\n\n private renderBody() {\n if (this.isCollapsed) {\n return;\n }\n return (\n <Fragment>\n <FacetSearchInputGuard\n canShowMoreValues={this.facetState.canShowMoreValues}\n numberOfDisplayedValues={this.facetState.values.length}\n withSearch={this.withSearch}\n >\n <FacetSearchInput\n i18n={this.bindings.i18n}\n label={this.definedLabel}\n onChange={(value) => {\n if (value === '') {\n this.facet.facetSearch.clear();\n return;\n }\n this.facet.facetSearch.updateCaptions(\n getFieldCaptions(this.field, this.bindings.i18n)\n );\n this.facet.facetSearch.updateText(value);\n this.facet.facetSearch.search();\n }}\n onClear={() => this.facet.facetSearch.clear()}\n query={this.facetState.facetSearch.query}\n />\n </FacetSearchInputGuard>\n {shouldDisplaySearchResults(this.facetState.facetSearch)\n ? [this.renderSearchResults(), this.renderMatches()]\n : [this.renderValues(), this.renderShowMoreLess()]}\n </Fragment>\n );\n }\n\n private renderValuesContainer(children: VNode[], query?: string) {\n const classes = `mt-3 ${\n this.displayValuesAs === 'box' ? 'box-container' : ''\n }`;\n return (\n <FacetValuesGroup\n i18n={this.bindings.i18n}\n label={this.label}\n query={query}\n >\n <ul class={classes} part=\"values\">\n {children}\n </ul>\n </FacetValuesGroup>\n );\n }\n\n private renderSearchResults() {\n return this.renderValuesContainer(\n this.facet.state.facetSearch.values.map((value) => (\n <FacetSearchValue\n {...this.facetValueProps}\n facetCount={value.count}\n onExclude={() => this.facet.facetSearch.exclude(value)}\n onSelect={() =>\n this.displayValuesAs === 'link'\n ? this.facet.facetSearch.singleSelect(value)\n : this.facet.facetSearch.select(value)\n }\n facetValue={value.rawValue}\n />\n ))\n );\n }\n\n private renderValues() {\n return this.renderValuesContainer(\n this.facet.state.values.map((value, i) => {\n const shouldFocusOnShowLessAfterInteraction = i === 0;\n const shouldFocusOnShowMoreAfterInteraction =\n i ===\n (this.sortCriteria === 'automatic'\n ? 0\n : this.facet.state.values.length - this.numberOfValues);\n\n return (\n <FacetValue\n {...this.facetValueProps}\n facetCount={value.numberOfResults}\n onExclude={() => this.facet.toggleExclude(value)}\n onSelect={() =>\n this.displayValuesAs === 'link'\n ? this.facet.toggleSingleSelect(value)\n : this.facet.toggleSelect(value)\n }\n facetValue={value.value}\n facetState={value.state}\n setRef={(btn) => {\n if (shouldFocusOnShowLessAfterInteraction) {\n this.showLessFocus?.setTarget(btn);\n }\n if (shouldFocusOnShowMoreAfterInteraction) {\n this.showMoreFocus?.setTarget(btn);\n }\n }}\n />\n );\n })\n );\n }\n\n private renderShowMoreLess() {\n return (\n <FacetShowMoreLess\n label={this.label}\n i18n={this.bindings.i18n}\n onShowMore={() => {\n this.focusTargets.showMore.focusAfterSearch();\n this.facet.showMoreValues();\n }}\n onShowLess={() => {\n this.focusTargets.showLess.focusAfterSearch();\n this.facet.showLessValues();\n }}\n canShowMoreValues={this.facet.state.canShowMoreValues}\n canShowLessValues={this.facet.state.canShowLessValues}\n ></FacetShowMoreLess>\n );\n }\n\n private renderMatches() {\n return (\n <FacetSearchMatches\n i18n={this.bindings.i18n}\n query={this.facet.state.facetSearch.query}\n numberOfMatches={this.facet.state.facetSearch.values.length}\n hasMoreMatches={this.facet.state.facetSearch.moreValuesAvailable}\n showMoreMatches={() => this.facet.facetSearch.showMoreResults()}\n ></FacetSearchMatches>\n );\n }\n\n private get activeValues() {\n return this.facet.state.values.filter(({state}) => state !== 'idle');\n }\n\n private get facetOptions(): FacetOptions {\n return {\n facetId: this.facetId,\n field: this.field,\n numberOfValues: this.numberOfValues,\n sortCriteria: this.sortCriteria,\n resultsMustMatch: this.resultsMustMatch,\n facetSearch: {numberOfValues: this.numberOfValues},\n filterFacetCount: this.filterFacetCount,\n injectionDepth: this.injectionDepth,\n allowedValues: this.allowedValues.length\n ? [...this.allowedValues]\n : undefined,\n customSort: this.customSort.length ? [...this.customSort] : undefined,\n tabs: {\n included: [...this.tabsIncluded],\n excluded: [...this.tabsExcluded],\n },\n };\n }\n\n private get facetValueProps(): Pick<\n FacetValueProps,\n | 'displayValuesAs'\n | 'facetSearchQuery'\n | 'enableExclusion'\n | 'field'\n | 'i18n'\n > {\n return {\n facetSearchQuery: this.facetState.facetSearch.query,\n displayValuesAs: this.displayValuesAs,\n enableExclusion: this.enableExclusion,\n field: this.field,\n i18n: this.bindings.i18n,\n };\n }\n\n private get isHidden() {\n return !this.facet.state.enabled || !this.facet.state.values.length;\n }\n\n private initConditionManager() {\n this.facetConditionsManager = buildFacetConditionsManager(\n this.bindings.engine,\n {\n facetId: this.facetId!,\n conditions: parseDependsOn<\n FacetValueRequest | CategoryFacetValueRequest\n >(this.dependsOn),\n }\n );\n }\n\n private registerFacet() {\n this.bindings.store.registerFacet('facets', this.facetInfo);\n }\n\n private initPopover() {\n initializePopover(this.host, {\n ...this.facetInfo,\n hasValues: () => !!this.facet.state.values.length,\n numberOfActiveValues: () => this.activeValues.length,\n });\n }\n\n private initAriaLive() {\n announceFacetSearchResultsWithAriaLive(\n this.facet,\n this.label,\n (msg) => (this.facetSearchAriaMessage = msg),\n this.bindings.i18n\n );\n }\n\n private get facetInfo(): FacetInfo {\n return {\n label: () => this.bindings.i18n.t(this.label),\n facetId: this.facetId!,\n element: this.host,\n isHidden: () => this.isHidden,\n };\n }\n\n private get definedLabel() {\n return this.label === 'no-label' && this.facetState?.label\n ? this.facetState.label\n : this.label;\n }\n\n private get focusTargets(): {\n showLess: FocusTargetController;\n showMore: FocusTargetController;\n header: FocusTargetController;\n } {\n if (!this.showLessFocus) {\n this.showLessFocus = new FocusTargetController(this);\n }\n if (!this.showMoreFocus) {\n this.showMoreFocus = new FocusTargetController(this);\n }\n if (!this.headerFocus) {\n this.headerFocus = new FocusTargetController(this);\n }\n\n return {\n showLess: this.showLessFocus,\n showMore: this.showMoreFocus,\n header: this.headerFocus,\n };\n }\n\n private isFacetState(state: unknown, propName: string): state is FacetState {\n return (\n propName === 'facetState' &&\n typeof (state as FacetState)?.facetId === 'string'\n );\n }\n}\n"],"mappings":"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","ignoreList":[]}
1
+ {"version":3,"names":["atomicFacetCss","AtomicFacetStyle0","AtomicFacet","this","label","tabsIncluded","tabsExcluded","numberOfValues","withSearch","sortCriteria","resultsMustMatch","displayValuesAs","isCollapsed","headingLevel","filterFacetCount","enableExclusion","injectionDepth","dependsOn","allowedValues","customSort","initialize","length","console","warn","facet","buildFacet","bindings","engine","options","facetOptions","facetId","state","searchStatus","buildSearchStatus","tabManager","buildTabManager","initAriaLive","initConditionManager","initPopover","registerFacet","disconnectedCallback","host","isConnected","facetConditionsManager","stopWatching","componentShouldUpdate","next","prev","propName","isFacetState","shouldUpdateFacetSearchComponent","facetSearch","render","h","FacetGuard","key","enabled","facetState","hasError","searchStatusState","firstSearchExecuted","hasResults","values","FacetContainer","FacetHeader","i18n","definedLabel","onClearFilters","focusTargets","header","focusAfterSearch","deselectAll","numberOfActiveValues","activeValues","onToggleCollapse","headerRef","el","setTarget","renderBody","FacetPlaceholder","Fragment","FacetSearchInputGuard","canShowMoreValues","numberOfDisplayedValues","FacetSearchInput","onChange","value","clear","updateCaptions","getFieldCaptions","field","updateText","search","onClear","query","shouldDisplaySearchResults","renderSearchResults","renderMatches","renderValues","renderShowMoreLess","renderValuesContainer","children","classes","FacetValuesGroup","class","part","map","FacetSearchValue","facetValueProps","facetCount","count","onExclude","exclude","onSelect","singleSelect","select","facetValue","rawValue","i","shouldFocusOnShowLessAfterInteraction","shouldFocusOnShowMoreAfterInteraction","FacetValue","numberOfResults","toggleExclude","toggleSingleSelect","toggleSelect","setRef","btn","showLessFocus","showMoreFocus","FacetShowMoreLess","onShowMore","showMore","showMoreValues","onShowLess","showLess","showLessValues","canShowLessValues","FacetSearchMatches","numberOfMatches","hasMoreMatches","moreValuesAvailable","showMoreMatches","showMoreResults","filter","undefined","tabs","included","excluded","facetSearchQuery","isHidden","buildFacetConditionsManager","conditions","parseDependsOn","store","facetInfo","initializePopover","hasValues","announceFacetSearchResultsWithAriaLive","msg","facetSearchAriaMessage","t","element","FocusTargetController","headerFocus","__decorate","InitializeBindings","BindStateToController","ArrayProp","MapProp","AriaLiveRegion"],"sources":["src/components/search/facets/atomic-facet/atomic-facet.pcss?tag=atomic-facet&encapsulation=shadow","src/components/search/facets/atomic-facet/atomic-facet.tsx"],"sourcesContent":["@import '../../../../global/global.pcss';\n@import '../../../common/facets/facet-search/facet-search.pcss';\n@import '../../../common/facets/facet-common.pcss';\n@import '../../../common/facets/facet-value-checkbox/facet-value-checkbox.pcss';\n@import '../../../common/facets/facet-value-exclude/facet-value-exclude.pcss';\n@import '../../../common/facets/facet-value-box/facet-value-box.pcss';\n","import {\n Facet,\n buildFacet,\n FacetState,\n FacetOptions,\n FacetSortCriterion,\n SearchStatus,\n SearchStatusState,\n buildSearchStatus,\n buildFacetConditionsManager,\n FacetResultsMustMatch,\n FacetConditionsManager,\n FacetValueRequest,\n CategoryFacetValueRequest,\n TabManagerState,\n TabManager,\n buildTabManager,\n} from '@coveo/headless';\nimport {\n Component,\n h,\n State,\n Prop,\n Element,\n VNode,\n Fragment,\n} from '@stencil/core';\nimport {getFieldCaptions} from '../../../../utils/field-utils';\nimport {\n BindStateToController,\n InitializableComponent,\n InitializeBindings,\n} from '../../../../utils/initialization-utils';\nimport {ArrayProp, MapProp} from '../../../../utils/props-utils';\nimport {\n AriaLiveRegion,\n FocusTargetController,\n} from '../../../../utils/stencil-accessibility-utils';\nimport {parseDependsOn} from '../../../common/facets/depends-on';\nimport {FacetInfo} from '../../../common/facets/facet-common-store';\nimport {FacetContainer} from '../../../common/facets/facet-container/stencil-facet-container';\nimport {FacetGuard} from '../../../common/facets/facet-guard';\nimport {FacetHeader} from '../../../common/facets/facet-header/stencil-facet-header';\nimport {FacetPlaceholder} from '../../../common/facets/facet-placeholder/facet-placeholder';\nimport {announceFacetSearchResultsWithAriaLive} from '../../../common/facets/facet-search/facet-search-aria-live';\nimport {\n shouldDisplaySearchResults,\n shouldUpdateFacetSearchComponent,\n} from '../../../common/facets/facet-search/facet-search-utils';\nimport {FacetSearchInput} from '../../../common/facets/facet-search/stencil-facet-search-input';\nimport {FacetSearchInputGuard} from '../../../common/facets/facet-search/stencil-facet-search-input-guard';\nimport {FacetSearchMatches} from '../../../common/facets/facet-search/stencil-facet-search-matches';\nimport {FacetSearchValue} from '../../../common/facets/facet-search/stencil-facet-search-value';\nimport {FacetShowMoreLess} from '../../../common/facets/facet-show-more-less/stencil-facet-show-more-less';\nimport {\n FacetValueProps,\n FacetValue,\n} from '../../../common/facets/facet-value/stencil-facet-value';\nimport {FacetValuesGroup} from '../../../common/facets/facet-values-group/stencil-facet-values-group';\nimport {initializePopover} from '../../../common/facets/popover/popover-type';\nimport {Bindings} from '../../atomic-search-interface/atomic-search-interface';\n\n/**\n * A facet is a list of values for a certain field occurring in the results, ordered using a configurable criteria (e.g., number of occurrences).\n * An `atomic-facet` displays a facet of the results for the current query.\n *\n * @part facet - The wrapper for the entire facet.\n * @part placeholder - The placeholder shown before the first search is executed.\n *\n * @part label-button - The button that displays the label and allows to expand/collapse the facet.\n * @part label-button-icon - The label button icon.\n * @part clear-button - The button that resets the actively selected facet values.\n * @part clear-button-icon - The clear button icon.\n *\n * @part search-wrapper - The search box wrapper.\n * @part search-input - The search box input.\n * @part search-icon - The search box submit button.\n * @part search-clear-button - The button to clear the search box of input.\n * @part more-matches - The label indicating there are more matches for the current facet search query.\n * @part no-matches - The label indicating there are no matches for the current facet search query.\n * @part matches-query - The highlighted query inside the matches labels.\n * @part search-highlight - The highlighted query inside the facet values.\n *\n * @part values - The facet values container.\n * @part value-label - The facet value label, common for all displays.\n * @part value-count - The facet value count, common for all displays.\n *\n * @part value-checkbox - The facet value checkbox, available when display is 'checkbox'.\n * @part value-checkbox-checked - The checked facet value checkbox, available when display is 'checkbox'.\n * @part value-checkbox-label - The facet value checkbox clickable label, available when display is 'checkbox'.\n * @part value-checkbox-icon - The facet value checkbox icon, available when display is 'checkbox'.\n * @part value-link - The facet value when display is 'link'.\n * @part value-link-selected - The selected facet value when display is 'link'.\n * @part value-box - The facet value when display is 'box'.\n * @part value-box-selected - The selected facet value when display is 'box'.\n * @part value-exclude-button - The button to exclude a facet value, available when display is 'checkbox'.\n *\n * @part show-more - The show more results button.\n * @part show-less - The show less results button.\n * @part show-more-less-icon - The icons of the show more & show less buttons.\n */\n@Component({\n tag: 'atomic-facet',\n styleUrl: 'atomic-facet.pcss',\n shadow: true,\n})\nexport class AtomicFacet implements InitializableComponent {\n @InitializeBindings() public bindings!: Bindings;\n public facet!: Facet;\n public searchStatus!: SearchStatus;\n public tabManager!: TabManager;\n @Element() private host!: HTMLElement;\n\n @BindStateToController('facet')\n @State()\n public facetState!: FacetState;\n @BindStateToController('searchStatus')\n @State()\n public searchStatusState!: SearchStatusState;\n @BindStateToController('tabManager')\n @State()\n public tabManagerState!: TabManagerState;\n @State() public error!: Error;\n\n /**\n * Specifies a unique identifier for the facet.\n */\n @Prop({mutable: true, reflect: true}) public facetId?: string;\n /**\n * The non-localized label for the facet.\n * Used in the `atomic-breadbox` component through the bindings store.\n */\n @Prop({reflect: true}) public label = 'no-label';\n /**\n * The field whose values you want to display in the facet.\n */\n @Prop({reflect: true}) public field!: string;\n /**\n * The tabs on which the facet can be displayed. This property should not be used at the same time as `tabs-excluded`.\n *\n * Set this property as a stringified JSON array, e.g.,\n * ```html\n * <atomic-facet tabs-included='[\"tabIDA\", \"tabIDB\"]'></atomic-facet>\n * ```\n * If you don't set this property, the facet can be displayed on any tab. Otherwise, the facet can only be displayed on the specified tabs.\n */\n @ArrayProp()\n @Prop({reflect: true, mutable: true})\n public tabsIncluded: string[] | string = '[]';\n\n /**\n * The tabs on which this facet must not be displayed. This property should not be used at the same time as `tabs-included`.\n *\n * Set this property as a stringified JSON array, e.g.,\n * ```html\n * <atomic-facet tabs-excluded='[\"tabIDA\", \"tabIDB\"]'></atomic-facet>\n * ```\n * If you don't set this property, the facet can be displayed on any tab. Otherwise, the facet won't be displayed on any of the specified tabs.\n */\n @ArrayProp()\n @Prop({reflect: true, mutable: true})\n public tabsExcluded: string[] | string = '[]';\n\n /**\n * The number of values to request for this facet.\n * Also determines the number of additional values to request each time more values are shown.\n */\n @Prop({reflect: true}) public numberOfValues = 8;\n\n /**\n * Whether this facet should contain a search box.\n *\n */\n @Prop({reflect: true}) public withSearch = true;\n /**\n * The sort criterion to apply to the returned facet values.\n * Possible values are 'score', 'alphanumeric', 'alphanumericDescending', 'occurrences', alphanumericNatural', 'alphanumericNaturalDescending' and 'automatic'.\n */\n @Prop({reflect: true}) public sortCriteria: FacetSortCriterion = 'automatic';\n /**\n * Specifies how a result must match the selected facet values.\n * Allowed values:\n * - `atLeastOneValue`: A result will match if at least one of the corresponding facet values is selected.\n * - `allValues`: A result will match if all corresponding facet values are selected.\n */\n @Prop({reflect: true}) public resultsMustMatch: FacetResultsMustMatch =\n 'atLeastOneValue';\n /**\n * Whether to display the facet values as checkboxes (multiple selection), links (single selection) or boxes (multiple selection).\n * Possible values are 'checkbox', 'link', and 'box'.\n */\n @Prop({reflect: true}) public displayValuesAs: 'checkbox' | 'link' | 'box' =\n 'checkbox';\n /**\n * Specifies whether the facet is collapsed. When the facet is the child of an `atomic-facet-manager` component, the facet manager controls this property.\n */\n @Prop({reflect: true, mutable: true}) public isCollapsed = false;\n /**\n * The [heading level](https://developer.mozilla.org/en-US/docs/Web/HTML/Element/Heading_Elements) to use for the heading over the facet, from 1 to 6.\n */\n @Prop({reflect: true}) public headingLevel = 0;\n /**\n * Whether to exclude the parents of folded results when estimating the result count for each facet value.\n *\n *\n * Note: Resulting count is only an estimation, in some cases this value could be incorrect.\n */\n @Prop({reflect: true}) public filterFacetCount = true;\n /**\n * Whether to allow excluding values from the facet.\n */\n @Prop({reflect: true}) public enableExclusion = false;\n /**\n * The maximum number of results to scan in the index to ensure that the facet lists all potential facet values.\n * Note: A high injectionDepth may negatively impact the facet request performance.\n * Minimum: `0`\n * Default: `1000`\n */\n @Prop() public injectionDepth = 1000;\n\n /**\n * The required facets and values for this facet to be displayed.\n * Examples:\n * ```html\n * <atomic-facet facet-id=\"abc\" field=\"objecttype\" ...></atomic-facet>\n *\n * <!-- To show the facet when any value is selected in the facet with id \"abc\": -->\n * <atomic-facet\n * depends-on-abc\n * ...\n * ></atomic-facet>\n *\n * <!-- To show the facet when value \"doc\" is selected in the facet with id \"abc\": -->\n * <atomic-facet\n * depends-on-abc=\"doc\"\n * ...\n * ></atomic-facet>\n * ```\n */\n @MapProp() @Prop() public dependsOn: Record<string, string> = {};\n /**\n * Specifies an explicit list of `allowedValues` in the Search API request, as a JSON string representation.\n *\n * If you specify a list of values for this option, the facet uses only these values (if they are available in\n * the current result set).\n *\n * Example:\n *\n * The following facet only uses the `Contact`, `Account`, and `File` values of the `objecttype` field. Even if the\n * current result set contains other `objecttype` values, such as `Message`, or `Product`, the facet does not use\n * those other values.\n *\n * ```html\n * <atomic-facet field=\"objecttype\" allowed-values='[\"Contact\",\"Account\",\"File\"]'></atomic-facet>\n * ```\n *\n * The maximum amount of allowed values is 25.\n *\n * Default value is `undefined`, and the facet uses all available values for its `field` in the current result set.\n */\n @ArrayProp()\n @Prop({mutable: true})\n public allowedValues: string[] | string = '[]';\n\n /**\n * Identifies the facet values that must appear at the top, in this order.\n * This parameter can be used in conjunction with the `sortCriteria` parameter.\n *\n * Facet values not part of the `customSort` list will be sorted according to the `sortCriteria`.\n *\n * Example:\n *\n * The following facet will sort the `Contact`, `Account`, and `File` values at the top of the list for the `objecttype` field.\n *\n * If there are more than these 3 values available, the rest of the list will be sorted using `occurrences`.\n *\n * ```html\n * <atomic-facet field=\"objecttype\" custom-sort='[\"Contact\",\"Account\",\"File\"]' sort-criteria='occurrences'></atomic-facet>\n * ```\n * The maximum amount of custom sort values is 25.\n *\n * The default value is `undefined`, and the facet values will be sorted using only the `sortCriteria`.\n */\n @ArrayProp()\n @Prop({mutable: true})\n public customSort: string[] | string = '[]';\n\n private showLessFocus?: FocusTargetController;\n private showMoreFocus?: FocusTargetController;\n private headerFocus?: FocusTargetController;\n private facetConditionsManager?: FacetConditionsManager;\n\n @AriaLiveRegion('facet-search')\n protected facetSearchAriaMessage!: string;\n\n public initialize() {\n if (\n [...this.tabsIncluded].length > 0 &&\n [...this.tabsExcluded].length > 0\n ) {\n console.warn(\n 'Values for both \"tabs-included\" and \"tabs-excluded\" have been provided. This is could lead to unexpected behaviors.'\n );\n }\n\n if (this.displayValuesAs !== 'checkbox' && this.enableExclusion) {\n console.warn(\n 'The \"enableExclusion\" property is only available when \"displayValuesAs\" is set to \"checkbox\".'\n );\n }\n\n this.facet = buildFacet(this.bindings.engine, {options: this.facetOptions});\n this.facetId = this.facet.state.facetId;\n this.searchStatus = buildSearchStatus(this.bindings.engine);\n this.tabManager = buildTabManager(this.bindings.engine);\n this.initAriaLive();\n this.initConditionManager();\n this.initPopover();\n this.registerFacet();\n }\n\n public disconnectedCallback() {\n if (this.host.isConnected) {\n return;\n }\n this.facetConditionsManager?.stopWatching();\n }\n\n public componentShouldUpdate(\n next: FacetState,\n prev: FacetState,\n propName: keyof AtomicFacet\n ) {\n if (\n this.isFacetState(prev, propName) &&\n this.isFacetState(next, propName)\n ) {\n return shouldUpdateFacetSearchComponent(\n next.facetSearch,\n prev.facetSearch\n );\n }\n return true;\n }\n\n public render() {\n return (\n <FacetGuard\n enabled={this.facetState.enabled}\n hasError={this.searchStatusState.hasError}\n firstSearchExecuted={this.searchStatusState.firstSearchExecuted}\n hasResults={this.facetState.values.length > 0}\n >\n {this.searchStatusState.firstSearchExecuted ? (\n <FacetContainer>\n <FacetHeader\n i18n={this.bindings.i18n}\n label={this.definedLabel}\n onClearFilters={() => {\n this.focusTargets.header.focusAfterSearch();\n this.facet.deselectAll();\n }}\n numberOfActiveValues={this.activeValues.length}\n isCollapsed={this.isCollapsed}\n headingLevel={this.headingLevel}\n onToggleCollapse={() => (this.isCollapsed = !this.isCollapsed)}\n headerRef={(el) => this.focusTargets.header.setTarget(el)}\n ></FacetHeader>\n {this.renderBody()}\n </FacetContainer>\n ) : (\n <FacetPlaceholder\n numberOfValues={this.numberOfValues}\n isCollapsed={this.isCollapsed}\n />\n )}\n </FacetGuard>\n );\n }\n\n private renderBody() {\n if (this.isCollapsed) {\n return;\n }\n return (\n <Fragment>\n <FacetSearchInputGuard\n canShowMoreValues={this.facetState.canShowMoreValues}\n numberOfDisplayedValues={this.facetState.values.length}\n withSearch={this.withSearch}\n >\n <FacetSearchInput\n i18n={this.bindings.i18n}\n label={this.definedLabel}\n onChange={(value) => {\n if (value === '') {\n this.facet.facetSearch.clear();\n return;\n }\n this.facet.facetSearch.updateCaptions(\n getFieldCaptions(this.field, this.bindings.i18n)\n );\n this.facet.facetSearch.updateText(value);\n this.facet.facetSearch.search();\n }}\n onClear={() => this.facet.facetSearch.clear()}\n query={this.facetState.facetSearch.query}\n />\n </FacetSearchInputGuard>\n {shouldDisplaySearchResults(this.facetState.facetSearch)\n ? [this.renderSearchResults(), this.renderMatches()]\n : [this.renderValues(), this.renderShowMoreLess()]}\n </Fragment>\n );\n }\n\n private renderValuesContainer(children: VNode[], query?: string) {\n const classes = `mt-3 ${\n this.displayValuesAs === 'box' ? 'box-container' : ''\n }`;\n return (\n <FacetValuesGroup\n i18n={this.bindings.i18n}\n label={this.label}\n query={query}\n >\n <ul class={classes} part=\"values\">\n {children}\n </ul>\n </FacetValuesGroup>\n );\n }\n\n private renderSearchResults() {\n return this.renderValuesContainer(\n this.facet.state.facetSearch.values.map((value) => (\n <FacetSearchValue\n {...this.facetValueProps}\n facetCount={value.count}\n onExclude={() => this.facet.facetSearch.exclude(value)}\n onSelect={() =>\n this.displayValuesAs === 'link'\n ? this.facet.facetSearch.singleSelect(value)\n : this.facet.facetSearch.select(value)\n }\n facetValue={value.rawValue}\n />\n ))\n );\n }\n\n private renderValues() {\n return this.renderValuesContainer(\n this.facet.state.values.map((value, i) => {\n const shouldFocusOnShowLessAfterInteraction = i === 0;\n const shouldFocusOnShowMoreAfterInteraction =\n i ===\n (this.sortCriteria === 'automatic'\n ? 0\n : this.facet.state.values.length - this.numberOfValues);\n\n return (\n <FacetValue\n {...this.facetValueProps}\n facetCount={value.numberOfResults}\n onExclude={() => this.facet.toggleExclude(value)}\n onSelect={() =>\n this.displayValuesAs === 'link'\n ? this.facet.toggleSingleSelect(value)\n : this.facet.toggleSelect(value)\n }\n facetValue={value.value}\n facetState={value.state}\n setRef={(btn) => {\n if (shouldFocusOnShowLessAfterInteraction) {\n this.showLessFocus?.setTarget(btn);\n }\n if (shouldFocusOnShowMoreAfterInteraction) {\n this.showMoreFocus?.setTarget(btn);\n }\n }}\n />\n );\n })\n );\n }\n\n private renderShowMoreLess() {\n return (\n <FacetShowMoreLess\n label={this.label}\n i18n={this.bindings.i18n}\n onShowMore={() => {\n this.focusTargets.showMore.focusAfterSearch();\n this.facet.showMoreValues();\n }}\n onShowLess={() => {\n this.focusTargets.showLess.focusAfterSearch();\n this.facet.showLessValues();\n }}\n canShowMoreValues={this.facet.state.canShowMoreValues}\n canShowLessValues={this.facet.state.canShowLessValues}\n ></FacetShowMoreLess>\n );\n }\n\n private renderMatches() {\n return (\n <FacetSearchMatches\n i18n={this.bindings.i18n}\n query={this.facet.state.facetSearch.query}\n numberOfMatches={this.facet.state.facetSearch.values.length}\n hasMoreMatches={this.facet.state.facetSearch.moreValuesAvailable}\n showMoreMatches={() => this.facet.facetSearch.showMoreResults()}\n ></FacetSearchMatches>\n );\n }\n\n private get activeValues() {\n return this.facet.state.values.filter(({state}) => state !== 'idle');\n }\n\n private get facetOptions(): FacetOptions {\n return {\n facetId: this.facetId,\n field: this.field,\n numberOfValues: this.numberOfValues,\n sortCriteria: this.sortCriteria,\n resultsMustMatch: this.resultsMustMatch,\n facetSearch: {numberOfValues: this.numberOfValues},\n filterFacetCount: this.filterFacetCount,\n injectionDepth: this.injectionDepth,\n allowedValues: this.allowedValues.length\n ? [...this.allowedValues]\n : undefined,\n customSort: this.customSort.length ? [...this.customSort] : undefined,\n tabs: {\n included: [...this.tabsIncluded],\n excluded: [...this.tabsExcluded],\n },\n };\n }\n\n private get facetValueProps(): Pick<\n FacetValueProps,\n | 'displayValuesAs'\n | 'facetSearchQuery'\n | 'enableExclusion'\n | 'field'\n | 'i18n'\n > {\n return {\n facetSearchQuery: this.facetState.facetSearch.query,\n displayValuesAs: this.displayValuesAs,\n enableExclusion: this.enableExclusion,\n field: this.field,\n i18n: this.bindings.i18n,\n };\n }\n\n private get isHidden() {\n return !this.facet.state.enabled || !this.facet.state.values.length;\n }\n\n private initConditionManager() {\n this.facetConditionsManager = buildFacetConditionsManager(\n this.bindings.engine,\n {\n facetId: this.facetId!,\n conditions: parseDependsOn<\n FacetValueRequest | CategoryFacetValueRequest\n >(this.dependsOn),\n }\n );\n }\n\n private registerFacet() {\n this.bindings.store.registerFacet('facets', this.facetInfo);\n }\n\n private initPopover() {\n initializePopover(this.host, {\n ...this.facetInfo,\n hasValues: () => !!this.facet.state.values.length,\n numberOfActiveValues: () => this.activeValues.length,\n });\n }\n\n private initAriaLive() {\n announceFacetSearchResultsWithAriaLive(\n this.facet,\n this.label,\n (msg) => (this.facetSearchAriaMessage = msg),\n this.bindings.i18n\n );\n }\n\n private get facetInfo(): FacetInfo {\n return {\n label: () => this.bindings.i18n.t(this.label),\n facetId: this.facetId!,\n element: this.host,\n isHidden: () => this.isHidden,\n };\n }\n\n private get definedLabel() {\n return this.label === 'no-label' && this.facetState?.label\n ? this.facetState.label\n : this.label;\n }\n\n private get focusTargets(): {\n showLess: FocusTargetController;\n showMore: FocusTargetController;\n header: FocusTargetController;\n } {\n if (!this.showLessFocus) {\n this.showLessFocus = new FocusTargetController(this);\n }\n if (!this.showMoreFocus) {\n this.showMoreFocus = new FocusTargetController(this);\n }\n if (!this.headerFocus) {\n this.headerFocus = new FocusTargetController(this);\n }\n\n return {\n showLess: this.showLessFocus,\n showMore: this.showMoreFocus,\n header: this.headerFocus,\n };\n }\n\n private isFacetState(state: unknown, propName: string): state is FacetState {\n return (\n propName === 'facetState' &&\n typeof (state as FacetState)?.facetId === 'string'\n );\n }\n}\n"],"mappings":"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","ignoreList":[]}