@7pmlabs/design-system 2.0.8 → 2.1.0

package/dist/design-system132.js.map

@@ -0,0 +1 @@
+{"version":3,"file":"design-system132.js","names":["$slots"],"sources":["../src/components/BMasonry/BMasonry.vue"],"sourcesContent":["<script setup lang=\"ts\">\nimport { computed, onBeforeUnmount, onMounted, ref, watch } from 'vue';\nimport type {\n  BMasonryBreakpoint,\n  BMasonryClassNames,\n  BMasonryItem,\n  BMasonryLayoutChangePayload,\n  BMasonryResponsive,\n  BMasonryStyles,\n} from './types';\n\n// ─── Props ────────────────────────────────────────────────────────────────────\n\nconst {\n  columns = 3,\n  // eslint-disable-next-line vue/require-valid-default-prop\n  gutter = 0,\n  items = [],\n  fresh = false,\n  classNames,\n  styles,\n} = defineProps<{\n  /**\n   * Number of columns. Accepts a fixed number or a breakpoint map.\n   * @example 3\n   * @example { xs: 1, sm: 2, md: 3, lg: 4 }\n   * @default 3\n   */\n  columns?: BMasonryResponsive;\n\n  /**\n   * Gap between items in pixels. Accepts a fixed value, a [colGap, rowGap] tuple,\n   * or a breakpoint map for responsive gaps.\n   * @example 16\n   * @example [16, 8]\n   * @example { xs: 8, md: 16 }\n   * @default 0\n   */\n  gutter?: BMasonryResponsive | [BMasonryResponsive, BMasonryResponsive];\n\n  /**\n   * Array of masonry items to render.\n   * @default []\n   */\n  items?: BMasonryItem[];\n\n  /**\n   * When true, observe every item's size so the layout re-flows when children resize.\n   * Requires ResizeObserver support; degrades gracefully when unavailable.\n   * @default false\n   */\n  fresh?: boolean;\n\n  /**\n   * Customize CSS classes on semantic DOM elements (`root`, `column`, `item`).\n   * Can be a plain object or a per-item function `(item, columnIndex) => classes`.\n   */\n  classNames?: BMasonryClassNames;\n\n  /**\n   * Customize inline styles on semantic DOM elements (`root`, `column`, `item`).\n   * Can be a plain object or a per-item function `(item, columnIndex) => styles`.\n   */\n  styles?: BMasonryStyles;\n}>();\n\n// ─── Emits ────────────────────────────────────────────────────────────────────\n\nconst emit = defineEmits<{\n  /**\n   * Fires after each layout recalculation with the resolved column count and\n   * the column assignment map (item key → 0-based column index).\n   */\n  layoutChange: [payload: BMasonryLayoutChangePayload];\n}>();\n\n// ─── Slots ────────────────────────────────────────────────────────────────────\n\ndefineSlots<{\n  /**\n   * Custom rendering for each item. Receives `{ item: BMasonryItem, index: number, column: number }`.\n   */\n  item?: (props: { item: BMasonryItem; index: number; column: number }) => unknown;\n\n  /**\n   * Default slot used when no `items` prop is provided — raw child nodes are\n   * distributed across columns automatically.\n   */\n  default?: (props: Record<string, never>) => unknown;\n}>();\n\n// ─── Responsive helpers ───────────────────────────────────────────────────────\n\nconst BREAKPOINTS: Record<BMasonryBreakpoint, number> = {\n  xs: 0,\n  sm: 576,\n  md: 768,\n  lg: 992,\n  xl: 1200,\n  xxl: 1600,\n};\n\nfunction resolveResponsive(value: BMasonryResponsive, width: number): number {\n  if (typeof value === 'number') return Math.max(1, value);\n\n  // Breakpoint map — pick the largest breakpoint that still fits\n  const keys = (Object.keys(BREAKPOINTS) as BMasonryBreakpoint[]).sort(\n    (a, b) => BREAKPOINTS[b] - BREAKPOINTS[a],\n  );\n\n  for (const bp of keys) {\n    if (width >= BREAKPOINTS[bp] && value[bp] !== undefined) {\n      return Math.max(1, value[bp]!);\n    }\n  }\n  // Fallback to smallest defined value\n  const smallest = (Object.keys(value) as BMasonryBreakpoint[]).sort(\n    (a, b) => BREAKPOINTS[a] - BREAKPOINTS[b],\n  )[0];\n  return smallest ? Math.max(1, value[smallest]!) : 1;\n}\n\n// ─── Container width tracking ─────────────────────────────────────────────────\n\nconst rootEl = ref<HTMLElement | null>(null);\nconst containerWidth = ref(0);\n\nlet containerObserver: ResizeObserver | null = null;\n\nfunction updateWidth() {\n  if (rootEl.value) {\n    containerWidth.value = rootEl.value.offsetWidth;\n  }\n}\n\n// ─── Item height tracking (fresh mode) ────────────────────────────────────────\n\nconst itemHeights = ref<Record<string | number, number>>({});\nlet itemObserver: ResizeObserver | null = null;\nconst itemEls = ref<Map<string | number, Element>>(new Map());\n\nfunction registerItemEl(key: string | number, el: Element | null) {\n  if (el) {\n    itemEls.value.set(key, el);\n    if (fresh && itemObserver) {\n      itemObserver.observe(el);\n    }\n  } else {\n    const old = itemEls.value.get(key);\n    if (old && itemObserver) itemObserver.unobserve(old);\n    itemEls.value.delete(key);\n    const next = { ...itemHeights.value };\n    delete next[key];\n    itemHeights.value = next;\n  }\n}\n\nfunction setupItemObserver() {\n  if (!fresh || typeof ResizeObserver === 'undefined') return;\n  itemObserver = new ResizeObserver((entries) => {\n    let changed = false;\n    for (const entry of entries) {\n      const el = entry.target as HTMLElement;\n      const key = el.dataset.masonryKey;\n      if (key !== undefined) {\n        const h = entry.contentRect.height;\n        if (itemHeights.value[key] !== h) {\n          itemHeights.value = { ...itemHeights.value, [key]: h };\n          changed = true;\n        }\n      }\n    }\n    if (changed) {\n      // trigger layout recompute (handled reactively via computed)\n    }\n  });\n  // Observe any already-mounted elements\n  itemEls.value.forEach((el) => itemObserver!.observe(el));\n}\n\n// ─── Core layout algorithm ────────────────────────────────────────────────────\n\nconst resolvedColumns = computed(() => resolveResponsive(columns, containerWidth.value));\n\nconst resolvedGutter = computed<[number, number]>(() => {\n  const g = gutter;\n  if (Array.isArray(g)) {\n    const colGap = resolveResponsive(g[0] as BMasonryResponsive, containerWidth.value);\n    const rowGap = resolveResponsive(g[1] as BMasonryResponsive, containerWidth.value);\n    return [colGap, rowGap];\n  }\n  const v = resolveResponsive(g as BMasonryResponsive, containerWidth.value);\n  return [v, v];\n});\n\n/** Distribute items across columns using the \"shortest column first\" strategy. */\nconst columnBuckets = computed<{ item: BMasonryItem; originalIndex: number }[][]>(() => {\n  const cols = resolvedColumns.value;\n  const buckets: { item: BMasonryItem; originalIndex: number }[][] = Array.from(\n    { length: cols },\n    () => [],\n  );\n  const heights = Array<number>(cols).fill(0);\n  const [, rowGap] = resolvedGutter.value;\n\n  for (let i = 0; i < items.length; i++) {\n    const item = items[i];\n    let targetCol: number;\n\n    if (item.column !== undefined) {\n      // Pinned column (1-based → 0-based, clamped)\n      targetCol = Math.max(0, Math.min(cols - 1, item.column - 1));\n    } else {\n      // Shortest column\n      targetCol = heights.indexOf(Math.min(...heights));\n    }\n\n    buckets[targetCol].push({ item, originalIndex: i });\n    const h = itemHeights.value[item.key] ?? item.height ?? 0;\n    heights[targetCol] += h + (buckets[targetCol].length > 1 ? rowGap : 0);\n  }\n\n  return buckets;\n});\n\nconst layoutColumnMap = computed(() => {\n  const cols = resolvedColumns.value;\n  const map: Record<string | number, number> = {};\n  for (let i = 0; i < items.length; i++) {\n    const item = items[i];\n    const bucket = columnBuckets.value.findIndex((b) =>\n      b.some((entry) => entry.item.key === item.key),\n    );\n    if (bucket >= 0) map[item.key] = bucket;\n  }\n  return { columns: cols, columnMap: map };\n});\n\nwatch(layoutColumnMap, (val) => {\n  emit('layoutChange', val);\n}, { immediate: true });\n\n// ─── CSS class/style helpers ──────────────────────────────────────────────────\n\nfunction getItemClasses(item: BMasonryItem, columnIndex: number) {\n  const base = ['b-masonry__item'];\n  if (!classNames) return base;\n\n  if (typeof classNames === 'function') {\n    const extra = classNames(item, columnIndex);\n    if (extra) base.push(...(Array.isArray(extra) ? extra : [extra as string]));\n  } else if (typeof classNames.item === 'function') {\n    const extra = classNames.item(item, columnIndex);\n    if (extra) base.push(...(Array.isArray(extra) ? extra : [extra as string]));\n  } else if (typeof classNames.item === 'string') {\n    base.push(classNames.item);\n  }\n  return base;\n}\n\nfunction getItemStyles(item: BMasonryItem, columnIndex: number): Record<string, string> {\n  if (!styles) return {};\n  if (typeof styles === 'function') return styles(item, columnIndex) ?? {};\n  if (typeof styles.item === 'function') return styles.item(item, columnIndex) ?? {};\n  if (styles.item && typeof styles.item === 'object') return styles.item as Record<string, string>;\n  return {};\n}\n\nfunction getColumnClasses(_colIndex: number): string[] {\n  const base = ['b-masonry__column'];\n  if (!classNames || typeof classNames === 'function') return base;\n  if (classNames.column) base.push(classNames.column);\n  return base;\n}\n\nfunction getColumnStyles(_colIndex: number): Record<string, string> {\n  if (!styles || typeof styles === 'function') return {};\n  return (styles.column as Record<string, string>) ?? {};\n}\n\nconst rootClasses = computed(() => {\n  const base = ['b-masonry'];\n  if (!classNames || typeof classNames === 'function') return base;\n  if (classNames.root) base.push(classNames.root);\n  return base;\n});\n\nconst rootStyles = computed(() => {\n  const base: Record<string, string> = {\n    '--b-masonry-columns': String(resolvedColumns.value),\n    '--b-masonry-col-gap': `${resolvedGutter.value[0]}px`,\n    '--b-masonry-row-gap': `${resolvedGutter.value[1]}px`,\n  };\n  if (styles && typeof styles === 'object' && !('root' in styles) === false) {\n    const s = styles as { root?: Record<string, string> };\n    if (s.root) Object.assign(base, s.root);\n  }\n  return base;\n});\n\n// ─── Lifecycle ────────────────────────────────────────────────────────────────\n\nonMounted(() => {\n  updateWidth();\n\n  if (typeof ResizeObserver !== 'undefined') {\n    containerObserver = new ResizeObserver(() => updateWidth());\n    if (rootEl.value) containerObserver.observe(rootEl.value);\n  } else {\n    // SSR / no ResizeObserver: listen to window resize\n    window.addEventListener('resize', updateWidth);\n  }\n\n  if (fresh) setupItemObserver();\n});\n\nwatch(\n  () => fresh,\n  (enabled) => {\n    if (enabled) {\n      setupItemObserver();\n    } else {\n      itemObserver?.disconnect();\n      itemObserver = null;\n      itemHeights.value = {};\n    }\n  },\n);\n\nonBeforeUnmount(() => {\n  containerObserver?.disconnect();\n  itemObserver?.disconnect();\n  window.removeEventListener('resize', updateWidth);\n});\n</script>\n\n<template>\n  <!-- role=\"list\" lets screen readers announce item count -->\n  <div\n    ref=\"rootEl\"\n    :class=\"rootClasses\"\n    :style=\"rootStyles\"\n    role=\"list\"\n    aria-label=\"Masonry layout\"\n  >\n    <!-- Column-based layout: each column is a flex column -->\n    <div\n      v-for=\"(bucket, colIdx) in columnBuckets\"\n      :key=\"colIdx\"\n      :class=\"getColumnClasses(colIdx)\"\n      :style=\"getColumnStyles(colIdx)\"\n      role=\"presentation\"\n    >\n      <div\n        v-for=\"{ item, originalIndex } in bucket\"\n        :key=\"item.key\"\n        :ref=\"(el) => registerItemEl(item.key, el as Element | null)\"\n        :data-masonry-key=\"item.key\"\n        :class=\"getItemClasses(item, colIdx)\"\n        :style=\"getItemStyles(item, colIdx)\"\n        role=\"listitem\"\n      >\n        <!-- Named item slot (prop-driven items) -->\n        <slot v-if=\"$slots.item\" name=\"item\" :item=\"item\" :index=\"originalIndex\" :column=\"colIdx\" />\n        <!-- Default slot fallback when using raw children (no items prop) -->\n        <template v-else>\n          <slot />\n        </template>\n      </div>\n    </div>\n  </div>\n</template>\n\n<style>\n/* ─────────────────────────────────────────────────────────────────────────────\n   BMasonry — CSS custom properties (scoped to component root)\n   ───────────────────────────────────────────────────────────────────────────── */\n.b-masonry {\n  /* Layout tokens */\n  --b-masonry-columns: 3;\n  --b-masonry-col-gap: 0px;\n  --b-masonry-row-gap: 0px;\n\n  /* Item tokens */\n  --b-masonry-item-transition-duration: 200ms;\n  --b-masonry-item-transition-timing: ease;\n  --b-masonry-item-border-radius: 0px;\n  --b-masonry-item-bg: transparent;\n\n  /* ── Layout ── */\n  display: flex;\n  flex-direction: row;\n  align-items: flex-start;\n  gap: var(--b-masonry-col-gap);\n  width: 100%;\n  box-sizing: border-box;\n}\n\n/* ── Column ── */\n.b-masonry__column {\n  display: flex;\n  flex: 1 1 0;\n  min-width: 0;\n  flex-direction: column;\n  gap: var(--b-masonry-row-gap);\n}\n\n/* ── Item ── */\n.b-masonry__item {\n  width: 100%;\n  box-sizing: border-box;\n  background: var(--b-masonry-item-bg);\n  border-radius: var(--b-masonry-item-border-radius);\n  transition:\n    transform var(--b-masonry-item-transition-duration) var(--b-masonry-item-transition-timing),\n    opacity var(--b-masonry-item-transition-duration) var(--b-masonry-item-transition-timing);\n}\n\n/* ── Dark mode ── */\n[data-prefers-color='dark'] .b-masonry {\n  /* Tokens that shift in dark mode — override as needed by the consumer */\n  --b-masonry-item-bg: transparent;\n}\n\n@media (prefers-color-scheme: dark) {\n  [data-prefers-color='system'] .b-masonry {\n    /* Tokens that shift in dark mode — override as needed by the consumer */\n    --b-masonry-item-bg: transparent;\n  }\n}\n\n/* ── Reduced motion ── */\n@media (prefers-reduced-motion: reduce) {\n  .b-masonry {\n    --b-masonry-item-transition-duration: 0ms;\n  }\n}\n</style>\n"],"mappings":"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"}

package/dist/design-system134.js

@@ -1,45 +1,8 @@
-import { BMenuContextKey as e } from "./design-system130.js";
-import t from "./design-system133.js";
-import { Fragment as n, createBlock as r, createCommentVNode as i, createElementBlock as a, createElementVNode as o, createTextVNode as s, defineComponent as c, inject as l, openBlock as u, renderList as d, renderSlot as f, toDisplayString as p, unref as m } from "vue";
-//#region src/components/BMenu/BMenuItemGroup.vue?vue&type=script&setup=true&lang.ts
-var h = {
-	class: "b-menu-item-group",
-	role: "presentation"
-}, g = {
-	key: 0,
-	class: "b-menu-item-group__title",
-	role: "presentation"
-}, _ = ["aria-label"], v = /* @__PURE__ */ c({
-	__name: "BMenuItemGroup",
-	props: {
-		label: { default: "" },
-		children: { default: () => [] }
-	},
-	setup(c) {
-		let v = c, y = l(e);
-		return (e, c) => (u(), a("li", h, [m(y).inlineCollapsed.value ? i("", !0) : (u(), a("div", g, [f(e.$slots, "title", {}, () => [s(p(v.label), 1)])])), o("ul", {
-			class: "b-menu-item-group__list",
-			role: "group",
-			"aria-label": v.label
-		}, [f(e.$slots, "default", {}, () => [(u(!0), a(n, null, d(v.children, (e) => (u(), r(t, {
-			key: e.key,
-			"item-key": e.key,
-			label: e.label,
-			icon: e.icon,
-			disabled: e.disabled,
-			danger: e.danger,
-			extra: e.extra
-		}, null, 8, [
-			"item-key",
-			"label",
-			"icon",
-			"disabled",
-			"danger",
-			"extra"
-		]))), 128))])], 8, _)]));
-	}
-});
+import e from "./design-system132.js";
+/* empty css                 */
+//#region src/components/BMasonry/BMasonry.vue
+var t = e;
 //#endregion
-export { v as default };
+export { t as default };
 
 //# sourceMappingURL=design-system134.js.map

package/dist/design-system134.js.map

@@ -1 +1 @@
-{"version":3,"file":"design-system134.js","names":[],"sources":["../src/components/BMenu/BMenuItemGroup.vue"],"sourcesContent":["<script setup lang=\"ts\">\nimport { inject } from 'vue';\nimport BMenuItem from './BMenuItem.vue';\nimport { BMenuContextKey, type BMenuContext, type BMenuItemType } from './types';\n\n// ─────────────────────────────────────────────\n// Props\n// ─────────────────────────────────────────────\nconst props = withDefaults(\n  defineProps<{\n    /** Group title label. */\n    label?: string;\n    /** Items within this group. */\n    children?: BMenuItemType[];\n  }>(),\n  {\n    label: '',\n    children: () => [],\n  },\n);\n\ndefineSlots<{\n  default?(): unknown;\n  title?(): unknown;\n}>();\n\nconst menu = inject<BMenuContext>(BMenuContextKey)!;\n</script>\n\n<template>\n  <li class=\"b-menu-item-group\" role=\"presentation\">\n    <div v-if=\"!menu.inlineCollapsed.value\" class=\"b-menu-item-group__title\" role=\"presentation\">\n      <slot name=\"title\">{{ props.label }}</slot>\n    </div>\n    <ul class=\"b-menu-item-group__list\" role=\"group\" :aria-label=\"props.label\">\n      <slot>\n        <BMenuItem\n          v-for=\"item in props.children\"\n          :key=\"item.key\"\n          :item-key=\"item.key\"\n          :label=\"item.label\"\n          :icon=\"item.icon\"\n          :disabled=\"item.disabled\"\n          :danger=\"item.danger\"\n          :extra=\"item.extra\"\n        />\n      </slot>\n    </ul>\n  </li>\n</template>\n\n<style>\n/* ─────────────────────────────────────────────\n   BMenuItemGroup\n   ───────────────────────────────────────────── */\n.b-menu-item-group {\n  list-style: none;\n}\n\n.b-menu-item-group__title {\n  padding: 8px 16px 4px;\n  color: var(--b-menu-group-title-color);\n  font-size: var(--b-menu-group-title-font-size);\n  line-height: var(--b-menu-group-title-line-height);\n  font-weight: 500;\n  white-space: nowrap;\n  overflow: hidden;\n  text-overflow: ellipsis;\n}\n\n.b-menu-item-group__list {\n  list-style: none;\n  padding: 0;\n  margin: 0;\n}\n</style>\n"],"mappings":";;;;;;;;;;;;;;;;;;EAQA,IAAM,IAAQ,GAkBR,IAAO,EAAqB,EAAgB;yBAIhD,EAkBK,MAlBL,GAkBK,CAjBS,EAAA,EAAI,CAAC,gBAAgB,QACE,EAAA,IAAA,GAAA,IADF,GAAA,EAAjC,EAEM,OAFN,GAEM,CADJ,EAA2C,EAAA,QAAA,SAAA,EAAA,QAAA,CAAA,EAAA,EAArB,EAAM,MAAK,EAAA,EAAA,CAAA,CAAA,CAAA,CAAA,GAEnC,EAaK,MAAA;GAbD,OAAM;GAA0B,MAAK;GAAS,cAAY,EAAM;MAClE,EAWO,EAAA,QAAA,WAAA,EAAA,QAAA,EAAA,EAAA,GAAA,EAVL,EASE,GAAA,MAAA,EARe,EAAM,WAAd,YADT,EASE,GAAA;GAPC,KAAK,EAAK;GACV,YAAU,EAAK;GACf,OAAO,EAAK;GACZ,MAAM,EAAK;GACX,UAAU,EAAK;GACf,QAAQ,EAAK;GACb,OAAO,EAAK"}
+{"version":3,"file":"design-system134.js","names":[],"sources":["../src/components/BMasonry/BMasonry.vue"],"sourcesContent":["<script setup lang=\"ts\">\nimport { computed, onBeforeUnmount, onMounted, ref, watch } from 'vue';\nimport type {\n  BMasonryBreakpoint,\n  BMasonryClassNames,\n  BMasonryItem,\n  BMasonryLayoutChangePayload,\n  BMasonryResponsive,\n  BMasonryStyles,\n} from './types';\n\n// ─── Props ────────────────────────────────────────────────────────────────────\n\nconst {\n  columns = 3,\n  // eslint-disable-next-line vue/require-valid-default-prop\n  gutter = 0,\n  items = [],\n  fresh = false,\n  classNames,\n  styles,\n} = defineProps<{\n  /**\n   * Number of columns. Accepts a fixed number or a breakpoint map.\n   * @example 3\n   * @example { xs: 1, sm: 2, md: 3, lg: 4 }\n   * @default 3\n   */\n  columns?: BMasonryResponsive;\n\n  /**\n   * Gap between items in pixels. Accepts a fixed value, a [colGap, rowGap] tuple,\n   * or a breakpoint map for responsive gaps.\n   * @example 16\n   * @example [16, 8]\n   * @example { xs: 8, md: 16 }\n   * @default 0\n   */\n  gutter?: BMasonryResponsive | [BMasonryResponsive, BMasonryResponsive];\n\n  /**\n   * Array of masonry items to render.\n   * @default []\n   */\n  items?: BMasonryItem[];\n\n  /**\n   * When true, observe every item's size so the layout re-flows when children resize.\n   * Requires ResizeObserver support; degrades gracefully when unavailable.\n   * @default false\n   */\n  fresh?: boolean;\n\n  /**\n   * Customize CSS classes on semantic DOM elements (`root`, `column`, `item`).\n   * Can be a plain object or a per-item function `(item, columnIndex) => classes`.\n   */\n  classNames?: BMasonryClassNames;\n\n  /**\n   * Customize inline styles on semantic DOM elements (`root`, `column`, `item`).\n   * Can be a plain object or a per-item function `(item, columnIndex) => styles`.\n   */\n  styles?: BMasonryStyles;\n}>();\n\n// ─── Emits ────────────────────────────────────────────────────────────────────\n\nconst emit = defineEmits<{\n  /**\n   * Fires after each layout recalculation with the resolved column count and\n   * the column assignment map (item key → 0-based column index).\n   */\n  layoutChange: [payload: BMasonryLayoutChangePayload];\n}>();\n\n// ─── Slots ────────────────────────────────────────────────────────────────────\n\ndefineSlots<{\n  /**\n   * Custom rendering for each item. Receives `{ item: BMasonryItem, index: number, column: number }`.\n   */\n  item?: (props: { item: BMasonryItem; index: number; column: number }) => unknown;\n\n  /**\n   * Default slot used when no `items` prop is provided — raw child nodes are\n   * distributed across columns automatically.\n   */\n  default?: (props: Record<string, never>) => unknown;\n}>();\n\n// ─── Responsive helpers ───────────────────────────────────────────────────────\n\nconst BREAKPOINTS: Record<BMasonryBreakpoint, number> = {\n  xs: 0,\n  sm: 576,\n  md: 768,\n  lg: 992,\n  xl: 1200,\n  xxl: 1600,\n};\n\nfunction resolveResponsive(value: BMasonryResponsive, width: number): number {\n  if (typeof value === 'number') return Math.max(1, value);\n\n  // Breakpoint map — pick the largest breakpoint that still fits\n  const keys = (Object.keys(BREAKPOINTS) as BMasonryBreakpoint[]).sort(\n    (a, b) => BREAKPOINTS[b] - BREAKPOINTS[a],\n  );\n\n  for (const bp of keys) {\n    if (width >= BREAKPOINTS[bp] && value[bp] !== undefined) {\n      return Math.max(1, value[bp]!);\n    }\n  }\n  // Fallback to smallest defined value\n  const smallest = (Object.keys(value) as BMasonryBreakpoint[]).sort(\n    (a, b) => BREAKPOINTS[a] - BREAKPOINTS[b],\n  )[0];\n  return smallest ? Math.max(1, value[smallest]!) : 1;\n}\n\n// ─── Container width tracking ─────────────────────────────────────────────────\n\nconst rootEl = ref<HTMLElement | null>(null);\nconst containerWidth = ref(0);\n\nlet containerObserver: ResizeObserver | null = null;\n\nfunction updateWidth() {\n  if (rootEl.value) {\n    containerWidth.value = rootEl.value.offsetWidth;\n  }\n}\n\n// ─── Item height tracking (fresh mode) ────────────────────────────────────────\n\nconst itemHeights = ref<Record<string | number, number>>({});\nlet itemObserver: ResizeObserver | null = null;\nconst itemEls = ref<Map<string | number, Element>>(new Map());\n\nfunction registerItemEl(key: string | number, el: Element | null) {\n  if (el) {\n    itemEls.value.set(key, el);\n    if (fresh && itemObserver) {\n      itemObserver.observe(el);\n    }\n  } else {\n    const old = itemEls.value.get(key);\n    if (old && itemObserver) itemObserver.unobserve(old);\n    itemEls.value.delete(key);\n    const next = { ...itemHeights.value };\n    delete next[key];\n    itemHeights.value = next;\n  }\n}\n\nfunction setupItemObserver() {\n  if (!fresh || typeof ResizeObserver === 'undefined') return;\n  itemObserver = new ResizeObserver((entries) => {\n    let changed = false;\n    for (const entry of entries) {\n      const el = entry.target as HTMLElement;\n      const key = el.dataset.masonryKey;\n      if (key !== undefined) {\n        const h = entry.contentRect.height;\n        if (itemHeights.value[key] !== h) {\n          itemHeights.value = { ...itemHeights.value, [key]: h };\n          changed = true;\n        }\n      }\n    }\n    if (changed) {\n      // trigger layout recompute (handled reactively via computed)\n    }\n  });\n  // Observe any already-mounted elements\n  itemEls.value.forEach((el) => itemObserver!.observe(el));\n}\n\n// ─── Core layout algorithm ────────────────────────────────────────────────────\n\nconst resolvedColumns = computed(() => resolveResponsive(columns, containerWidth.value));\n\nconst resolvedGutter = computed<[number, number]>(() => {\n  const g = gutter;\n  if (Array.isArray(g)) {\n    const colGap = resolveResponsive(g[0] as BMasonryResponsive, containerWidth.value);\n    const rowGap = resolveResponsive(g[1] as BMasonryResponsive, containerWidth.value);\n    return [colGap, rowGap];\n  }\n  const v = resolveResponsive(g as BMasonryResponsive, containerWidth.value);\n  return [v, v];\n});\n\n/** Distribute items across columns using the \"shortest column first\" strategy. */\nconst columnBuckets = computed<{ item: BMasonryItem; originalIndex: number }[][]>(() => {\n  const cols = resolvedColumns.value;\n  const buckets: { item: BMasonryItem; originalIndex: number }[][] = Array.from(\n    { length: cols },\n    () => [],\n  );\n  const heights = Array<number>(cols).fill(0);\n  const [, rowGap] = resolvedGutter.value;\n\n  for (let i = 0; i < items.length; i++) {\n    const item = items[i];\n    let targetCol: number;\n\n    if (item.column !== undefined) {\n      // Pinned column (1-based → 0-based, clamped)\n      targetCol = Math.max(0, Math.min(cols - 1, item.column - 1));\n    } else {\n      // Shortest column\n      targetCol = heights.indexOf(Math.min(...heights));\n    }\n\n    buckets[targetCol].push({ item, originalIndex: i });\n    const h = itemHeights.value[item.key] ?? item.height ?? 0;\n    heights[targetCol] += h + (buckets[targetCol].length > 1 ? rowGap : 0);\n  }\n\n  return buckets;\n});\n\nconst layoutColumnMap = computed(() => {\n  const cols = resolvedColumns.value;\n  const map: Record<string | number, number> = {};\n  for (let i = 0; i < items.length; i++) {\n    const item = items[i];\n    const bucket = columnBuckets.value.findIndex((b) =>\n      b.some((entry) => entry.item.key === item.key),\n    );\n    if (bucket >= 0) map[item.key] = bucket;\n  }\n  return { columns: cols, columnMap: map };\n});\n\nwatch(layoutColumnMap, (val) => {\n  emit('layoutChange', val);\n}, { immediate: true });\n\n// ─── CSS class/style helpers ──────────────────────────────────────────────────\n\nfunction getItemClasses(item: BMasonryItem, columnIndex: number) {\n  const base = ['b-masonry__item'];\n  if (!classNames) return base;\n\n  if (typeof classNames === 'function') {\n    const extra = classNames(item, columnIndex);\n    if (extra) base.push(...(Array.isArray(extra) ? extra : [extra as string]));\n  } else if (typeof classNames.item === 'function') {\n    const extra = classNames.item(item, columnIndex);\n    if (extra) base.push(...(Array.isArray(extra) ? extra : [extra as string]));\n  } else if (typeof classNames.item === 'string') {\n    base.push(classNames.item);\n  }\n  return base;\n}\n\nfunction getItemStyles(item: BMasonryItem, columnIndex: number): Record<string, string> {\n  if (!styles) return {};\n  if (typeof styles === 'function') return styles(item, columnIndex) ?? {};\n  if (typeof styles.item === 'function') return styles.item(item, columnIndex) ?? {};\n  if (styles.item && typeof styles.item === 'object') return styles.item as Record<string, string>;\n  return {};\n}\n\nfunction getColumnClasses(_colIndex: number): string[] {\n  const base = ['b-masonry__column'];\n  if (!classNames || typeof classNames === 'function') return base;\n  if (classNames.column) base.push(classNames.column);\n  return base;\n}\n\nfunction getColumnStyles(_colIndex: number): Record<string, string> {\n  if (!styles || typeof styles === 'function') return {};\n  return (styles.column as Record<string, string>) ?? {};\n}\n\nconst rootClasses = computed(() => {\n  const base = ['b-masonry'];\n  if (!classNames || typeof classNames === 'function') return base;\n  if (classNames.root) base.push(classNames.root);\n  return base;\n});\n\nconst rootStyles = computed(() => {\n  const base: Record<string, string> = {\n    '--b-masonry-columns': String(resolvedColumns.value),\n    '--b-masonry-col-gap': `${resolvedGutter.value[0]}px`,\n    '--b-masonry-row-gap': `${resolvedGutter.value[1]}px`,\n  };\n  if (styles && typeof styles === 'object' && !('root' in styles) === false) {\n    const s = styles as { root?: Record<string, string> };\n    if (s.root) Object.assign(base, s.root);\n  }\n  return base;\n});\n\n// ─── Lifecycle ────────────────────────────────────────────────────────────────\n\nonMounted(() => {\n  updateWidth();\n\n  if (typeof ResizeObserver !== 'undefined') {\n    containerObserver = new ResizeObserver(() => updateWidth());\n    if (rootEl.value) containerObserver.observe(rootEl.value);\n  } else {\n    // SSR / no ResizeObserver: listen to window resize\n    window.addEventListener('resize', updateWidth);\n  }\n\n  if (fresh) setupItemObserver();\n});\n\nwatch(\n  () => fresh,\n  (enabled) => {\n    if (enabled) {\n      setupItemObserver();\n    } else {\n      itemObserver?.disconnect();\n      itemObserver = null;\n      itemHeights.value = {};\n    }\n  },\n);\n\nonBeforeUnmount(() => {\n  containerObserver?.disconnect();\n  itemObserver?.disconnect();\n  window.removeEventListener('resize', updateWidth);\n});\n</script>\n\n<template>\n  <!-- role=\"list\" lets screen readers announce item count -->\n  <div\n    ref=\"rootEl\"\n    :class=\"rootClasses\"\n    :style=\"rootStyles\"\n    role=\"list\"\n    aria-label=\"Masonry layout\"\n  >\n    <!-- Column-based layout: each column is a flex column -->\n    <div\n      v-for=\"(bucket, colIdx) in columnBuckets\"\n      :key=\"colIdx\"\n      :class=\"getColumnClasses(colIdx)\"\n      :style=\"getColumnStyles(colIdx)\"\n      role=\"presentation\"\n    >\n      <div\n        v-for=\"{ item, originalIndex } in bucket\"\n        :key=\"item.key\"\n        :ref=\"(el) => registerItemEl(item.key, el as Element | null)\"\n        :data-masonry-key=\"item.key\"\n        :class=\"getItemClasses(item, colIdx)\"\n        :style=\"getItemStyles(item, colIdx)\"\n        role=\"listitem\"\n      >\n        <!-- Named item slot (prop-driven items) -->\n        <slot v-if=\"$slots.item\" name=\"item\" :item=\"item\" :index=\"originalIndex\" :column=\"colIdx\" />\n        <!-- Default slot fallback when using raw children (no items prop) -->\n        <template v-else>\n          <slot />\n        </template>\n      </div>\n    </div>\n  </div>\n</template>\n\n<style>\n/* ─────────────────────────────────────────────────────────────────────────────\n   BMasonry — CSS custom properties (scoped to component root)\n   ───────────────────────────────────────────────────────────────────────────── */\n.b-masonry {\n  /* Layout tokens */\n  --b-masonry-columns: 3;\n  --b-masonry-col-gap: 0px;\n  --b-masonry-row-gap: 0px;\n\n  /* Item tokens */\n  --b-masonry-item-transition-duration: 200ms;\n  --b-masonry-item-transition-timing: ease;\n  --b-masonry-item-border-radius: 0px;\n  --b-masonry-item-bg: transparent;\n\n  /* ── Layout ── */\n  display: flex;\n  flex-direction: row;\n  align-items: flex-start;\n  gap: var(--b-masonry-col-gap);\n  width: 100%;\n  box-sizing: border-box;\n}\n\n/* ── Column ── */\n.b-masonry__column {\n  display: flex;\n  flex: 1 1 0;\n  min-width: 0;\n  flex-direction: column;\n  gap: var(--b-masonry-row-gap);\n}\n\n/* ── Item ── */\n.b-masonry__item {\n  width: 100%;\n  box-sizing: border-box;\n  background: var(--b-masonry-item-bg);\n  border-radius: var(--b-masonry-item-border-radius);\n  transition:\n    transform var(--b-masonry-item-transition-duration) var(--b-masonry-item-transition-timing),\n    opacity var(--b-masonry-item-transition-duration) var(--b-masonry-item-transition-timing);\n}\n\n/* ── Dark mode ── */\n[data-prefers-color='dark'] .b-masonry {\n  /* Tokens that shift in dark mode — override as needed by the consumer */\n  --b-masonry-item-bg: transparent;\n}\n\n@media (prefers-color-scheme: dark) {\n  [data-prefers-color='system'] .b-masonry {\n    /* Tokens that shift in dark mode — override as needed by the consumer */\n    --b-masonry-item-bg: transparent;\n  }\n}\n\n/* ── Reduced motion ── */\n@media (prefers-reduced-motion: reduce) {\n  .b-masonry {\n    --b-masonry-item-transition-duration: 0ms;\n  }\n}\n</style>\n"],"mappings":""}

package/dist/design-system135.js

@@ -0,0 +1,12 @@
+//#region src/components/BMentions/types.ts
+var e = /* @__PURE__ */ function(e) {
+	return e.Error = "error", e.Warning = "warning", e;
+}({}), t = /* @__PURE__ */ function(e) {
+	return e.Outlined = "outlined", e.Filled = "filled", e.Borderless = "borderless", e;
+}({}), n = /* @__PURE__ */ function(e) {
+	return e.Top = "top", e.Bottom = "bottom", e;
+}({});
+//#endregion
+export { n as BMentionsPlacement, e as BMentionsStatus, t as BMentionsVariant };
+
+//# sourceMappingURL=design-system135.js.map

package/dist/design-system135.js.map

@@ -0,0 +1 @@
+{"version":3,"file":"design-system135.js","names":[],"sources":["../src/components/BMentions/types.ts"],"sourcesContent":["export interface BMentionsOption {\n  /** Display label for the mention suggestion. Falls back to `value` if omitted. */\n  label?: string;\n  /** The value inserted when this option is selected. */\n  value: string;\n  /** Whether this option is disabled. */\n  disabled?: boolean;\n}\n\nexport enum BMentionsStatus {\n  Error = 'error',\n  Warning = 'warning',\n}\n\nexport enum BMentionsVariant {\n  Outlined = 'outlined',\n  Filled = 'filled',\n  Borderless = 'borderless',\n}\n\nexport enum BMentionsPlacement {\n  Top = 'top',\n  Bottom = 'bottom',\n}\n"],"mappings":";AASA,IAAY,IAAL,yBAAA,GAAA;QACL,EAAA,QAAA,SACA,EAAA,UAAA;KACD,EAEW,IAAL,yBAAA,GAAA;QACL,EAAA,WAAA,YACA,EAAA,SAAA,UACA,EAAA,aAAA;KACD,EAEW,IAAL,yBAAA,GAAA;QACL,EAAA,MAAA,OACA,EAAA,SAAA;KACD"}

package/dist/design-system136.js

@@ -1,8 +1,277 @@
-import e from "./design-system134.js";
-/* empty css                 */
-//#region src/components/BMenu/BMenuItemGroup.vue
-var t = e;
+import { BCommonSize as e } from "./design-system3.js";
+import { useComponentId as t } from "./design-system10.js";
+import { BMentionsStatus as n, BMentionsVariant as r } from "./design-system135.js";
+import { Fragment as i, computed as a, createCommentVNode as o, createElementBlock as s, createElementVNode as c, createTextVNode as l, defineComponent as u, mergeModels as d, mergeProps as f, nextTick as p, normalizeClass as m, openBlock as h, ref as g, renderList as _, renderSlot as v, toDisplayString as y, unref as b, useAttrs as ee, useCssVars as x, useModel as te, watch as S, withModifiers as C } from "vue";
+//#region src/components/BMentions/BMentions.vue?vue&type=script&setup=true&lang.ts
+var w = [
+	"aria-label",
+	"aria-expanded",
+	"aria-controls"
+], T = [
+	"value",
+	"placeholder",
+	"disabled",
+	"readonly",
+	"rows",
+	"aria-label",
+	"aria-activedescendant"
+], E = ["id", "aria-label"], D = {
+	key: 0,
+	class: "b-mentions__options"
+}, O = [
+	"id",
+	"data-active",
+	"aria-selected",
+	"aria-disabled",
+	"onMousedown",
+	"onMouseenter"
+], k = {
+	key: 1,
+	class: "b-mentions__not-found"
+}, A = /* @__PURE__ */ u({
+	inheritAttrs: !1,
+	__name: "BMentions",
+	props: /* @__PURE__ */ d({
+		options: { default: () => [] },
+		size: { default: () => e.Medium },
+		variant: { default: () => r.Outlined },
+		placement: {},
+		prefix: { default: "@" },
+		split: { default: " " },
+		autoSize: {
+			type: [Boolean, Object],
+			default: !1
+		},
+		allowClear: {
+			type: Boolean,
+			default: !1
+		},
+		filterOption: {
+			type: [Boolean, Function],
+			default: !0
+		},
+		notFoundContent: { default: "Not Found" },
+		disabled: { type: Boolean },
+		readOnly: { type: Boolean },
+		status: {},
+		placeholder: {},
+		rows: { default: 3 }
+	}, {
+		modelValue: { default: "" },
+		modelModifiers: {}
+	}),
+	emits: /* @__PURE__ */ d([
+		"change",
+		"select",
+		"search",
+		"focus",
+		"blur",
+		"clear",
+		"resize",
+		"popupScroll"
+	], ["update:modelValue"]),
+	setup(e, { expose: r, emit: u }) {
+		x((e) => ({ v21fd39a6: N.value }));
+		let d = ee(), A = u, j = te(e, "modelValue"), { componentUID: M } = t(), N = a(() => `--b-mentions-anchor-${M.value}`), P = a(() => `b-mentions-listbox-${M.value}`), F = g(null), I = g(null), L = g(!1), R = g(!1), z = g(-1), B = g(!1), V = g(""), H = g(""), U = g(0), W = a(() => Array.isArray(e.prefix) ? e.prefix : [e.prefix]), G = a(() => {
+			let t = H.value.toLowerCase();
+			return e.filterOption ? typeof e.filterOption == "function" ? e.options.filter((n) => e.filterOption(t, n)) : t ? e.options.filter((e) => (e.label ?? e.value).toLowerCase().includes(t)) : e.options : e.options;
+		}), K = a(() => !B.value || G.value.length === 0 && e.notFoundContent === null ? !1 : R.value), q = (e) => e.label ?? e.value;
+		function J() {
+			R.value || I.value?.showPopover();
+		}
+		function Y() {
+			R.value && I.value?.hidePopover();
+		}
+		function X({ newState: e }) {
+			let t = e === "open";
+			R.value = t, t && G.value.length > 0 ? z.value = 0 : t || (z.value = -1, B.value = !1);
+		}
+		function Z(t, n) {
+			for (let r of W.value) {
+				let i = t.slice(0, n), a = i.lastIndexOf(r);
+				if (a < 0) continue;
+				let o = i.slice(a + r.length);
+				if (!/\s/.test(o) && (a === 0 || t[a - 1] === e.split || /\s/.test(t[a - 1]))) return {
+					start: a,
+					prefix: r
+				};
+			}
+			return null;
+		}
+		function ne(e, t) {
+			let n = Z(e, t);
+			n ? (B.value = !0, V.value = n.prefix, U.value = n.start, H.value = e.slice(n.start + n.prefix.length, t), A("search", H.value, n.prefix), p(() => J())) : Q();
+		}
+		function Q() {
+			Y(), B.value = !1, H.value = "", V.value = "", U.value = 0;
+		}
+		function $(t) {
+			if (t.disabled) return;
+			let n = F.value;
+			if (!n) return;
+			let r = j.value ?? "", i = n.selectionStart, a = r.slice(0, U.value), o = r.slice(i), s = `${V.value}${t.value}`, c = o && !o.startsWith(e.split) && e.split, l = `${a}${s}${c ? e.split : ""}${o}`;
+			j.value = l, A("change", l), A("select", t, V.value), Q();
+			let u = a.length + s.length + (c ? e.split.length : 0);
+			p(() => {
+				n.focus(), n.setSelectionRange(u, u);
+			});
+		}
+		function re(e) {
+			let t = e.target, n = t.value;
+			j.value = n, A("change", n);
+			let r = t.selectionStart;
+			ne(n, r), le();
+		}
+		function ie(e) {
+			L.value = !0, A("focus", e);
+		}
+		function ae(e) {
+			let t = e.relatedTarget;
+			I.value?.contains(t) || (L.value = !1, A("blur", e), Q());
+		}
+		function oe(e) {
+			if (K.value) switch (e.key) {
+				case "ArrowDown": {
+					e.preventDefault();
+					let t = G.value;
+					if (t.length === 0) return;
+					let n = z.value + 1;
+					for (let e = 0; e < t.length; e++) {
+						let r = (n + e) % t.length;
+						if (!t[r].disabled) {
+							z.value = r;
+							break;
+						}
+					}
+					break;
+				}
+				case "ArrowUp": {
+					e.preventDefault();
+					let t = G.value;
+					if (t.length === 0) return;
+					let n = z.value - 1;
+					for (let e = 0; e < t.length; e++) {
+						let r = ((n - e) % t.length + t.length) % t.length;
+						if (!t[r].disabled) {
+							z.value = r;
+							break;
+						}
+					}
+					break;
+				}
+				case "Enter":
+					if (e.preventDefault(), z.value >= 0) {
+						let e = G.value[z.value];
+						e && !e.disabled && $(e);
+					}
+					break;
+				case "Escape":
+					e.preventDefault(), Q();
+					break;
+			}
+		}
+		function se() {
+			j.value = "", A("change", ""), A("clear"), Q(), F.value?.focus();
+		}
+		function ce(e) {
+			A("popupScroll", e);
+		}
+		function le() {
+			if (!e.autoSize || !F.value) return;
+			let t = F.value;
+			t.style.height = "auto";
+			let n = typeof e.autoSize == "object" ? e.autoSize : {}, r = parseFloat(getComputedStyle(t).lineHeight) || 20, i = t.scrollHeight;
+			n.minRows && (i = Math.max(i, n.minRows * r)), n.maxRows && (i = Math.min(i, n.maxRows * r)), t.style.height = `${i}px`, A("resize", {
+				width: t.offsetWidth,
+				height: i
+			});
+		}
+		return S(z, () => {
+			p(() => {
+				(I.value?.querySelector("[data-active=\"true\"]"))?.scrollIntoView({ block: "nearest" });
+			});
+		}), S(j, (e) => {
+			F.value && F.value.value !== e && (F.value.value = e ?? "");
+		}), r({
+			focus: () => F.value?.focus(),
+			blur: () => F.value?.blur()
+		}), (t, r) => (h(), s("div", {
+			class: m(["b-mentions", [
+				`b-mentions--${e.size}`,
+				`b-mentions--${e.variant}`,
+				{
+					"b-mentions--focused": L.value,
+					"b-mentions--disabled": e.disabled,
+					"b-mentions--error": e.status === b(n).Error,
+					"b-mentions--warning": e.status === b(n).Warning,
+					"b-mentions--has-clear": e.allowClear
+				}
+			]]),
+			role: "combobox",
+			"aria-label": e.placeholder || "Mentions input",
+			"aria-expanded": K.value,
+			"aria-haspopup": "listbox",
+			"aria-controls": K.value ? P.value : void 0
+		}, [
+			c("textarea", f({
+				ref_key: "textareaRef",
+				ref: F
+			}, b(d), {
+				value: j.value,
+				class: "b-mentions__textarea",
+				placeholder: e.placeholder,
+				disabled: e.disabled,
+				readonly: e.readOnly,
+				rows: e.autoSize ? void 0 : e.rows,
+				"aria-label": e.placeholder || "Mentions input",
+				autocomplete: "off",
+				"aria-activedescendant": z.value >= 0 ? `${P.value}-option-${z.value}` : void 0,
+				"aria-autocomplete": "list",
+				onInput: re,
+				onFocus: ie,
+				onBlur: ae,
+				onKeydown: oe
+			}), null, 16, T),
+			e.allowClear && j.value && !e.disabled ? (h(), s("button", {
+				key: 0,
+				type: "button",
+				class: "b-mentions__clear",
+				"aria-label": "Clear input",
+				tabindex: "-1",
+				onMousedown: C(se, ["prevent"])
+			}, null, 32)) : o("", !0),
+			B.value || R.value ? (h(), s("div", {
+				key: 1,
+				ref_key: "menuRef",
+				ref: I,
+				id: P.value,
+				class: "b-mentions__dropdown",
+				popover: "manual",
+				role: "listbox",
+				"aria-label": `Mention suggestions for ${V.value}`,
+				onToggle: X,
+				onScroll: ce
+			}, [G.value.length > 0 ? (h(), s("ul", D, [(h(!0), s(i, null, _(G.value, (e, n) => (h(), s("li", {
+				key: e.value,
+				id: `${P.value}-option-${n}`,
+				class: m(["b-mentions__option", {
+					"b-mentions__option--active": n === z.value && !e.disabled,
+					"b-mentions__option--disabled": e.disabled
+				}]),
+				"data-active": n === z.value,
+				"aria-selected": n === z.value,
+				"aria-disabled": e.disabled ?? !1,
+				role: "option",
+				onMousedown: C((t) => $(e), ["prevent"]),
+				onMouseenter: (e) => z.value = n
+			}, [v(t.$slots, "option", {
+				option: e,
+				index: n
+			}, () => [l(y(q(e)), 1)], !0)], 42, O))), 128))])) : e.notFoundContent ? (h(), s("div", k, [v(t.$slots, "notFoundContent", {}, () => [l(y(e.notFoundContent), 1)], !0)])) : o("", !0)], 40, E)) : o("", !0)
+		], 10, w));
+	}
+});
 //#endregion
-export { t as default };
+export { A as default };
 
 //# sourceMappingURL=design-system136.js.map

package/dist/design-system136.js.map

@@ -1 +1 @@
-{"version":3,"file":"design-system136.js","names":[],"sources":["../src/components/BMenu/BMenuItemGroup.vue"],"sourcesContent":["<script setup lang=\"ts\">\nimport { inject } from 'vue';\nimport BMenuItem from './BMenuItem.vue';\nimport { BMenuContextKey, type BMenuContext, type BMenuItemType } from './types';\n\n// ─────────────────────────────────────────────\n// Props\n// ─────────────────────────────────────────────\nconst props = withDefaults(\n  defineProps<{\n    /** Group title label. */\n    label?: string;\n    /** Items within this group. */\n    children?: BMenuItemType[];\n  }>(),\n  {\n    label: '',\n    children: () => [],\n  },\n);\n\ndefineSlots<{\n  default?(): unknown;\n  title?(): unknown;\n}>();\n\nconst menu = inject<BMenuContext>(BMenuContextKey)!;\n</script>\n\n<template>\n  <li class=\"b-menu-item-group\" role=\"presentation\">\n    <div v-if=\"!menu.inlineCollapsed.value\" class=\"b-menu-item-group__title\" role=\"presentation\">\n      <slot name=\"title\">{{ props.label }}</slot>\n    </div>\n    <ul class=\"b-menu-item-group__list\" role=\"group\" :aria-label=\"props.label\">\n      <slot>\n        <BMenuItem\n          v-for=\"item in props.children\"\n          :key=\"item.key\"\n          :item-key=\"item.key\"\n          :label=\"item.label\"\n          :icon=\"item.icon\"\n          :disabled=\"item.disabled\"\n          :danger=\"item.danger\"\n          :extra=\"item.extra\"\n        />\n      </slot>\n    </ul>\n  </li>\n</template>\n\n<style>\n/* ─────────────────────────────────────────────\n   BMenuItemGroup\n   ───────────────────────────────────────────── */\n.b-menu-item-group {\n  list-style: none;\n}\n\n.b-menu-item-group__title {\n  padding: 8px 16px 4px;\n  color: var(--b-menu-group-title-color);\n  font-size: var(--b-menu-group-title-font-size);\n  line-height: var(--b-menu-group-title-line-height);\n  font-weight: 500;\n  white-space: nowrap;\n  overflow: hidden;\n  text-overflow: ellipsis;\n}\n\n.b-menu-item-group__list {\n  list-style: none;\n  padding: 0;\n  margin: 0;\n}\n</style>\n"],"mappings":""}
+{"version":3,"file":"design-system136.js","names":[],"sources":["../src/components/BMentions/BMentions.vue"],"sourcesContent":["<script setup lang=\"ts\">\nimport { useComponentId } from '@/composables/useComponentId.ts';\nimport { BCommonSize } from '@/types.ts';\nimport { computed, nextTick, ref, useAttrs, watch } from 'vue';\n\nimport { BMentionsStatus, BMentionsVariant, type BMentionsOption } from './types.ts';\n\ndefineOptions({ inheritAttrs: false });\n\nconst attrs = useAttrs();\n\nconst {\n  options = [],\n  size = BCommonSize.Medium,\n  variant = BMentionsVariant.Outlined,\n  prefix = '@',\n  split = ' ',\n  autoSize = false,\n  allowClear = false,\n  filterOption = true,\n  notFoundContent = 'Not Found',\n  placeholder,\n  rows = 3,\n} = defineProps<{\n  /** Data source for mention suggestions. */\n  options?: BMentionsOption[];\n  /** Size of the textarea. */\n  size?: `${BCommonSize}`;\n  /** Visual variant. */\n  variant?: `${BMentionsVariant}`;\n  /** Popup positioning relative to cursor. */\n  placement?: 'top' | 'bottom';\n  /** Trigger character(s) for mention lookup. */\n  prefix?: string | string[];\n  /** Delimiter character(s) inserted before/after mention. */\n  split?: string;\n  /** Auto-resize the textarea height. Can be boolean or { minRows, maxRows }. */\n  autoSize?: boolean | { minRows?: number; maxRows?: number };\n  /** Show clear button when there is content. */\n  allowClear?: boolean;\n  /** Filter options by search text. `true` for default filter, function for custom. */\n  filterOption?: boolean | ((search: string, option: BMentionsOption) => boolean);\n  /** Content shown when no results match. Set to `null` to hide dropdown when empty. */\n  notFoundContent?: string | null;\n  /** Whether the textarea is disabled. */\n  disabled?: boolean;\n  /** Whether the textarea is read-only. */\n  readOnly?: boolean;\n  /** Validation status. */\n  status?: `${BMentionsStatus}`;\n  /** Placeholder text. */\n  placeholder?: string;\n  /** Number of visible text lines (when autoSize is false). */\n  rows?: number;\n}>();\n\nconst emit = defineEmits<{\n  /** Fired when the input value changes. */\n  change: [value: string];\n  /** Fired when an option is selected. */\n  select: [option: BMentionsOption, prefix: string];\n  /** Fired when a prefix character is typed and search begins. */\n  search: [text: string, prefix: string];\n  /** Fired when input gains focus. */\n  focus: [event: FocusEvent];\n  /** Fired when input loses focus. */\n  blur: [event: FocusEvent];\n  /** Fired when the clear button is clicked. */\n  clear: [];\n  /** Fired on textarea resize (when autoSize is active). */\n  resize: [size: { width: number; height: number }];\n  /** Fired during popup scroll. */\n  popupScroll: [event: Event];\n}>();\n\nconst model = defineModel<string>({ default: '' });\n\nconst { componentUID } = useComponentId();\nconst anchorName = computed(() => `--b-mentions-anchor-${componentUID.value}`);\nconst listboxId = computed(() => `b-mentions-listbox-${componentUID.value}`);\n\nconst textareaRef = ref<HTMLTextAreaElement | null>(null);\nconst menuRef = ref<HTMLElement | null>(null);\nconst isFocused = ref(false);\nconst isOpen = ref(false);\nconst activeIndex = ref(-1);\nconst measuring = ref(false);\nconst measurePrefix = ref('');\nconst measureText = ref('');\nconst measureStart = ref(0);\n\nconst prefixes = computed(() => (Array.isArray(prefix) ? prefix : [prefix]));\n\nconst filteredOptions = computed(() => {\n  const search = measureText.value.toLowerCase();\n  if (!filterOption) return options;\n  if (typeof filterOption === 'function') {\n    return options.filter((opt) => filterOption(search, opt));\n  }\n  if (!search) return options;\n  return options.filter((opt) => {\n    const text = (opt.label ?? opt.value).toLowerCase();\n    return text.includes(search);\n  });\n});\n\nconst showDropdown = computed(() => {\n  if (!measuring.value) return false;\n  if (filteredOptions.value.length === 0 && notFoundContent === null) return false;\n  return isOpen.value;\n});\n\nconst getOptionLabel = (opt: BMentionsOption) => opt.label ?? opt.value;\n\nfunction openMenu() {\n  if (isOpen.value) return;\n  menuRef.value?.showPopover();\n}\n\nfunction closeMenu() {\n  if (!isOpen.value) return;\n  menuRef.value?.hidePopover();\n}\n\nfunction handleToggle({ newState }: ToggleEvent) {\n  const nowOpen = newState === 'open';\n  isOpen.value = nowOpen;\n  if (nowOpen && filteredOptions.value.length > 0) {\n    activeIndex.value = 0;\n  } else if (!nowOpen) {\n    activeIndex.value = -1;\n    measuring.value = false;\n  }\n}\n\nfunction getLastMeasureIndex(\n  text: string,\n  cursorPos: number,\n): { start: number; prefix: string } | null {\n  for (const p of prefixes.value) {\n    const beforeCursor = text.slice(0, cursorPos);\n    const lastPrefixIdx = beforeCursor.lastIndexOf(p);\n    if (lastPrefixIdx < 0) continue;\n    const afterPrefix = beforeCursor.slice(lastPrefixIdx + p.length);\n    if (/\\s/.test(afterPrefix)) continue;\n    if (\n      lastPrefixIdx === 0 ||\n      text[lastPrefixIdx - 1] === split ||\n      /\\s/.test(text[lastPrefixIdx - 1])\n    ) {\n      return { start: lastPrefixIdx, prefix: p };\n    }\n  }\n  return null;\n}\n\nfunction startMeasure(text: string, cursorPos: number) {\n  const measure = getLastMeasureIndex(text, cursorPos);\n  if (measure) {\n    measuring.value = true;\n    measurePrefix.value = measure.prefix;\n    measureStart.value = measure.start;\n    measureText.value = text.slice(measure.start + measure.prefix.length, cursorPos);\n    emit('search', measureText.value, measure.prefix);\n    nextTick(() => openMenu());\n  } else {\n    stopMeasure();\n  }\n}\n\nfunction stopMeasure() {\n  closeMenu();\n  measuring.value = false;\n  measureText.value = '';\n  measurePrefix.value = '';\n  measureStart.value = 0;\n}\n\nfunction selectOption(opt: BMentionsOption) {\n  if (opt.disabled) return;\n\n  const textarea = textareaRef.value;\n  if (!textarea) return;\n\n  const value = model.value ?? '';\n  const cursorPos = textarea.selectionStart;\n  const beforeMention = value.slice(0, measureStart.value);\n  const afterMention = value.slice(cursorPos);\n\n  const mentionValue = `${measurePrefix.value}${opt.value}`;\n  const needsTrailingSplit = afterMention && !afterMention.startsWith(split) && split;\n  const newValue = `${beforeMention}${mentionValue}${needsTrailingSplit ? split : ''}${afterMention}`;\n\n  model.value = newValue;\n  emit('change', newValue);\n  emit('select', opt, measurePrefix.value);\n\n  stopMeasure();\n\n  const newCursorPos =\n    beforeMention.length + mentionValue.length + (needsTrailingSplit ? split.length : 0);\n  nextTick(() => {\n    textarea.focus();\n    textarea.setSelectionRange(newCursorPos, newCursorPos);\n  });\n}\n\nfunction handleInput(e: Event) {\n  const target = e.target as HTMLTextAreaElement;\n  const value = target.value;\n  model.value = value;\n  emit('change', value);\n\n  const cursorPos = target.selectionStart;\n  startMeasure(value, cursorPos);\n  adjustHeight();\n}\n\nfunction handleFocus(e: FocusEvent) {\n  isFocused.value = true;\n  emit('focus', e);\n}\n\nfunction handleBlur(e: FocusEvent) {\n  const related = e.relatedTarget as HTMLElement | null;\n  if (menuRef.value?.contains(related)) return;\n  isFocused.value = false;\n  emit('blur', e);\n  stopMeasure();\n}\n\nfunction handleKeyDown(e: KeyboardEvent) {\n  if (!showDropdown.value) return;\n\n  switch (e.key) {\n    case 'ArrowDown': {\n      e.preventDefault();\n      const opts = filteredOptions.value;\n      if (opts.length === 0) return;\n      const next = activeIndex.value + 1;\n      for (let i = 0; i < opts.length; i++) {\n        const idx = (next + i) % opts.length;\n        if (!opts[idx].disabled) {\n          activeIndex.value = idx;\n          break;\n        }\n      }\n      break;\n    }\n    case 'ArrowUp': {\n      e.preventDefault();\n      const opts = filteredOptions.value;\n      if (opts.length === 0) return;\n      const prev = activeIndex.value - 1;\n      for (let i = 0; i < opts.length; i++) {\n        const idx = (((prev - i) % opts.length) + opts.length) % opts.length;\n        if (!opts[idx].disabled) {\n          activeIndex.value = idx;\n          break;\n        }\n      }\n      break;\n    }\n    case 'Enter': {\n      e.preventDefault();\n      if (activeIndex.value >= 0) {\n        const opt = filteredOptions.value[activeIndex.value];\n        if (opt && !opt.disabled) {\n          selectOption(opt);\n        }\n      }\n      break;\n    }\n    case 'Escape': {\n      e.preventDefault();\n      stopMeasure();\n      break;\n    }\n  }\n}\n\nfunction handleClear() {\n  model.value = '';\n  emit('change', '');\n  emit('clear');\n  stopMeasure();\n  textareaRef.value?.focus();\n}\n\nfunction handlePopupScroll(e: Event) {\n  emit('popupScroll', e);\n}\n\nfunction adjustHeight() {\n  if (!autoSize || !textareaRef.value) return;\n  const textarea = textareaRef.value;\n  textarea.style.height = 'auto';\n\n  const config = typeof autoSize === 'object' ? autoSize : {};\n  const lineHeight = parseFloat(getComputedStyle(textarea).lineHeight) || 20;\n\n  let newHeight = textarea.scrollHeight;\n  if (config.minRows) {\n    newHeight = Math.max(newHeight, config.minRows * lineHeight);\n  }\n  if (config.maxRows) {\n    newHeight = Math.min(newHeight, config.maxRows * lineHeight);\n  }\n\n  textarea.style.height = `${newHeight}px`;\n  emit('resize', { width: textarea.offsetWidth, height: newHeight });\n}\n\nconst scrollActiveIntoView = () => {\n  nextTick(() => {\n    const active = menuRef.value?.querySelector('[data-active=\"true\"]');\n    active?.scrollIntoView({ block: 'nearest' });\n  });\n};\n\nwatch(activeIndex, scrollActiveIntoView);\n\nwatch(model, (val) => {\n  if (textareaRef.value && textareaRef.value.value !== val) {\n    textareaRef.value.value = val ?? '';\n  }\n});\n\ndefineExpose({\n  focus: () => textareaRef.value?.focus(),\n  blur: () => textareaRef.value?.blur(),\n});\n</script>\n\n<template>\n  <div\n    class=\"b-mentions\"\n    :class=\"[\n      `b-mentions--${size}`,\n      `b-mentions--${variant}`,\n      {\n        'b-mentions--focused': isFocused,\n        'b-mentions--disabled': disabled,\n        'b-mentions--error': status === BMentionsStatus.Error,\n        'b-mentions--warning': status === BMentionsStatus.Warning,\n        'b-mentions--has-clear': allowClear,\n      },\n    ]\"\n    role=\"combobox\"\n    :aria-label=\"placeholder || 'Mentions input'\"\n    :aria-expanded=\"showDropdown\"\n    :aria-haspopup=\"'listbox'\"\n    :aria-controls=\"showDropdown ? listboxId : undefined\"\n  >\n    <textarea\n      ref=\"textareaRef\"\n      v-bind=\"attrs\"\n      :value=\"model\"\n      class=\"b-mentions__textarea\"\n      :placeholder=\"placeholder\"\n      :disabled=\"disabled\"\n      :readonly=\"readOnly\"\n      :rows=\"autoSize ? undefined : rows\"\n      :aria-label=\"placeholder || 'Mentions input'\"\n      autocomplete=\"off\"\n      :aria-activedescendant=\"activeIndex >= 0 ? `${listboxId}-option-${activeIndex}` : undefined\"\n      aria-autocomplete=\"list\"\n      @input=\"handleInput\"\n      @focus=\"handleFocus\"\n      @blur=\"handleBlur\"\n      @keydown=\"handleKeyDown\"\n    />\n\n    <button\n      v-if=\"allowClear && model && !disabled\"\n      type=\"button\"\n      class=\"b-mentions__clear\"\n      aria-label=\"Clear input\"\n      tabindex=\"-1\"\n      @mousedown.prevent=\"handleClear\"\n    ></button>\n\n    <div\n      v-if=\"measuring || isOpen\"\n      ref=\"menuRef\"\n      :id=\"listboxId\"\n      class=\"b-mentions__dropdown\"\n      popover=\"manual\"\n      role=\"listbox\"\n      :aria-label=\"`Mention suggestions for ${measurePrefix}`\"\n      @toggle=\"handleToggle\"\n      @scroll=\"handlePopupScroll\"\n    >\n      <ul v-if=\"filteredOptions.length > 0\" class=\"b-mentions__options\">\n        <li\n          v-for=\"(opt, idx) in filteredOptions\"\n          :key=\"opt.value\"\n          :id=\"`${listboxId}-option-${idx}`\"\n          class=\"b-mentions__option\"\n          :class=\"{\n            'b-mentions__option--active': idx === activeIndex && !opt.disabled,\n            'b-mentions__option--disabled': opt.disabled,\n          }\"\n          :data-active=\"idx === activeIndex\"\n          :aria-selected=\"idx === activeIndex\"\n          :aria-disabled=\"opt.disabled ?? false\"\n          role=\"option\"\n          @mousedown.prevent=\"selectOption(opt)\"\n          @mouseenter=\"activeIndex = idx\"\n        >\n          <slot name=\"option\" :option=\"opt\" :index=\"idx\">\n            {{ getOptionLabel(opt) }}\n          </slot>\n        </li>\n      </ul>\n      <div v-else-if=\"notFoundContent\" class=\"b-mentions__not-found\">\n        <slot name=\"notFoundContent\">\n          {{ notFoundContent }}\n        </slot>\n      </div>\n    </div>\n  </div>\n</template>\n\n<style scoped>\n.b-mentions {\n  --b-mentions-active-bg: #ffffff;\n  --b-mentions-active-border-color: #1677ff;\n  --b-mentions-active-shadow: 0 0 0 2px rgba(5, 145, 255, 0.1);\n  --b-mentions-hover-bg: #ffffff;\n  --b-mentions-hover-border-color: #4096ff;\n  --b-mentions-border-color: #d9d9d9;\n  --b-mentions-bg: #ffffff;\n  --b-mentions-color: rgba(0, 0, 0, 0.88);\n  --b-mentions-placeholder-color: rgba(0, 0, 0, 0.25);\n  --b-mentions-font-size: 14px;\n  --b-mentions-font-size-lg: 16px;\n  --b-mentions-font-size-sm: 14px;\n  --b-mentions-padding-block: 4px;\n  --b-mentions-padding-block-lg: 7px;\n  --b-mentions-padding-block-sm: 0px;\n  --b-mentions-padding-inline: 11px;\n  --b-mentions-padding-inline-lg: 11px;\n  --b-mentions-padding-inline-sm: 7px;\n  --b-mentions-border-radius: 6px;\n  --b-mentions-disabled-bg: rgba(0, 0, 0, 0.04);\n  --b-mentions-disabled-color: rgba(0, 0, 0, 0.25);\n  --b-mentions-error-border-color: #ff4d4f;\n  --b-mentions-error-hover-border-color: #ff7875;\n  --b-mentions-error-active-shadow: 0 0 0 2px rgba(255, 38, 5, 0.06);\n  --b-mentions-warning-border-color: #faad14;\n  --b-mentions-warning-hover-border-color: #ffc53d;\n  --b-mentions-warning-active-shadow: 0 0 0 2px rgba(255, 215, 5, 0.1);\n  --b-mentions-dropdown-bg: #ffffff;\n  --b-mentions-dropdown-shadow:\n    0 6px 16px 0 rgba(0, 0, 0, 0.08), 0 3px 6px -4px rgba(0, 0, 0, 0.12),\n    0 9px 28px 8px rgba(0, 0, 0, 0.05);\n  --b-mentions-dropdown-height: 250px;\n  --b-mentions-option-active-bg: rgba(0, 0, 0, 0.04);\n  --b-mentions-option-selected-bg: #e6f4ff;\n  --b-mentions-option-font-size: 14px;\n  --b-mentions-option-padding-x: 12px;\n  --b-mentions-option-padding-y: 5px;\n  --b-mentions-clear-color: rgba(0, 0, 0, 0.25);\n  --b-mentions-clear-hover-color: rgba(0, 0, 0, 0.45);\n  --b-mentions-z-index-popup: 1050;\n\n  display: flex;\n  width: 100%;\n}\n\n.b-mentions--has-clear {\n  position: relative;\n}\n\n/* ── Textarea ── */\n.b-mentions__textarea {\n  position: relative;\n  width: 100%;\n  box-sizing: border-box;\n  outline: none;\n  resize: vertical;\n  font-family: inherit;\n  line-height: 1.5714;\n  color: var(--b-mentions-color);\n  background-color: var(--b-mentions-bg);\n  border: 1px solid var(--b-mentions-border-color);\n  border-radius: var(--b-mentions-border-radius);\n  transition:\n    border-color 0.2s,\n    box-shadow 0.2s,\n    background-color 0.2s;\n  anchor-name: v-bind('anchorName');\n}\n\n.b-mentions__textarea::placeholder {\n  color: var(--b-mentions-placeholder-color);\n}\n\n/* ── Sizes ── */\n.b-mentions--sm .b-mentions__textarea {\n  padding: var(--b-mentions-padding-block-sm) var(--b-mentions-padding-inline-sm);\n  font-size: var(--b-mentions-font-size-sm);\n}\n\n.b-mentions--md .b-mentions__textarea {\n  padding: var(--b-mentions-padding-block) var(--b-mentions-padding-inline);\n  font-size: var(--b-mentions-font-size);\n}\n\n.b-mentions--lg .b-mentions__textarea {\n  padding: var(--b-mentions-padding-block-lg) var(--b-mentions-padding-inline-lg);\n  font-size: var(--b-mentions-font-size-lg);\n}\n\n/* ── Variants ── */\n.b-mentions--outlined .b-mentions__textarea {\n  border-color: var(--b-mentions-border-color);\n}\n\n.b-mentions--filled .b-mentions__textarea {\n  border-color: transparent;\n  background-color: var(--b-mentions-disabled-bg);\n}\n\n.b-mentions--borderless .b-mentions__textarea {\n  border-color: transparent;\n  background-color: transparent;\n  box-shadow: none;\n}\n\n/* ── States ── */\n.b-mentions--focused:not(.b-mentions--disabled) .b-mentions__textarea {\n  border-color: var(--b-mentions-active-border-color);\n  box-shadow: var(--b-mentions-active-shadow);\n  background-color: var(--b-mentions-active-bg);\n}\n\n.b-mentions:not(.b-mentions--focused):not(.b-mentions--disabled):hover .b-mentions__textarea {\n  border-color: var(--b-mentions-hover-border-color);\n  background-color: var(--b-mentions-hover-bg);\n}\n\n.b-mentions--borderless.b-mentions--focused .b-mentions__textarea {\n  box-shadow: none;\n}\n\n/* ── Disabled ── */\n.b-mentions--disabled .b-mentions__textarea {\n  cursor: not-allowed;\n  background-color: var(--b-mentions-disabled-bg);\n  color: var(--b-mentions-disabled-color);\n}\n\n/* ── Error status ── */\n.b-mentions--error .b-mentions__textarea {\n  border-color: var(--b-mentions-error-border-color);\n}\n\n.b-mentions--error:not(.b-mentions--disabled):hover .b-mentions__textarea {\n  border-color: var(--b-mentions-error-hover-border-color);\n}\n\n.b-mentions--error.b-mentions--focused .b-mentions__textarea {\n  border-color: var(--b-mentions-error-border-color);\n  box-shadow: var(--b-mentions-error-active-shadow);\n}\n\n/* ── Warning status ── */\n.b-mentions--warning .b-mentions__textarea {\n  border-color: var(--b-mentions-warning-border-color);\n}\n\n.b-mentions--warning:not(.b-mentions--disabled):hover .b-mentions__textarea {\n  border-color: var(--b-mentions-warning-hover-border-color);\n}\n\n.b-mentions--warning.b-mentions--focused .b-mentions__textarea {\n  border-color: var(--b-mentions-warning-border-color);\n  box-shadow: var(--b-mentions-warning-active-shadow);\n}\n\n/* ── Clear button ── */\n.b-mentions__clear {\n  position: absolute;\n  top: 8px;\n  right: 8px;\n  display: flex;\n  align-items: center;\n  justify-content: center;\n  width: 16px;\n  height: 16px;\n  padding: 0;\n  border: none;\n  border-radius: 50%;\n  background: transparent;\n  color: var(--b-mentions-clear-color);\n  font-size: 10px;\n  cursor: pointer;\n  transition: color 0.2s;\n}\n\n.b-mentions__clear::after {\n  content: '\\2715';\n}\n\n.b-mentions__clear:hover {\n  color: var(--b-mentions-clear-hover-color);\n}\n\n/* ── Dropdown ── */\n.b-mentions__dropdown {\n  margin: 0;\n  padding: 4px;\n  border: none;\n  border-radius: var(--b-mentions-border-radius);\n  background: var(--b-mentions-dropdown-bg);\n  box-shadow: var(--b-mentions-dropdown-shadow);\n  max-height: var(--b-mentions-dropdown-height);\n  overflow-y: auto;\n  z-index: var(--b-mentions-z-index-popup);\n\n  position: absolute;\n  position-anchor: v-bind('anchorName');\n  inset: auto;\n  top: anchor(bottom);\n  left: anchor(left);\n  width: anchor-size(width);\n  position-try-fallbacks: --b-mentions-top;\n\n  opacity: 0;\n  transition:\n    display 0.2s allow-discrete,\n    opacity 0.2s;\n}\n\n.b-mentions__dropdown:popover-open {\n  opacity: 1;\n\n  @starting-style {\n    opacity: 0;\n  }\n}\n\n@position-try --b-mentions-top {\n  inset: auto;\n  bottom: anchor(top);\n  left: anchor(left);\n}\n\n/* ── Options list ── */\n.b-mentions__options {\n  margin: 0;\n  padding: 0;\n  list-style: none;\n}\n\n.b-mentions__option {\n  padding: var(--b-mentions-option-padding-y) var(--b-mentions-option-padding-x);\n  font-size: var(--b-mentions-option-font-size);\n  line-height: 1.5714;\n  border-radius: 4px;\n  cursor: pointer;\n  transition: background-color 0.15s;\n}\n\n.b-mentions__option--active {\n  background: var(--b-mentions-option-active-bg);\n}\n\n.b-mentions__option:hover:not(.b-mentions__option--disabled) {\n  background: var(--b-mentions-option-active-bg);\n}\n\n.b-mentions__option--disabled {\n  cursor: not-allowed;\n  opacity: 0.4;\n}\n\n/* ── Not found ── */\n.b-mentions__not-found {\n  padding: var(--b-mentions-option-padding-y) var(--b-mentions-option-padding-x);\n  font-size: var(--b-mentions-option-font-size);\n  color: var(--b-mentions-disabled-color);\n  text-align: center;\n}\n\n/* ── Dark mode ── */\n[data-prefers-color='dark'] .b-mentions {\n  --b-mentions-active-bg: #1f1f1f;\n  --b-mentions-active-border-color: #1668dc;\n  --b-mentions-active-shadow: 0 0 0 2px rgba(22, 104, 220, 0.15);\n  --b-mentions-hover-bg: #1f1f1f;\n  --b-mentions-hover-border-color: #3c89e8;\n  --b-mentions-border-color: #424242;\n  --b-mentions-bg: #1f1f1f;\n  --b-mentions-color: rgba(255, 255, 255, 0.88);\n  --b-mentions-placeholder-color: rgba(255, 255, 255, 0.25);\n  --b-mentions-disabled-bg: rgba(255, 255, 255, 0.08);\n  --b-mentions-disabled-color: rgba(255, 255, 255, 0.25);\n  --b-mentions-dropdown-bg: #2a2a2a;\n  --b-mentions-dropdown-shadow:\n    0 6px 16px 0 rgba(0, 0, 0, 0.32), 0 3px 6px -4px rgba(0, 0, 0, 0.48),\n    0 9px 28px 8px rgba(0, 0, 0, 0.2);\n  --b-mentions-option-active-bg: rgba(255, 255, 255, 0.08);\n  --b-mentions-option-selected-bg: #111a2c;\n  --b-mentions-clear-color: rgba(255, 255, 255, 0.25);\n  --b-mentions-clear-hover-color: rgba(255, 255, 255, 0.45);\n  --b-mentions-error-border-color: #d32029;\n  --b-mentions-error-hover-border-color: #e84749;\n  --b-mentions-error-active-shadow: 0 0 0 2px rgba(211, 32, 41, 0.1);\n  --b-mentions-warning-border-color: #d89614;\n  --b-mentions-warning-hover-border-color: #e8b339;\n  --b-mentions-warning-active-shadow: 0 0 0 2px rgba(216, 150, 20, 0.1);\n}\n\n@media (prefers-color-scheme: dark) {\n  [data-prefers-color='system'] .b-mentions {\n    --b-mentions-active-bg: #1f1f1f;\n    --b-mentions-active-border-color: #1668dc;\n    --b-mentions-active-shadow: 0 0 0 2px rgba(22, 104, 220, 0.15);\n    --b-mentions-hover-bg: #1f1f1f;\n    --b-mentions-hover-border-color: #3c89e8;\n    --b-mentions-border-color: #424242;\n    --b-mentions-bg: #1f1f1f;\n    --b-mentions-color: rgba(255, 255, 255, 0.88);\n    --b-mentions-placeholder-color: rgba(255, 255, 255, 0.25);\n    --b-mentions-disabled-bg: rgba(255, 255, 255, 0.08);\n    --b-mentions-disabled-color: rgba(255, 255, 255, 0.25);\n    --b-mentions-dropdown-bg: #2a2a2a;\n    --b-mentions-dropdown-shadow:\n      0 6px 16px 0 rgba(0, 0, 0, 0.32), 0 3px 6px -4px rgba(0, 0, 0, 0.48),\n      0 9px 28px 8px rgba(0, 0, 0, 0.2);\n    --b-mentions-option-active-bg: rgba(255, 255, 255, 0.08);\n    --b-mentions-option-selected-bg: #111a2c;\n    --b-mentions-clear-color: rgba(255, 255, 255, 0.25);\n    --b-mentions-clear-hover-color: rgba(255, 255, 255, 0.45);\n    --b-mentions-error-border-color: #d32029;\n    --b-mentions-error-hover-border-color: #e84749;\n    --b-mentions-error-active-shadow: 0 0 0 2px rgba(211, 32, 41, 0.1);\n    --b-mentions-warning-border-color: #d89614;\n    --b-mentions-warning-hover-border-color: #e8b339;\n    --b-mentions-warning-active-shadow: 0 0 0 2px rgba(216, 150, 20, 0.1);\n  }\n}\n\n/* ── Reduced motion ── */\n@media (prefers-reduced-motion: reduce) {\n  .b-mentions__textarea,\n  .b-mentions__dropdown,\n  .b-mentions__option,\n  .b-mentions__clear {\n    transition: none;\n  }\n}\n</style>\n"],"mappings":"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"}

package/dist/design-system138.js

@@ -0,0 +1,9 @@
+import e from "./design-system14.js";
+import t from "./design-system136.js";
+/* empty css                 */
+//#region src/components/BMentions/BMentions.vue
+var n = /* @__PURE__ */ e(t, [["__scopeId", "data-v-8c92c351"]]);
+//#endregion
+export { n as default };
+
+//# sourceMappingURL=design-system138.js.map