feat(search): configurable placeholder

datagouv-components/src/components/Search/GlobalSearch.vue

@@ -12,7 +12,7 @@
     >
       <SearchInput
         v-model="q"
-        :placeholder="placeholder || strategies[currentTypeConfig?.class ?? 'datasets'].placeholder"
+        :placeholder="resolvedPlaceholder"
       />
     </div>
     <div class="grid grid-cols-12 mt-2 md:mt-5">
@@ -398,7 +398,7 @@ import ReuseTypeFilter from './Filter/ReuseTypeFilter.vue'
 
 const props = withDefaults(defineProps<{
   config?: GlobalSearchConfig
-  placeholder?: string
+  placeholder?: string | null
   hideSearchInput?: boolean
 }>(), {
   config: getDefaultGlobalSearchConfig,
@@ -428,6 +428,15 @@ const currentTypeConfig = computed(() =>
   props.config.find(c => configKey(c) === currentType.value),
 )
 
+// Precedence: prop → per-type config → strategy default.
+// null at any level means "no placeholder".
+const resolvedPlaceholder = computed(() => {
+  if (props.placeholder !== undefined) return props.placeholder ?? ''
+  const cfg = currentTypeConfig.value
+  if (cfg && 'placeholder' in cfg) return cfg.placeholder ?? ''
+  return strategies[cfg?.class ?? 'datasets'].placeholder
+})
+
 const activeBasicFilters = computed(() =>
   (currentTypeConfig.value?.basicFilters ?? []) as string[],
 )

datagouv-components/src/components/Search/SearchInput.vue

@@ -13,8 +13,8 @@
       type="search"
       name="q"
       class="input max-h-12 m-0 rounded-tl shadow-input-blue"
-      :aria-label="placeholder || t('Rechercher...')"
-      :placeholder="placeholder || t('Rechercher...')"
+      :aria-label="placeholder === null ? t('Rechercher...') : placeholder ?? t('Rechercher...')"
+      :placeholder="placeholder === null ? undefined : placeholder ?? t('Rechercher...')"
     >
     <BrandedButton
       class="rounded-l-none rounded-br-none rounded-tr min-h-12"
@@ -38,7 +38,7 @@ import BrandedButton from '../BrandedButton.vue'
 const q = defineModel<string>({ required: true })
 
 withDefaults(defineProps<{
-  placeholder?: string
+  placeholder?: string | null
   autoFocus?: boolean
 }>(), {
   autoFocus: true,

datagouv-components/src/types/search.ts

@@ -298,6 +298,7 @@ export type DatasetSearchConfig = {
   class: 'datasets'
   key?: string
   name?: string
+  placeholder?: string | null
   hiddenFilters?: HiddenFilter<DatasetSearchFilters>[]
   basicFilters?: (keyof DatasetSearchFilters)[]
   advancedFilters?: (keyof DatasetSearchFilters)[]
@@ -308,6 +309,7 @@ export type DataserviceSearchConfig = {
   class: 'dataservices'
   key?: string
   name?: string
+  placeholder?: string | null
   hiddenFilters?: HiddenFilter<DataserviceSearchFilters>[]
   basicFilters?: (keyof DataserviceSearchFilters)[]
   advancedFilters?: (keyof DataserviceSearchFilters)[]
@@ -318,6 +320,7 @@ export type ReuseSearchConfig = {
   class: 'reuses'
   key?: string
   name?: string
+  placeholder?: string | null
   hiddenFilters?: HiddenFilter<ReuseSearchFilters>[]
   basicFilters?: (keyof ReuseSearchFilters)[]
   advancedFilters?: (keyof ReuseSearchFilters)[]
@@ -328,6 +331,7 @@ export type OrganizationSearchConfig = {
   class: 'organizations'
   key?: string
   name?: string
+  placeholder?: string | null
   hiddenFilters?: HiddenFilter<OrganizationSearchFilters>[]
   basicFilters?: (keyof OrganizationSearchFilters)[]
   advancedFilters?: (keyof OrganizationSearchFilters)[]
@@ -338,6 +342,7 @@ export type TopicSearchConfig = {
   class: 'topics'
   key?: string
   name?: string
+  placeholder?: string | null
   hiddenFilters?: HiddenFilter<TopicSearchFilters>[]
   basicFilters?: (keyof TopicSearchFilters)[]
   advancedFilters?: (keyof TopicSearchFilters)[]

pages/design/dataset-search.vue

@@ -32,12 +32,14 @@ const searchConfig: GlobalSearchConfig = [
     class: 'datasets',
     key: 'all-datasets',
     name: 'Tous les jeux de données',
+    placeholder: 'ex. budget de la ville de Paris',
     basicFilters: ['organization', 'organization_badge', 'tag', 'format', 'license', 'schema', 'geozone', 'granularity', 'badge'],
   },
   {
     class: 'datasets',
     key: 'inspire-datasets',
     name: 'Données INSPIRE',
+    placeholder: null,
     hiddenFilters: [{ key: 'badge', value: 'inspire' }],
     basicFilters: ['organization', 'organization_badge', 'tag', 'format', 'license', 'schema', 'geozone', 'granularity'],
   },