<script setup>
defineProps({
  search: { type: String, required: false },
  noPadding: { type: Boolean, required: false }
});
const emit = defineEmits(["update:search"]);
function update(event) {
  emit("update:search", event.target.value);
}
</script>

<template>
  <div flex="~ col gap2 wrap" border="b base" n-navbar-glass flex-1 :class="[{ p4: !noPadding }]">
    <div flex="~ gap4 wrap" items-center>
      <slot name="search">
        <NTextInput
          v-if="search !== void 0"
          placeholder="Search..."
          icon="carbon-search"
          n="primary" flex-auto
          :class="{ 'px-3 py-2': !noPadding }"
          :value="search"
          @input="update"
        />
      </slot>
      <slot name="actions" />
    </div>
    <slot />
  </div>
</template>
