@claudebernard/therapeutic-alternative-element 2.1.2 → 2.3.0

package/dist/therapeutic-alternative.d.ts

@@ -5,9 +5,10 @@ import { TemplateResult } from 'lit-html';
 
 /**
  * Composant pour afficher les alternatives thérapeutiques d'un médicament donné.
- * Permet à l'utilisateur d'affiner sa recherche via des critères d'inclusion, d'exclusion et des
- * filtres rapides, et affiche les résultats correspondants — toute la recherche/agrégation reste
- * côté serveur, ce composant ne fait qu'envoyer les critères et afficher ce qui revient.
+ * Permet à l'utilisateur d'affiner sa recherche via un pool de base (scope), des critères
+ * complémentaires (include), des critères d'exclusion et des filtres rapides, et affiche les
+ * résultats correspondants — toute la recherche/agrégation reste côté serveur, ce composant ne
+ * fait qu'envoyer les critères et afficher ce qui revient.
  * @element bcb-therapeutic-alternative
  */
 export declare class TherapeuticAlternative extends LitElement {
@@ -21,17 +22,22 @@ export declare class TherapeuticAlternative extends LitElement {
     private totalElements;
     private lastRequestHadNoSelectedCriteria;
     private currentPage;
+    private scope;
     private include;
     private exclude;
     private quickFilters;
+    private quickFilterFacets;
+    private scopeFacets;
     private includeFacets;
     private excludeFacets;
     private truncatedGroups;
     private expandFacetGroupKey;
+    private scopeLabels;
     private includeLabels;
     private excludeLabels;
-    private openInclusionGroup;
+    private openScopeGroup;
     private openExclusionGroup;
+    private openIncludeGroup;
     private checklistSearchTerm;
     private sectionCollapsed;
     private apiSearchError;
@@ -40,28 +46,36 @@ export declare class TherapeuticAlternative extends LitElement {
     private apiReplaceError;
     private apiReplaceLoading;
     private missingPrescriptionError;
-    private hasAppliedInitialInclude;
+    private hasAppliedInitialScope;
     private refetchTimer;
     private requestSeq;
     private get currentMedication();
     private get currentMedicationRequest();
     private get sourceProductId();
     updated(changedProperties: Map<string | number | symbol, unknown>): void;
+    private resetAllCriteria;
     disconnectedCallback(): void;
     private clearScheduledRefetch;
     private scheduleRefetch;
     private hasNoSelectedCriteria;
     private fetchAlternatives;
     private applyResponse;
+    private static buildScopeFacets;
     private static buildIncludeFacets;
     private static buildExcludeFacets;
-    private static deriveInitialInclude;
-    private toggleInclude;
+    private static codesOf;
+    private static deriveInitialScope;
+    private includePossessedIds;
+    private excludePossessedIds;
+    private toggleScope;
     private toggleExclude;
+    private toggleInclude;
     private toggleQuickFilter;
     private exclusionTruncatedGroupKey;
-    private toggleInclusionPanel;
+    private includeTruncatedGroupKey;
+    private toggleScopePanel;
     private toggleExclusionPanel;
+    private toggleIncludePanel;
     private requestMoreFacetValues;
     private toggleSection;
     private cancelAlternative;
@@ -71,12 +85,15 @@ export declare class TherapeuticAlternative extends LitElement {
     private renderChecklistSearch;
     private renderSelectedChips;
     private renderPill;
-    private renderInclusionSection;
+    private renderScopeSection;
     private renderExclusionSection;
+    private renderIncludeSection;
     private renderQuickFiltersSection;
+    private renderQuickFilterCount;
     private renderSectionHeader;
     private matchReasonLabels;
     private renderResults;
+    private renderTitle;
     render(): TemplateResult<1>;
     static styles: CSSResult;
 }

package/dist/therapeutic-alternative.es.js

@@ -2297,33 +2297,42 @@ ProductCard = __decorateClass$1([
 ], ProductCard);
 const REFETCH_DEBOUNCE_MS = 300;
 const CHECKLIST_SEARCH_THRESHOLD = 30;
-const INCLUSION_GROUPS = [
+const SCOPE_GROUPS = [
   { key: "indications", idsField: "indicationIds", label: "Indications" },
-  { key: "activeSubstances", idsField: "activeSubstanceIds", label: "Principes actifs" },
-  { key: "atcClasses", idsField: "atcClassIds", label: "Classe thérapeutique" }
+  { key: "atcClasses", idsField: "atcClassIds", label: "Classe ATC" }
 ];
 const EXCLUSION_GROUPS = [
   { key: "activeSubstances", idsField: "activeSubstanceIds", label: "Principes actifs" },
   { key: "notableExcipients", idsField: "notableExcipientIds", label: "Excipients à effet notoire" },
   { key: "excipients", idsField: "excipientIds", label: "Excipients" },
   { key: "contraindications", idsField: "contraindicationIds", label: "Utilisation contre-indiquée" },
-  { key: "cautions", idsField: "cautionIds", label: "Mises en garde" },
-  { key: "precautions", idsField: "precautionIds", label: "Précaution d'emploi" }
+  { key: "cautions", idsField: "cautionIds", label: "Utilisation déconseillée" },
+  { key: "precautions", idsField: "precautionIds", label: "Précaution d'emploi" },
+  { key: "sideEffects", idsField: "sideEffectIds", label: "Effets indésirables" }
 ];
 const QUICK_FILTERS = [
   { key: "sameGalenicForm", label: "Même forme galénique" },
   { key: "sameDosage", label: "Même dosage" },
   { key: "sameRouteOfAdministration", label: "Même voie d'administration" }
 ];
+const INCLUDE_GROUPS = [
+  { key: "activeSubstances", idsField: "activeSubstanceIds", label: "Principes actifs" },
+  { key: "galenicForms", idsField: "galenicFormIds", label: "Forme galénique", quickFilterKey: "sameGalenicForm" },
+  { key: "dosages", idsField: "dosageIds", label: "Dosage", quickFilterKey: "sameDosage" },
+  { key: "routesOfAdministration", idsField: "routeOfAdministrationIds", label: "Voie d'administration", quickFilterKey: "sameRouteOfAdministration" }
+];
 const INCLUDE_COUNT_TOOLTIP = "Nombre de résultats restants avec cette valeur";
 const EXCLUDE_COUNT_TOOLTIP = "Nombre de résultats retirés avec cette valeur";
 const MATCH_REASON_VERB_BY_DIMENSION = {
   indication: "indiqué pour",
   activeSubstance: "contient"
 };
-const therapeuticAlternativeCSS = '.claudebernard-therapeutic-alternative {\n  font-family: var(--custom-font-family, "Ubuntu"), sans-serif;\n  padding: 1rem;\n}\n.claudebernard-therapeutic-alternative-without-title {\n  padding-top: 0;\n  max-width: 70vw;\n  width: 60vw;\n  max-height: 70vh;\n}\n.claudebernard-therapeutic-alternative-title {\n  font-size: 0.75rem;\n  font-weight: 700;\n  letter-spacing: 0.04em;\n  text-transform: uppercase;\n  color: var(--bcbd-gray-500-color, #64748B);\n  margin-bottom: 0.375rem;\n  display: block;\n}\n.claudebernard-therapeutic-alternative__source {\n  display: flex;\n  align-items: center;\n  justify-content: space-between;\n  gap: 1rem;\n  flex-wrap: wrap;\n}\n.claudebernard-therapeutic-alternative__disclaimer {\n  margin-bottom: 1rem;\n}\n.claudebernard-therapeutic-alternative__loading {\n  width: 100%;\n  height: 30%;\n  padding-top: 2rem;\n  display: flex;\n  justify-content: center;\n}\n.claudebernard-therapeutic-alternative__section {\n  border: 1px solid var(--bcbd-border-gray-color, #CBD5E1);\n  border-radius: 0.625rem;\n  padding: 0.75rem 0.875rem;\n  margin-bottom: 1rem;\n}\n.claudebernard-therapeutic-alternative__section-header {\n  display: flex;\n  align-items: center;\n  justify-content: space-between;\n  width: 100%;\n  cursor: pointer;\n  background: none;\n  border: none;\n  padding: 0;\n  margin-bottom: 0.625rem;\n  font-family: inherit;\n  line-height: 1;\n}\n.claudebernard-therapeutic-alternative__section-header span:first-child {\n  font-size: 0.75rem;\n  font-weight: 700;\n  color: var(--bcbd-gray-500-color, #64748B);\n  text-transform: uppercase;\n  letter-spacing: 0.03em;\n}\n.claudebernard-therapeutic-alternative__chevron {\n  font-size: 0.75rem;\n  color: var(--bcbd-gray-400-color, #94A3B8);\n  transition: transform 0.15s ease-out;\n  display: inline-flex;\n}\n.claudebernard-therapeutic-alternative__chevron--expanded {\n  transform: rotate(180deg);\n}\n.claudebernard-therapeutic-alternative__pills {\n  display: flex;\n  gap: 0.5rem;\n  flex-wrap: wrap;\n}\n.claudebernard-therapeutic-alternative__pill {\n  display: inline-flex;\n  align-items: center;\n  gap: 0.375rem;\n  border: 1px solid var(--bcbd-border-gray-color, #CBD5E1);\n  background: #fff;\n  color: var(--bcbd-gray-600-color, #475569);\n  border-radius: 6.25rem;\n  padding: 0.375rem 0.75rem;\n  font-size: 0.8125rem;\n  font-family: inherit;\n  font-weight: 400;\n  white-space: nowrap;\n  cursor: pointer;\n  line-height: 1;\n}\n.claudebernard-therapeutic-alternative__pill--active {\n  border-color: var(--bcbd-primary-color, #0C75AD);\n  background: color-mix(in srgb, var(--bcbd-primary-color, #0C75AD) 10%, transparent);\n  color: var(--bcbd-primary-color, #0C75AD);\n  font-weight: 700;\n}\n.claudebernard-therapeutic-alternative__panel {\n  border-top: 1px solid var(--bcbd-border-color-200, #E2E8F0);\n  margin-top: 0.75rem;\n  padding-top: 0.75rem;\n  display: flex;\n  flex-direction: column;\n  gap: 0.5rem;\n}\n.claudebernard-therapeutic-alternative__panel-rows {\n  display: flex;\n  flex-direction: column;\n  gap: 0.5rem;\n  max-height: 16.25rem;\n  overflow-y: auto;\n  padding: 0.25rem 0.125rem;\n}\n.claudebernard-therapeutic-alternative__panel-empty {\n  display: block;\n  margin-top: 0.75rem;\n  font-size: 0.875rem;\n  color: var(--bcbd-gray-500-color, #64748B);\n}\n.claudebernard-therapeutic-alternative__panel-expand {\n  align-self: flex-start;\n  background: none;\n  border: none;\n  padding: 0.25rem 0 0;\n  font-family: inherit;\n  font-size: 0.8125rem;\n  font-weight: 700;\n  color: var(--bcbd-primary-color, #0C75AD);\n  cursor: pointer;\n}\n.claudebernard-therapeutic-alternative__panel-row {\n  display: flex;\n  align-items: center;\n  justify-content: space-between;\n  border-radius: 0.375rem;\n  --bcbd-checkbox-font-size: 0.875rem;\n  --bcbd-checkbox-size: 0.9375rem;\n}\n.claudebernard-therapeutic-alternative__panel-row--pending {\n  background: var(--bcbd-gray-100-color, #F1F5F9);\n  padding: 0.25rem 0.375rem;\n  margin: -0.25rem -0.375rem;\n}\n.claudebernard-therapeutic-alternative__count-badge {\n  font-size: 0.75rem;\n  color: var(--bcbd-white-color, #fff);\n  background: var(--bcbd-primary-color, #0C75AD);\n  border-radius: 0.25rem;\n  padding: 0.125rem 0.375rem;\n  flex-shrink: 0;\n}\n.claudebernard-therapeutic-alternative__selected-chips {\n  display: flex;\n  gap: 0.375rem;\n  flex-wrap: wrap;\n  margin-top: 0.5rem;\n}\n.claudebernard-therapeutic-alternative__chips {\n  display: flex;\n  gap: 0.5rem;\n  flex-wrap: wrap;\n}\n.claudebernard-therapeutic-alternative__chip {\n  display: inline-flex;\n  align-items: center;\n  gap: 0.375rem;\n  border: 1px solid var(--bcbd-border-gray-color, #CBD5E1);\n  background: #fff;\n  color: var(--bcbd-gray-500-color, #64748B);\n  border-radius: 6.25rem;\n  padding: 0.375rem 0.75rem;\n  font-size: 0.8125rem;\n  font-family: inherit;\n  font-weight: 400;\n  white-space: nowrap;\n  cursor: pointer;\n  line-height: 1;\n}\n.claudebernard-therapeutic-alternative__chip--active {\n  border-color: var(--bcbd-primary-color, #0C75AD);\n  background: color-mix(in srgb, var(--bcbd-primary-color, #0C75AD) 10%, transparent);\n  color: var(--bcbd-primary-color, #0C75AD);\n  font-weight: 700;\n}\n.claudebernard-therapeutic-alternative__results {\n  display: flex;\n  flex-direction: column;\n  gap: 0.5rem;\n}\n.claudebernard-therapeutic-alternative__results-header {\n  display: flex;\n  align-items: center;\n  justify-content: flex-end;\n  margin-bottom: 0.625rem;\n}\n.claudebernard-therapeutic-alternative__results-badge {\n  display: inline-flex;\n  align-items: center;\n  gap: 0.375rem;\n  background: color-mix(in srgb, var(--bcbd-primary-color, #0C75AD) 10%, transparent);\n  color: var(--bcbd-primary-color, #0C75AD);\n  border-radius: 6.25rem;\n  padding: 0.3125rem 0.75rem;\n  font-size: 0.8125rem;\n  font-weight: 700;\n  line-height: 1;\n}\n.claudebernard-therapeutic-alternative__results-list {\n  display: flex;\n  flex-direction: column;\n  gap: 0.5rem;\n}\n.claudebernard-therapeutic-alternative__no-results {\n  text-align: center;\n  padding: 1.5rem 1rem;\n  color: var(--bcbd-gray-500-color, #64748B);\n  font-size: 0.875rem;\n}\n.claudebernard-therapeutic-alternative__no-medication {\n  padding: 1.25rem;\n}';
+const therapeuticAlternativeCSS = '.claudebernard-therapeutic-alternative {\n  font-family: var(--custom-font-family, "Ubuntu"), sans-serif;\n  padding: 1rem;\n}\n.claudebernard-therapeutic-alternative-without-title {\n  padding-top: 0;\n  max-width: 70vw;\n  width: 60vw;\n  max-height: 70vh;\n}\n.claudebernard-therapeutic-alternative-title {\n  font-size: 0.75rem;\n  font-weight: 700;\n  letter-spacing: 0.04em;\n  text-transform: uppercase;\n  color: var(--bcbd-gray-500-color, #64748B);\n  margin-bottom: 0.375rem;\n  display: block;\n}\n.claudebernard-therapeutic-alternative__source {\n  display: flex;\n  align-items: center;\n  justify-content: space-between;\n  gap: 1rem;\n  flex-wrap: wrap;\n}\n.claudebernard-therapeutic-alternative__source .claudebernard-therapeutic-alternative-title {\n  margin-bottom: 0;\n}\n.claudebernard-therapeutic-alternative__source-actions {\n  display: flex;\n  align-items: center;\n  gap: 0.5rem;\n  flex-wrap: wrap;\n}\n.claudebernard-therapeutic-alternative__disclaimer {\n  margin-bottom: 1rem;\n}\n.claudebernard-therapeutic-alternative__loading {\n  width: 100%;\n  height: 30%;\n  padding-top: 2rem;\n  display: flex;\n  justify-content: center;\n}\n.claudebernard-therapeutic-alternative__section {\n  border: 1px solid var(--bcbd-border-gray-color, #CBD5E1);\n  border-radius: 0.625rem;\n  padding: 0.75rem 0.875rem;\n  margin-bottom: 1rem;\n}\n.claudebernard-therapeutic-alternative__section-header {\n  display: flex;\n  align-items: center;\n  justify-content: space-between;\n  width: 100%;\n  cursor: pointer;\n  background: none;\n  border: none;\n  padding: 0;\n  margin-bottom: 0.625rem;\n  font-family: inherit;\n  line-height: 1;\n}\n.claudebernard-therapeutic-alternative__section-header span:first-child {\n  font-size: 0.75rem;\n  font-weight: 700;\n  color: var(--bcbd-gray-500-color, #64748B);\n  text-transform: uppercase;\n  letter-spacing: 0.03em;\n}\n.claudebernard-therapeutic-alternative__chevron {\n  font-size: 0.75rem;\n  color: var(--bcbd-gray-400-color, #94A3B8);\n  transition: transform 0.15s ease-out;\n  display: inline-flex;\n}\n.claudebernard-therapeutic-alternative__chevron--expanded {\n  transform: rotate(180deg);\n}\n.claudebernard-therapeutic-alternative__pills {\n  display: flex;\n  gap: 0.5rem;\n  flex-wrap: wrap;\n}\n.claudebernard-therapeutic-alternative__pill {\n  display: inline-flex;\n  align-items: center;\n  gap: 0.375rem;\n  border: 1px solid var(--bcbd-border-gray-color, #CBD5E1);\n  background: #fff;\n  color: var(--bcbd-gray-600-color, #475569);\n  border-radius: 6.25rem;\n  padding: 0.375rem 0.75rem;\n  font-size: 0.8125rem;\n  font-family: inherit;\n  font-weight: 400;\n  white-space: nowrap;\n  cursor: pointer;\n  line-height: 1;\n}\n.claudebernard-therapeutic-alternative__pill--active {\n  border-color: var(--bcbd-primary-color, #0C75AD);\n  background: color-mix(in srgb, var(--bcbd-primary-color, #0C75AD) 10%, transparent);\n  color: var(--bcbd-primary-color, #0C75AD);\n  font-weight: 700;\n}\n.claudebernard-therapeutic-alternative__panel {\n  border-top: 1px solid var(--bcbd-border-color-200, #E2E8F0);\n  margin-top: 0.75rem;\n  padding-top: 0.75rem;\n  display: flex;\n  flex-direction: column;\n  gap: 0.5rem;\n}\n.claudebernard-therapeutic-alternative__panel-rows {\n  display: flex;\n  flex-direction: column;\n  gap: 0.5rem;\n  max-height: 16.25rem;\n  overflow-y: auto;\n  padding: 0.25rem 0.125rem;\n}\n.claudebernard-therapeutic-alternative__panel-empty {\n  display: block;\n  margin-top: 0.75rem;\n  font-size: 0.875rem;\n  color: var(--bcbd-gray-500-color, #64748B);\n}\n.claudebernard-therapeutic-alternative__panel-expand {\n  align-self: flex-start;\n  background: none;\n  border: none;\n  padding: 0.25rem 0 0;\n  font-family: inherit;\n  font-size: 0.8125rem;\n  font-weight: 700;\n  color: var(--bcbd-primary-color, #0C75AD);\n  cursor: pointer;\n}\n.claudebernard-therapeutic-alternative__panel-row {\n  display: flex;\n  align-items: center;\n  justify-content: space-between;\n  border-radius: 0.375rem;\n  --bcbd-checkbox-font-size: 0.875rem;\n  --bcbd-checkbox-size: 0.9375rem;\n}\n.claudebernard-therapeutic-alternative__panel-row--pending {\n  background: var(--bcbd-gray-100-color, #F1F5F9);\n  padding: 0.25rem 0.375rem;\n  margin: -0.25rem -0.375rem;\n}\n.claudebernard-therapeutic-alternative__panel-row--possessed {\n  font-weight: 700;\n}\n.claudebernard-therapeutic-alternative__count-badge {\n  font-size: 0.75rem;\n  color: var(--bcbd-white-color, #fff);\n  background: var(--bcbd-primary-color, #0C75AD);\n  border-radius: 0.25rem;\n  padding: 0.125rem 0.375rem;\n  flex-shrink: 0;\n}\n.claudebernard-therapeutic-alternative__selected-chips {\n  display: flex;\n  gap: 0.375rem;\n  flex-wrap: wrap;\n  margin-top: 0.5rem;\n}\n.claudebernard-therapeutic-alternative__results {\n  display: flex;\n  flex-direction: column;\n  gap: 0.5rem;\n}\n.claudebernard-therapeutic-alternative__results-header {\n  display: flex;\n  align-items: center;\n  justify-content: flex-end;\n  margin-bottom: 0.625rem;\n}\n.claudebernard-therapeutic-alternative__results-badge {\n  display: inline-flex;\n  align-items: center;\n  gap: 0.375rem;\n  background: color-mix(in srgb, var(--bcbd-primary-color, #0C75AD) 10%, transparent);\n  color: var(--bcbd-primary-color, #0C75AD);\n  border-radius: 6.25rem;\n  padding: 0.3125rem 0.75rem;\n  font-size: 0.8125rem;\n  font-weight: 700;\n  line-height: 1;\n}\n.claudebernard-therapeutic-alternative__results-list {\n  display: flex;\n  flex-direction: column;\n  gap: 0.5rem;\n}\n.claudebernard-therapeutic-alternative__no-results {\n  text-align: center;\n  padding: 1.5rem 1rem;\n  color: var(--bcbd-gray-500-color, #64748B);\n  font-size: 0.875rem;\n}\n.claudebernard-therapeutic-alternative__no-medication {\n  padding: 1.25rem;\n}';
+function emptyScopeCriteria() {
+  return { indicationIds: [], atcClassIds: [] };
+}
 function emptyIncludeCriteria() {
-  return { indicationIds: [], activeSubstanceIds: [], atcClassIds: [] };
+  return { activeSubstanceIds: [], galenicFormIds: [], dosageIds: [], routeOfAdministrationIds: [] };
 }
 function emptyExcludeCriteria() {
   return {
@@ -2332,14 +2341,18 @@ function emptyExcludeCriteria() {
     excipientIds: [],
     contraindicationIds: [],
     cautionIds: [],
-    precautionIds: []
+    precautionIds: [],
+    sideEffectIds: []
   };
 }
 function emptyQuickFilters() {
   return { sameGalenicForm: false, sameDosage: false, sameRouteOfAdministration: false };
 }
+function emptyScopeFacets() {
+  return { indications: [], atcClasses: [] };
+}
 function emptyIncludeFacets() {
-  return { indications: [], activeSubstances: [], atcClasses: [] };
+  return { activeSubstances: [], galenicForms: [], dosages: [], routesOfAdministration: [] };
 }
 function emptyExcludeFacets() {
   return {
@@ -2348,11 +2361,15 @@ function emptyExcludeFacets() {
     excipients: [],
     contraindications: [],
     cautions: [],
-    precautions: []
+    precautions: [],
+    sideEffects: []
   };
 }
+function emptyScopeLabels() {
+  return { indications: {}, atcClasses: {} };
+}
 function emptyIncludeLabels() {
-  return { indications: {}, activeSubstances: {}, atcClasses: {} };
+  return { activeSubstances: {}, galenicForms: {}, dosages: {}, routesOfAdministration: {} };
 }
 function labelsForIds(ids, values) {
   const labelById = new Map(values.filter((v2) => v2.id).map((v2) => [v2.id, v2.label ?? v2.id]));
@@ -2372,7 +2389,8 @@ function emptyExcludeLabels() {
     excipients: {},
     contraindications: {},
     cautions: {},
-    precautions: {}
+    precautions: {},
+    sideEffects: {}
   };
 }
 var __defProp = Object.defineProperty;
@@ -2397,26 +2415,31 @@ let TherapeuticAlternative = class extends i$1 {
     this.totalElements = 0;
     this.lastRequestHadNoSelectedCriteria = true;
     this.currentPage = 1;
+    this.scope = emptyScopeCriteria();
     this.include = emptyIncludeCriteria();
     this.exclude = emptyExcludeCriteria();
     this.quickFilters = emptyQuickFilters();
+    this.quickFilterFacets = {};
+    this.scopeFacets = emptyScopeFacets();
     this.includeFacets = emptyIncludeFacets();
     this.excludeFacets = emptyExcludeFacets();
     this.truncatedGroups = [];
     this.expandFacetGroupKey = null;
+    this.scopeLabels = emptyScopeLabels();
     this.includeLabels = emptyIncludeLabels();
     this.excludeLabels = emptyExcludeLabels();
-    this.openInclusionGroup = null;
+    this.openScopeGroup = null;
     this.openExclusionGroup = null;
+    this.openIncludeGroup = null;
     this.checklistSearchTerm = "";
-    this.sectionCollapsed = { inclusion: false, exclusion: false, quickFilters: false };
+    this.sectionCollapsed = { scope: false, include: false, exclusion: false, quickFilters: false };
     this.apiSearchError = null;
     this.apiSearchLoading = false;
     this.pendingToggleIds = /* @__PURE__ */ new Set();
     this.apiReplaceError = null;
     this.apiReplaceLoading = false;
     this.missingPrescriptionError = null;
-    this.hasAppliedInitialInclude = false;
+    this.hasAppliedInitialScope = false;
     this.requestSeq = 0;
   }
   get currentMedication() {
@@ -2439,20 +2462,30 @@ let TherapeuticAlternative = class extends i$1 {
       });
     }
     if (changedProperties.has("medication") && this.currentMedication) {
-      this.clearScheduledRefetch();
-      this.include = emptyIncludeCriteria();
-      this.exclude = emptyExcludeCriteria();
-      this.includeLabels = emptyIncludeLabels();
-      this.excludeLabels = emptyExcludeLabels();
-      this.quickFilters = emptyQuickFilters();
-      this.openInclusionGroup = null;
-      this.openExclusionGroup = null;
-      this.expandFacetGroupKey = null;
-      this.currentPage = 1;
-      this.hasAppliedInitialInclude = false;
-      this.fetchAlternatives();
+      this.resetAllCriteria();
     }
   }
+  // Shared by a medication change (updated() above) and the user-facing "Réinitialiser" button:
+  // both mean "start over from the initial state for this medication" -- clearing
+  // hasAppliedInitialScope so the next response re-derives and re-applies scope's own pre-check
+  // (see applyResponse) rather than leaving scope empty, which would NOT be the initial state.
+  resetAllCriteria() {
+    this.clearScheduledRefetch();
+    this.scope = emptyScopeCriteria();
+    this.include = emptyIncludeCriteria();
+    this.exclude = emptyExcludeCriteria();
+    this.scopeLabels = emptyScopeLabels();
+    this.includeLabels = emptyIncludeLabels();
+    this.excludeLabels = emptyExcludeLabels();
+    this.quickFilters = emptyQuickFilters();
+    this.openScopeGroup = null;
+    this.openExclusionGroup = null;
+    this.openIncludeGroup = null;
+    this.expandFacetGroupKey = null;
+    this.currentPage = 1;
+    this.hasAppliedInitialScope = false;
+    this.fetchAlternatives();
+  }
   disconnectedCallback() {
     super.disconnectedCallback();
     this.clearScheduledRefetch();
@@ -2471,10 +2504,11 @@ let TherapeuticAlternative = class extends i$1 {
   // Mirrors the backend's own hasNoSelectedCriteria(request) -- must be evaluated against
   // whatever's about to be SENT, not read back later, see lastRequestHadNoSelectedCriteria.
   hasNoSelectedCriteria() {
-    const anyInclude = this.include.indicationIds.length > 0 || this.include.activeSubstanceIds.length > 0 || this.include.atcClassIds.length > 0;
+    const anyScope = this.scope.indicationIds.length > 0 || this.scope.atcClassIds.length > 0;
+    const anyInclude = Object.values(this.include).some((ids) => ids.length > 0);
     const anyExclude = Object.values(this.exclude).some((ids) => ids.length > 0);
     const anyQuickFilter = this.quickFilters.sameGalenicForm || this.quickFilters.sameDosage || this.quickFilters.sameRouteOfAdministration;
-    return !anyInclude && !anyExclude && !anyQuickFilter;
+    return !anyScope && !anyInclude && !anyExclude && !anyQuickFilter;
   }
   fetchAlternatives() {
     const productId = this.sourceProductId;
@@ -2486,6 +2520,7 @@ let TherapeuticAlternative = class extends i$1 {
     this.apiSearchError = null;
     this.lastRequestHadNoSelectedCriteria = this.hasNoSelectedCriteria();
     const body = {
+      scope: this.scope,
       include: this.include,
       exclude: this.exclude,
       quickFilters: this.quickFilters,
@@ -2515,68 +2550,122 @@ let TherapeuticAlternative = class extends i$1 {
     this.sourceProduct = data.sourceProduct ?? null;
     this.results = data.results?.content ?? [];
     this.totalElements = data.results?.totalElements ?? 0;
+    this.scopeFacets = TherapeuticAlternative.buildScopeFacets(data);
     this.includeFacets = TherapeuticAlternative.buildIncludeFacets(data);
     this.excludeFacets = TherapeuticAlternative.buildExcludeFacets(data);
+    this.quickFilterFacets = data.facets?.quickFilters ?? {};
     this.truncatedGroups = data.facets?.truncatedGroups ?? [];
-    if (!this.hasAppliedInitialInclude) {
-      this.hasAppliedInitialInclude = true;
-      this.include = TherapeuticAlternative.deriveInitialInclude(this.sourceProduct);
-      this.includeLabels = {
-        indications: labelsForIds(this.include.indicationIds, this.includeFacets.indications),
-        activeSubstances: labelsForIds(this.include.activeSubstanceIds, this.includeFacets.activeSubstances),
-        atcClasses: labelsForIds(this.include.atcClassIds, this.includeFacets.atcClasses)
+    if (!this.hasAppliedInitialScope) {
+      this.hasAppliedInitialScope = true;
+      this.scope = TherapeuticAlternative.deriveInitialScope(this.sourceProduct);
+      this.scopeLabels = {
+        indications: labelsForIds(this.scope.indicationIds, this.scopeFacets.indications),
+        atcClasses: labelsForIds(this.scope.atcClassIds, this.scopeFacets.atcClasses)
       };
     }
   }
+  static buildScopeFacets(data) {
+    return {
+      indications: data.facets?.scope?.indications ?? [],
+      atcClasses: data.facets?.scope?.atcClasses ?? []
+    };
+  }
   static buildIncludeFacets(data) {
     return {
-      indications: data.facets?.include?.indications ?? [],
       activeSubstances: data.facets?.include?.activeSubstances ?? [],
-      atcClasses: data.facets?.include?.atcClasses ?? []
+      galenicForms: data.facets?.include?.galenicForms ?? [],
+      dosages: data.facets?.include?.dosages ?? [],
+      routesOfAdministration: data.facets?.include?.routesOfAdministration ?? []
     };
   }
   static buildExcludeFacets(data) {
-    return {
-      activeSubstances: data.facets?.exclude?.activeSubstances ?? [],
-      notableExcipients: data.facets?.exclude?.notableExcipients ?? [],
-      excipients: data.facets?.exclude?.excipients ?? [],
-      contraindications: data.facets?.exclude?.contraindications ?? [],
-      cautions: data.facets?.exclude?.cautions ?? [],
-      precautions: data.facets?.exclude?.precautions ?? []
-    };
+    const facets = emptyExcludeFacets();
+    for (const group of EXCLUSION_GROUPS) {
+      facets[group.key] = data.facets?.exclude?.[group.key] ?? [];
+    }
+    return facets;
   }
-  static deriveInitialInclude(sourceProduct) {
-    const codesOf = (list) => (list ?? []).map((item) => item.code).filter((code) => !!code);
+  static codesOf(list) {
+    return (list ?? []).map((item) => item.code).filter((code) => !!code);
+  }
+  static deriveInitialScope(sourceProduct) {
     return {
-      indicationIds: codesOf(sourceProduct?.extendedProperties?.keywords?.indicationsKeywords),
-      activeSubstanceIds: codesOf(sourceProduct?.extendedProperties?.composition?.activeSubstances),
-      // Contrairement à indications/activeSubstances (des listes plates de valeurs propres au
-      // produit), sourceProduct.properties.atcClasses est un fil d'Ariane hiérarchique (classe >
-      // sous-classe > ... > code le plus spécifique, ex: M, M01, M01A, M01AX, M01AX02) — les
-      // mapper tous comme ids cochés n'a pas de sens (5 "sélections" pour UNE seule classification),
-      // et envoie en plus des codes ancêtres bien trop larges (ex: "M" = tout le système
-      // musculo-squelettique) dans la requête, invisibles dans l'UI puisque sans label correspondant
-      // dans includeFacets.atcClasses. Rien n'est pré-coché pour ce groupe : le backend applique déjà
-      // son propre défaut sur atcClassIds vide (voir le commentaire plus haut sur fetchAlternatives).
+      indicationIds: TherapeuticAlternative.codesOf(sourceProduct?.extendedProperties?.keywords?.indicationsKeywords),
+      // Contrairement à indications (une liste plate de valeurs propres au produit),
+      // sourceProduct.properties.atcClasses est un fil d'Ariane hiérarchique (classe > sous-classe
+      // > ... > code le plus spécifique, ex: M, M01, M01A, M01AX, M01AX02) — les mapper tous comme
+      // ids cochés n'a pas de sens (5 "sélections" pour UNE seule classification), et envoie en
+      // plus des codes ancêtres bien trop larges (ex: "M" = tout le système musculo-squelettique)
+      // dans la requête, invisibles dans l'UI puisque sans label correspondant dans
+      // scopeFacets.atcClasses. Rien n'est pré-coché pour ce groupe : le backend applique déjà son
+      // propre défaut sur atcClassIds vide (voir le commentaire plus haut sur fetchAlternatives).
       atcClassIds: []
     };
   }
-  // label n'est utilisé que sur la branche "coche" (pour alimenter includeLabels/excludeLabels —
-  // voir emptyIncludeLabels) ; sur la branche "décoche" l'id est simplement retiré des deux côtés,
-  // que l'appelant soit une checkbox du panel (qui a le label sous la main) ou un chip de rappel
-  // (qui décoche un id dont le panel courant n'a peut-être même plus trace).
-  toggleInclude(group, id, label) {
-    const current = this.include[group.idsField] ?? [];
+  // The ids to bold in an include checklist panel (see renderChecklistPanel's possessedIds param)
+  // -- what the SOURCE product itself already has for that dimension, not what's currently
+  // selected. galenicForms/dosages are single-valued on the source (a product has exactly one), so
+  // each contributes at most one id; activeSubstances/routesOfAdministration can be multi-valued.
+  // dosages is a best-effort string match (source's raw productDosage against the facet's own
+  // dosage-string ids) -- it can occasionally miss on formatting, unlike the others' exact codes.
+  includePossessedIds(key) {
+    const properties = this.sourceProduct?.properties;
+    const composition = this.sourceProduct?.extendedProperties?.composition;
+    switch (key) {
+      case "activeSubstances":
+        return new Set(TherapeuticAlternative.codesOf(composition?.activeSubstances));
+      case "galenicForms":
+        return properties?.galenicFormCode ? /* @__PURE__ */ new Set([properties.galenicFormCode]) : /* @__PURE__ */ new Set();
+      case "dosages":
+        return properties?.productDosage ? /* @__PURE__ */ new Set([properties.productDosage]) : /* @__PURE__ */ new Set();
+      case "routesOfAdministration":
+        return new Set(TherapeuticAlternative.codesOf(this.sourceProduct?.extendedProperties?.routes));
+      default:
+        return /* @__PURE__ */ new Set();
+    }
+  }
+  // Same idea as includePossessedIds, for the exclude checklist panels: the exclude groups' own
+  // values come from the whole candidate pool (see SearchCustomService.addExcludeMustNotQueries),
+  // not just the source product, so "does the source itself already have this excipient/
+  // contraindication/..." is a real, non-trivial question worth answering here too.
+  excludePossessedIds(key) {
+    const composition = this.sourceProduct?.extendedProperties?.composition;
+    const keywords = this.sourceProduct?.extendedProperties?.keywords;
+    switch (key) {
+      case "activeSubstances":
+        return new Set(TherapeuticAlternative.codesOf(composition?.activeSubstances));
+      case "notableExcipients":
+        return new Set(TherapeuticAlternative.codesOf(composition?.excipientsWithKnownEffects));
+      case "excipients":
+        return new Set(TherapeuticAlternative.codesOf(composition?.excipients));
+      case "contraindications":
+        return new Set(TherapeuticAlternative.codesOf(keywords?.contraindicationsKeywords));
+      case "cautions":
+        return new Set(TherapeuticAlternative.codesOf(keywords?.contraindicationsNotRecommendedKeywords));
+      case "precautions":
+        return new Set(TherapeuticAlternative.codesOf(keywords?.precautionsForUseKeywords));
+      case "sideEffects":
+        return new Set(TherapeuticAlternative.codesOf(keywords?.sideEffectsKeywords));
+      default:
+        return /* @__PURE__ */ new Set();
+    }
+  }
+  // label n'est utilisé que sur la branche "coche" (pour alimenter scopeLabels/includeLabels/
+  // excludeLabels — voir emptyScopeLabels) ; sur la branche "décoche" l'id est simplement retiré
+  // des deux côtés, que l'appelant soit une checkbox du panel (qui a le label sous la main) ou un
+  // chip de rappel (qui décoche un id dont le panel courant n'a peut-être même plus trace).
+  toggleScope(group, id, label) {
+    const current = this.scope[group.idsField] ?? [];
     const checking = !current.includes(id);
     const next = checking ? [...current, id] : current.filter((existing) => existing !== id);
-    this.include = { ...this.include, [group.idsField]: next };
-    const nextLabels = { ...this.includeLabels[group.key] };
+    this.scope = { ...this.scope, [group.idsField]: next };
+    const nextLabels = { ...this.scopeLabels[group.key] };
     if (checking) {
       nextLabels[id] = label;
     } else {
       delete nextLabels[id];
     }
-    this.includeLabels = { ...this.includeLabels, [group.key]: nextLabels };
+    this.scopeLabels = { ...this.scopeLabels, [group.key]: nextLabels };
     this.pendingToggleIds = new Set(this.pendingToggleIds).add(id);
     this.scheduleRefetch();
   }
@@ -2595,25 +2684,67 @@ let TherapeuticAlternative = class extends i$1 {
     this.pendingToggleIds = new Set(this.pendingToggleIds).add(id);
     this.scheduleRefetch();
   }
+  // Checking a specific value in an include group takes over from its corresponding quick filter,
+  // when it has one (see IncludeGroupConfig.quickFilterKey -- activeSubstances has none) --
+  // leaving both on could silently AND into an impossible/contradictory combination (e.g. quick
+  // filter pinned to the source's own "Comprimé" while the checklist asks for "Solution
+  // injectable") rather than the refinement the user asked for. Same rationale as
+  // toggleQuickFilter below, the other direction.
+  toggleInclude(group, id, label) {
+    const current = this.include[group.idsField] ?? [];
+    const checking = !current.includes(id);
+    const next = checking ? [...current, id] : current.filter((existing) => existing !== id);
+    this.include = { ...this.include, [group.idsField]: next };
+    const nextLabels = { ...this.includeLabels[group.key] };
+    if (checking) {
+      nextLabels[id] = label;
+    } else {
+      delete nextLabels[id];
+    }
+    this.includeLabels = { ...this.includeLabels, [group.key]: nextLabels };
+    if (checking && group.quickFilterKey && this.quickFilters[group.quickFilterKey]) {
+      this.quickFilters = { ...this.quickFilters, [group.quickFilterKey]: false };
+    }
+    this.pendingToggleIds = new Set(this.pendingToggleIds).add(id);
+    this.scheduleRefetch();
+  }
   toggleQuickFilter(key) {
-    this.quickFilters = { ...this.quickFilters, [key]: !this.quickFilters[key] };
+    const turningOn = !this.quickFilters[key];
+    this.quickFilters = { ...this.quickFilters, [key]: turningOn };
+    if (turningOn) {
+      const group = INCLUDE_GROUPS.find((g2) => g2.quickFilterKey === key);
+      if (group && this.include[group.idsField].length > 0) {
+        this.include = { ...this.include, [group.idsField]: [] };
+        this.includeLabels = { ...this.includeLabels, [group.key]: {} };
+      }
+    }
+    this.pendingToggleIds = new Set(this.pendingToggleIds).add(key);
     this.scheduleRefetch();
   }
   // The exclude "activeSubstances" group's own backend/truncatedGroups key is
   // "excludeActiveSubstances" (see SearchCustomService.assignFacetValues) -- distinct from the
-  // inclusion dimension of the same frontend name, so it can't reuse ExcludeGroupKey as-is.
+  // include dimension of the same frontend name, so it can't reuse ExcludeGroupKey as-is.
   // Every other exclude group's backend key matches its frontend key 1:1.
   exclusionTruncatedGroupKey(key) {
     return key === "activeSubstances" ? "excludeActiveSubstances" : key;
   }
-  toggleInclusionPanel(key) {
-    this.openInclusionGroup = this.openInclusionGroup === key ? null : key;
+  // Same rationale as exclusionTruncatedGroupKey, the include side: "activeSubstances"' own
+  // backend key is "includeActiveSubstances".
+  includeTruncatedGroupKey(key) {
+    return key === "activeSubstances" ? "includeActiveSubstances" : key;
+  }
+  toggleScopePanel(key) {
+    this.openScopeGroup = this.openScopeGroup === key ? null : key;
     this.checklistSearchTerm = "";
   }
   toggleExclusionPanel(key) {
     this.openExclusionGroup = this.openExclusionGroup === key ? null : key;
     this.checklistSearchTerm = "";
   }
+  toggleIncludePanel(key) {
+    this.openIncludeGroup = this.openIncludeGroup === key ? null : key;
+    this.checklistSearchTerm = "";
+  }
   // "Afficher plus" for one truncated group's checklist -- see expandFacetGroupKey. Triggers an
   // immediate refetch (unlike opening/closing a panel) since this is the one action that actually
   // needs a new response to have an effect.
@@ -2691,7 +2822,7 @@ let TherapeuticAlternative = class extends i$1 {
       this.apiReplaceLoading = false;
     }
   }
-  renderChecklistPanel(items, selectedIds, showCount, countTooltip, onToggle, testIdPrefix, showCode = false, truncated = false, onExpand) {
+  renderChecklistPanel(items, selectedIds, showCount, countTooltip, onToggle, testIdPrefix, showCode = false, truncated = false, onExpand, possessedIds = /* @__PURE__ */ new Set()) {
     const visibleItems = items.filter((item) => {
       if (item.id !== void 0 && this.pendingToggleIds.has(item.id)) {
         return true;
@@ -2718,7 +2849,8 @@ let TherapeuticAlternative = class extends i$1 {
       const pending = this.pendingToggleIds.has(item.id);
       const rowClasses = [
         `${PREFIX}-therapeutic-alternative__panel-row`,
-        pending ? `${PREFIX}-therapeutic-alternative__panel-row--pending` : ""
+        pending ? `${PREFIX}-therapeutic-alternative__panel-row--pending` : "",
+        possessedIds.has(item.id) ? `${PREFIX}-therapeutic-alternative__panel-row--possessed` : ""
       ].join(" ");
       return b`
       <div class=${rowClasses}>
@@ -2764,8 +2896,8 @@ let TherapeuticAlternative = class extends i$1 {
   }
   // Only rendered past CHECKLIST_SEARCH_THRESHOLD (see renderChecklistPanel) -- below that, typing
   // is slower than just scanning the list by eye. checklistSearchTerm is reset whenever a different
-  // group/section opens (toggleInclusionPanel/toggleExclusionPanel) so a leftover term from a
-  // previous panel can't silently hide everything in the next one.
+  // group/section opens (toggleScopePanel/toggleExclusionPanel/toggleIncludePanel) so a leftover
+  // term from a previous panel can't silently hide everything in the next one.
   renderChecklistSearch(testIdPrefix) {
     return b`
       <bcbd-input
@@ -2781,9 +2913,9 @@ let TherapeuticAlternative = class extends i$1 {
   }
   // Rappel des valeurs actuellement cochées pour TOUTE la section (tous ses groupes confondus),
   // toujours affiché dès qu'il y en a — indépendamment de quel panel est ouvert, voire qu'aucun ne
-  // le soit. C'est la vue "source de vérité" (includeLabels/excludeLabels) plutôt que le panel
-  // ouvert : une valeur cochée reste visible et décochable ici même si un refetch a fait disparaître
-  // sa ligne du panel courant (voir emptyIncludeLabels).
+  // le soit. C'est la vue "source de vérité" (scopeLabels/includeLabels/excludeLabels) plutôt que
+  // le panel ouvert : une valeur cochée reste visible et décochable ici même si un refetch a fait
+  // disparaître sa ligne du panel courant (voir emptyScopeLabels).
   renderSelectedChips(labelsByGroup, onRemove, testIdPrefix) {
     const entries = [];
     for (const [groupKey, labels] of Object.entries(labelsByGroup)) {
@@ -2830,36 +2962,36 @@ let TherapeuticAlternative = class extends i$1 {
       </button>
     `;
   }
-  renderInclusionSection() {
-    const chips = this.renderSelectedChips(this.includeLabels, (groupKey, id) => {
-      const group = INCLUSION_GROUPS.find((g2) => g2.key === groupKey);
+  renderScopeSection() {
+    const chips = this.renderSelectedChips(this.scopeLabels, (groupKey, id) => {
+      const group = SCOPE_GROUPS.find((g2) => g2.key === groupKey);
       if (group) {
-        this.toggleInclude(group, id, "");
+        this.toggleScope(group, id, "");
       }
-    }, "inclusion");
-    if (this.sectionCollapsed.inclusion) {
+    }, "scope");
+    if (this.sectionCollapsed.scope) {
       return chips;
     }
-    const openGroup = INCLUSION_GROUPS.find((group) => group.key === this.openInclusionGroup);
-    const pills = INCLUSION_GROUPS.map((group) => this.renderPill(
+    const openGroup = SCOPE_GROUPS.find((group) => group.key === this.openScopeGroup);
+    const pills = SCOPE_GROUPS.map((group) => this.renderPill(
       group.label,
-      this.include[group.idsField].length > 0,
-      group.key === this.openInclusionGroup,
-      () => this.toggleInclusionPanel(group.key),
-      `inclusion-pill-${group.key}`
+      this.scope[group.idsField].length > 0,
+      group.key === this.openScopeGroup,
+      () => this.toggleScopePanel(group.key),
+      `scope-pill-${group.key}`
     ));
     return b`
-      <div class="${PREFIX}-therapeutic-alternative__pills" data-test-id="inclusion-pills">
+      <div class="${PREFIX}-therapeutic-alternative__pills" data-test-id="scope-pills">
         ${pills}
       </div>
       ${chips}
       ${openGroup ? this.renderChecklistPanel(
-      this.includeFacets[openGroup.key],
-      this.include[openGroup.idsField],
+      this.scopeFacets[openGroup.key],
+      this.scope[openGroup.idsField],
       true,
       INCLUDE_COUNT_TOOLTIP,
-      (id, label) => this.toggleInclude(openGroup, id, label),
-      `inclusion-${openGroup.key}`,
+      (id, label) => this.toggleScope(openGroup, id, label),
+      `scope-${openGroup.key}`,
       openGroup.key === "atcClasses",
       // Already expanded == clicking again would send the exact same expandFacetGroup and get
       // the exact same (still truncated, if it's a group with more than FACET_VALUES_EXPANDED_SIZE
@@ -2904,7 +3036,47 @@ let TherapeuticAlternative = class extends i$1 {
       `exclusion-${openGroup.key}`,
       false,
       canExpand,
-      () => this.requestMoreFacetValues(truncatedGroupKey)
+      () => this.requestMoreFacetValues(truncatedGroupKey),
+      this.excludePossessedIds(openGroup.key)
+    ) : A}
+    `;
+  }
+  renderIncludeSection() {
+    const chips = this.renderSelectedChips(this.includeLabels, (groupKey, id) => {
+      const group = INCLUDE_GROUPS.find((g2) => g2.key === groupKey);
+      if (group) {
+        this.toggleInclude(group, id, "");
+      }
+    }, "include");
+    if (this.sectionCollapsed.include) {
+      return chips;
+    }
+    const openGroup = INCLUDE_GROUPS.find((group) => group.key === this.openIncludeGroup);
+    const pills = INCLUDE_GROUPS.map((group) => this.renderPill(
+      group.label,
+      this.include[group.idsField].length > 0,
+      group.key === this.openIncludeGroup,
+      () => this.toggleIncludePanel(group.key),
+      `include-pill-${group.key}`
+    ));
+    const truncatedGroupKey = openGroup ? this.includeTruncatedGroupKey(openGroup.key) : null;
+    const canExpand = truncatedGroupKey !== null && this.truncatedGroups.includes(truncatedGroupKey) && this.expandFacetGroupKey !== truncatedGroupKey;
+    return b`
+      <div class="${PREFIX}-therapeutic-alternative__pills" data-test-id="include-pills">
+        ${pills}
+      </div>
+      ${chips}
+      ${openGroup ? this.renderChecklistPanel(
+      this.includeFacets[openGroup.key],
+      this.include[openGroup.idsField],
+      true,
+      INCLUDE_COUNT_TOOLTIP,
+      (id, label) => this.toggleInclude(openGroup, id, label),
+      `include-${openGroup.key}`,
+      false,
+      canExpand,
+      () => this.requestMoreFacetValues(truncatedGroupKey),
+      this.includePossessedIds(openGroup.key)
     ) : A}
     `;
   }
@@ -2912,25 +3084,56 @@ let TherapeuticAlternative = class extends i$1 {
     if (this.sectionCollapsed.quickFilters) {
       return A;
     }
-    const chips = QUICK_FILTERS.map((filter) => {
-      const active = this.quickFilters[filter.key];
-      const chipClasses = [
-        `${PREFIX}-therapeutic-alternative__chip`,
-        active ? `${PREFIX}-therapeutic-alternative__chip--active` : ""
+    const visibleFilters = QUICK_FILTERS.filter((filter) => {
+      if (this.quickFilters[filter.key] || this.pendingToggleIds.has(filter.key)) {
+        return true;
+      }
+      return this.quickFilterFacets[filter.key] !== 0;
+    });
+    if (visibleFilters.length === 0) {
+      return b`<span class="${PREFIX}-therapeutic-alternative__panel-empty">Aucune valeur disponible.</span>`;
+    }
+    const rows = visibleFilters.map((filter) => {
+      const count = this.quickFilterFacets[filter.key];
+      const pending = this.pendingToggleIds.has(filter.key);
+      const rowClasses = [
+        `${PREFIX}-therapeutic-alternative__panel-row`,
+        pending ? `${PREFIX}-therapeutic-alternative__panel-row--pending` : ""
       ].join(" ");
       return b`
-        <button type="button" class=${chipClasses} @click=${() => this.toggleQuickFilter(filter.key)} data-test-id=${`quick-filter-${filter.key}`}>
-          ${active ? b`<bcbd-icon icon="check" size="extra-small"></bcbd-icon>` : A}
-          ${filter.label}
-        </button>
+        <div class=${rowClasses}>
+          <bcbd-checkbox
+            id=${`quick-filter-${filter.key}`}
+            label=${filter.label}
+            ?checked=${this.quickFilters[filter.key]}
+            color="primary"
+            @change=${() => this.toggleQuickFilter(filter.key)}
+            data-test-id=${`quick-filter-${filter.key}`}>
+          </bcbd-checkbox>
+          ${pending ? b`
+            <bcbd-loader theme="standard" size="18" data-test-id=${`quick-filter-loader-${filter.key}`}></bcbd-loader>
+          ` : this.renderQuickFilterCount(filter.key, count)}
+        </div>
       `;
     });
     return b`
-      <div class="${PREFIX}-therapeutic-alternative__chips" data-test-id="quick-filters-chips">
-        ${chips}
+      <div class="${PREFIX}-therapeutic-alternative__panel" data-test-id="quick-filters-panel">
+        <div class="${PREFIX}-therapeutic-alternative__panel-rows">
+          ${rows}
+        </div>
       </div>
     `;
   }
+  renderQuickFilterCount(key, count) {
+    if (count === void 0) {
+      return A;
+    }
+    return b`
+      <bcbd-tooltip placement="left" content=${INCLUDE_COUNT_TOOLTIP} data-test-id=${`quick-filter-count-tooltip-${key}`}>
+        <span class="${PREFIX}-therapeutic-alternative__count-badge" data-test-id=${`quick-filter-count-${key}`}>${count}</span>
+      </bcbd-tooltip>
+    `;
+  }
   renderSectionHeader(title, section) {
     const collapsed = this.sectionCollapsed[section];
     const chevronClasses = [
@@ -2952,8 +3155,8 @@ let TherapeuticAlternative = class extends i$1 {
   // Turns a result's raw matchReasons into short bullet lines, e.g. "- indiqué pour Arthrose" or
   // "- contient Bisoprolol (synonyme de Métoprolol)" -- label/synonymLabel come straight from the
   // backend (resolved from the source/matching product's own documents), not looked up in
-  // includeFacets: that only ever covers the request's criterion codes, never synonymCode, which
-  // is a code found on this specific result product, not a criterion at all.
+  // scopeFacets/includeFacets: those only ever cover the request's criterion codes, never
+  // synonymCode, which is a code found on this specific result product, not a criterion at all.
   matchReasonLabels(result) {
     const labels = (result.matchReasons ?? []).map((reason) => {
       const dimension = reason.dimension ?? "";
@@ -3022,6 +3225,11 @@ let TherapeuticAlternative = class extends i$1 {
         </bcbd-pagination>`}
     `;
   }
+  // The product name in the title replaces the "Produit sélectionné" line when has-title is on; without
+  // a title, that line (see render) is the only place the product name shows.
+  renderTitle(medicationTitle) {
+    return b`<span class="${PREFIX}-therapeutic-alternative-title" data-test-id="title">Alternative Thérapeutique pour ${medicationTitle !== "" ? decodeHtml(medicationTitle) : "ce produit"}</span>`;
+  }
   render() {
     const containerClasses = [
       `${PREFIX}-therapeutic-alternative`,
@@ -3030,16 +3238,23 @@ let TherapeuticAlternative = class extends i$1 {
     const medicationTitle = getMedicationTitle(this.currentMedication);
     return b`
       <div class=${containerClasses} data-test-id="therapeutic-alternative-container">
-        ${this.hasTitle ? b`<span class="${PREFIX}-therapeutic-alternative-title">Alternative thérapeutique</span>` : ""}
         ${this.currentMedication ? b`
           <div class="${PREFIX}-therapeutic-alternative__source mb-3" data-test-id="source-product">
-            <span data-test-id="source-product-label">
-              Produit sélectionné : <span class="text-primary">${medicationTitle !== "" ? decodeHtml(medicationTitle) : "Inconnu"}</span>
-            </span>
-            <bcbd-button size="small" background-color="primary" outlined
-                         @click=${this.cancelAlternative} data-test-id="cancel-alternative-button">
-              Retour au contrôle d'ordonnance
-            </bcbd-button>
+            ${this.hasTitle ? this.renderTitle(medicationTitle) : b`
+              <span data-test-id="source-product-label">
+                Produit sélectionné : <span class="text-primary">${medicationTitle !== "" ? decodeHtml(medicationTitle) : "Inconnu"}</span>
+              </span>`}
+            <div class="${PREFIX}-therapeutic-alternative__source-actions">
+              <bcbd-button size="small" background-color="secondary" outlined
+                           ?disabled=${this.hasNoSelectedCriteria()}
+                           @click=${this.resetAllCriteria} data-test-id="reset-criteria-button">
+                Réinitialiser
+              </bcbd-button>
+              <bcbd-button size="small" background-color="primary" outlined
+                           @click=${this.cancelAlternative} data-test-id="cancel-alternative-button">
+                Annuler
+              </bcbd-button>
+            </div>
           </div>
 
           <div class="${PREFIX}-therapeutic-alternative__disclaimer">
@@ -3059,13 +3274,18 @@ let TherapeuticAlternative = class extends i$1 {
               </bcbd-alert>
             </div>` : ""}
 
-          <div class="${PREFIX}-therapeutic-alternative__section" data-test-id="inclusion-section">
-            ${this.renderSectionHeader("Rechercher une alternative", "inclusion")}
-            ${this.renderInclusionSection()}
+          <div class="${PREFIX}-therapeutic-alternative__section" data-test-id="scope-section">
+            ${this.renderSectionHeader("Rechercher une alternative", "scope")}
+            ${this.renderScopeSection()}
+          </div>
+
+          <div class="${PREFIX}-therapeutic-alternative__section" data-test-id="include-section">
+            ${this.renderSectionHeader("Critères d'inclusion", "include")}
+            ${this.renderIncludeSection()}
           </div>
 
           <div class="${PREFIX}-therapeutic-alternative__section" data-test-id="exclusion-section">
-            ${this.renderSectionHeader("Affiner (exclure des critères)", "exclusion")}
+            ${this.renderSectionHeader("Critères d'exclusion", "exclusion")}
             ${this.renderExclusionSection()}
           </div>
 
@@ -3077,6 +3297,7 @@ let TherapeuticAlternative = class extends i$1 {
           <div class="${PREFIX}-therapeutic-alternative__results" data-test-id="results-container">
             ${this.renderResults()}
           </div>` : b`
+          ${this.hasTitle ? this.renderTitle(medicationTitle) : ""}
           <div class="${PREFIX}-therapeutic-alternative__no-medication" data-test-id="no-medication-container">
               <bcbd-alert title-message="Pas de médicament sélectionné"
                           description-message="Un problème est survenu au moment de sélectionner le produit"
@@ -3118,6 +3339,9 @@ __decorateClass([
 __decorateClass([
   r()
 ], TherapeuticAlternative.prototype, "currentPage", 2);
+__decorateClass([
+  r()
+], TherapeuticAlternative.prototype, "scope", 2);
 __decorateClass([
   r()
 ], TherapeuticAlternative.prototype, "include", 2);
@@ -3127,6 +3351,12 @@ __decorateClass([
 __decorateClass([
   r()
 ], TherapeuticAlternative.prototype, "quickFilters", 2);
+__decorateClass([
+  r()
+], TherapeuticAlternative.prototype, "quickFilterFacets", 2);
+__decorateClass([
+  r()
+], TherapeuticAlternative.prototype, "scopeFacets", 2);
 __decorateClass([
   r()
 ], TherapeuticAlternative.prototype, "includeFacets", 2);
@@ -3139,6 +3369,9 @@ __decorateClass([
 __decorateClass([
   r()
 ], TherapeuticAlternative.prototype, "expandFacetGroupKey", 2);
+__decorateClass([
+  r()
+], TherapeuticAlternative.prototype, "scopeLabels", 2);
 __decorateClass([
   r()
 ], TherapeuticAlternative.prototype, "includeLabels", 2);
@@ -3147,10 +3380,13 @@ __decorateClass([
 ], TherapeuticAlternative.prototype, "excludeLabels", 2);
 __decorateClass([
   r()
-], TherapeuticAlternative.prototype, "openInclusionGroup", 2);
+], TherapeuticAlternative.prototype, "openScopeGroup", 2);
 __decorateClass([
   r()
 ], TherapeuticAlternative.prototype, "openExclusionGroup", 2);
+__decorateClass([
+  r()
+], TherapeuticAlternative.prototype, "openIncludeGroup", 2);
 __decorateClass([
   r()
 ], TherapeuticAlternative.prototype, "checklistSearchTerm", 2);

package/package.json

@@ -1,6 +1,6 @@
 {
   "name": "@claudebernard/therapeutic-alternative-element",
-  "version": "2.1.2",
+  "version": "2.3.0",
   "main": "dist/therapeutic-alternative.es.js",
   "module": "dist/therapeutic-alternative.es.js",
   "types": "dist/therapeutic-alternative.d.ts",