@7pmlabs/design-system 2.0.9 → 2.1.0

package/dist/design-system145.js.map

@@ -1 +1 @@
-{"version":3,"file":"design-system145.js","names":[],"sources":["../src/components/BMessage/BMessage.vue"],"sourcesContent":["<script setup lang=\"ts\">\nimport { BMessageType } from '@/types.ts';\nimport { computed, onUnmounted, ref, useId, watch } from 'vue';\n\n// ─────────────────────────────────────────────\n// Props & emits\n// ─────────────────────────────────────────────\nconst {\n  type = BMessageType.Info,\n  content = '',\n  duration = 3,\n  showIcon = true,\n  modelValue = undefined,\n} = defineProps<{\n  /**\n   * Message type - controls icon and colour scheme.\n   * @default 'info'\n   */\n  type?: `${BMessageType}`;\n  /** The message content text (also accepts the default slot). */\n  content?: string;\n  /**\n   * Time (in seconds) before auto-close. Set to `0` to disable auto-close.\n   * @default 3\n   */\n  duration?: number;\n  /** Show the built-in status icon. @default true */\n  showIcon?: boolean;\n  /**\n   * Controlled visibility - when provided the component operates in\n   * controlled mode; otherwise it manages its own visibility.\n   * Bind with `v-model`.\n   */\n  modelValue?: boolean;\n}>();\n\nconst emit = defineEmits<{\n  /** Fired synchronously when the message starts closing. */\n  (e: 'close'): void;\n  /** Fired after the leave-transition fully completes. */\n  (e: 'afterClose'): void;\n  /** v-model support */\n  (e: 'update:modelValue', value: boolean): void;\n}>();\n\n// ─────────────────────────────────────────────\n// Internal state\n// ─────────────────────────────────────────────\nconst messageId = useId();\n\n/** Uncontrolled visibility flag - default closed. */\nconst internalVisible = ref(false);\n\n/**\n * Effective visibility:\n *  - controlled  → honour `modelValue`\n *  - uncontrolled → use `internalVisible`\n */\nconst isVisible = computed(() => (modelValue !== undefined ? modelValue : internalVisible.value));\n\nconst isControlled = computed(() => modelValue !== undefined);\n\n// ─────────────────────────────────────────────\n// Derived state\n// ─────────────────────────────────────────────\n/** ARIA role: 'alert' for error/warning (assertive), 'status' for others. */\nconst ariaRole = computed<'alert' | 'status'>(() =>\n  type === BMessageType.Error || type === BMessageType.Warning ? 'alert' : 'status',\n);\n\n/** Map type → inline SVG path for the status icon. */\nconst iconPath = computed(() => {\n  switch (type) {\n    case BMessageType.Success:\n      // circle-check\n      return 'M12 2C6.48 2 2 6.48 2 12s4.48 10 10 10 10-4.48 10-10S17.52 2 12 2zm-2 14.5-4-4 1.41-1.41L10 13.67l6.59-6.59L18 8.5l-8 8z';\n    case BMessageType.Warning:\n      // triangle-exclamation\n      return 'M1 21h22L12 2 1 21zm12-3h-2v-2h2v2zm0-4h-2v-4h2v4z';\n    case BMessageType.Error:\n      // circle-xmark\n      return 'M12 2C6.47 2 2 6.47 2 12s4.47 10 10 10 10-4.47 10-10S17.53 2 12 2zm5 13.59L15.59 17 12 13.41 8.41 17 7 15.59 10.59 12 7 8.41 8.41 7 12 10.59 15.59 7 17 8.41 13.41 12 17 15.59z';\n    case BMessageType.Loading:\n      // spinner (circle arc)\n      return 'M12 2a10 10 0 0 1 10 10h-2a8 8 0 0 0-8-8V2z';\n    default:\n      // circle-info\n      return 'M12 2C6.48 2 2 6.48 2 12s4.48 10 10 10 10-4.48 10-10S17.52 2 12 2zm1 15h-2v-6h2v6zm0-8h-2V7h2v2z';\n  }\n});\n\ndefineSlots<{\n  /** Overrides the `content` prop. */\n  default?(): unknown;\n  /** Overrides the built-in status icon. */\n  icon?(): unknown;\n}>();\n\n// ─────────────────────────────────────────────\n// Auto-close timer\n// ─────────────────────────────────────────────\nlet timer: ReturnType<typeof setTimeout> | null = null;\n\nfunction startTimer() {\n  clearTimer();\n  if (duration > 0) {\n    timer = setTimeout(() => {\n      close();\n    }, duration * 1000);\n  }\n}\n\nfunction clearTimer() {\n  if (timer !== null) {\n    clearTimeout(timer);\n    timer = null;\n  }\n}\n\n// ─────────────────────────────────────────────\n// Behaviour\n// ─────────────────────────────────────────────\nfunction open() {\n  if (isControlled.value) {\n    emit('update:modelValue', true);\n  } else {\n    internalVisible.value = true;\n  }\n}\n\nfunction close() {\n  emit('close');\n  if (isControlled.value) {\n    emit('update:modelValue', false);\n  } else {\n    internalVisible.value = false;\n  }\n}\n\nfunction onAfterLeave() {\n  emit('afterClose');\n}\n\nfunction onMouseEnter() {\n  clearTimer();\n}\n\nfunction onMouseLeave() {\n  startTimer();\n}\n\n// ─────────────────────────────────────────────\n// Lifecycle\n// ─────────────────────────────────────────────\nonUnmounted(() => {\n  clearTimer();\n});\n\n// Start / clear auto-close timer whenever visibility changes\nwatch(\n  isVisible,\n  (visible) => {\n    if (visible) {\n      startTimer();\n    } else {\n      clearTimer();\n    }\n  },\n  { immediate: true },\n);\n\n// Expose open & close for imperative usage\ndefineExpose({ open, close });\n</script>\n\n<template>\n  <Teleport to=\"body\">\n    <Transition name=\"b-message-fade\" @after-leave=\"onAfterLeave\">\n      <div\n        v-if=\"isVisible\"\n        :id=\"messageId\"\n        class=\"b-message\"\n        :class=\"[\n          `b-message--${type}`,\n          {\n            'b-message--with-icon': showIcon,\n          },\n        ]\"\n        :role=\"ariaRole\"\n        :aria-live=\"ariaRole === 'alert' ? 'assertive' : 'polite'\"\n        :aria-atomic=\"true\"\n        @mouseenter=\"onMouseEnter\"\n        @mouseleave=\"onMouseLeave\"\n      >\n        <!-- Status icon -->\n        <span v-if=\"showIcon\" class=\"b-message__icon\" aria-hidden=\"true\">\n          <slot name=\"icon\">\n            <svg\n              class=\"b-message__icon-svg\"\n              :class=\"{ 'b-message__icon-svg--spin': type === 'loading' }\"\n              viewBox=\"0 0 24 24\"\n              xmlns=\"http://www.w3.org/2000/svg\"\n              focusable=\"false\"\n            >\n              <path :d=\"iconPath\" />\n            </svg>\n          </slot>\n        </span>\n\n        <!-- Content -->\n        <span class=\"b-message__content\">\n          <slot>{{ content }}</slot>\n        </span>\n      </div>\n    </Transition>\n  </Teleport>\n</template>\n\n<style>\n/* ────────────────────────────────────────────\n   CSS Custom Properties (tokens)\n   ──────────────────────────────────────────── */\n.b-message {\n  /* Layout */\n  --b-message-padding-v: 0.625rem;\n  --b-message-padding-h: 1rem;\n  --b-message-border-radius: 0.5rem;\n  --b-message-icon-size: 1rem;\n  --b-message-gap: 0.5rem;\n  --b-message-font-size: 0.875rem;\n  --b-message-max-width: 32rem;\n\n  /* Colours - info (default) */\n  --b-message-bg: #ffffff;\n  --b-message-border-color: oklch(90% 0.02 240);\n  --b-message-color: oklch(30% 0.02 240);\n  --b-message-icon-color: oklch(62.3% 0.214 259.815);\n  --b-message-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\n  /* Animation */\n  --b-message-transition-duration: 300ms;\n  --b-message-top: 8px;\n}\n\n/* ── Variant colour tokens ── */\n.b-message--success {\n  --b-message-icon-color: oklch(72.3% 0.219 149.579);\n}\n\n.b-message--warning {\n  --b-message-icon-color: oklch(75% 0.183 55.934);\n}\n\n.b-message--error {\n  --b-message-icon-color: oklch(63.7% 0.237 25.331);\n}\n\n.b-message--loading {\n  --b-message-icon-color: oklch(62.3% 0.214 259.815);\n}\n\n/* ── Dark mode ── */\n[data-prefers-color='dark'] .b-message {\n  --b-message-bg: oklch(22% 0.02 240);\n  --b-message-border-color: oklch(35% 0.03 240);\n  --b-message-color: oklch(88% 0.02 240);\n  --b-message-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}\n\n@media (prefers-color-scheme: dark) {\n  [data-prefers-color='system'] .b-message {\n    --b-message-bg: oklch(22% 0.02 240);\n    --b-message-border-color: oklch(35% 0.03 240);\n    --b-message-color: oklch(88% 0.02 240);\n    --b-message-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  }\n}\n\n/* ─────────────────────────────────────────────\n   Base layout\n   ───────────────────────────────────────────── */\n.b-message {\n  position: fixed;\n  top: var(--b-message-top);\n  left: 50%;\n  transform: translateX(-50%);\n  z-index: 1010;\n  display: inline-flex;\n  align-items: center;\n  gap: var(--b-message-gap);\n  padding: var(--b-message-padding-v) var(--b-message-padding-h);\n  border-radius: var(--b-message-border-radius);\n  background-color: var(--b-message-bg);\n  color: var(--b-message-color);\n  font-size: var(--b-message-font-size);\n  line-height: 1.5;\n  box-shadow: var(--b-message-shadow);\n  box-sizing: border-box;\n  max-width: var(--b-message-max-width);\n  word-break: break-word;\n  pointer-events: auto;\n}\n\n/* ── Icon ── */\n.b-message__icon {\n  display: inline-flex;\n  flex-shrink: 0;\n  align-items: center;\n  color: var(--b-message-icon-color);\n  line-height: 1;\n}\n\n.b-message__icon-svg {\n  width: var(--b-message-icon-size);\n  height: var(--b-message-icon-size);\n  fill: currentColor;\n  display: block;\n}\n\n/* Loading spinner animation */\n.b-message__icon-svg--spin {\n  animation: b-message-spin 1s linear infinite;\n}\n\n@keyframes b-message-spin {\n  from {\n    transform: rotate(0deg);\n  }\n  to {\n    transform: rotate(360deg);\n  }\n}\n\n/* ── Content ── */\n.b-message__content {\n  flex: 1;\n  min-width: 0;\n}\n\n/* ─────────────────────────────────────────────\n   Transition (slide-down + fade)\n   ───────────────────────────────────────────── */\n.b-message-fade-enter-active,\n.b-message-fade-leave-active {\n  transition:\n    opacity var(--b-message-transition-duration, 300ms) ease,\n    transform var(--b-message-transition-duration, 300ms) ease;\n}\n\n.b-message-fade-enter-from {\n  opacity: 0;\n  transform: translateX(-50%) translateY(-100%);\n}\n\n.b-message-fade-enter-to {\n  opacity: 1;\n  transform: translateX(-50%) translateY(0);\n}\n\n.b-message-fade-leave-from {\n  opacity: 1;\n  transform: translateX(-50%) translateY(0);\n}\n\n.b-message-fade-leave-to {\n  opacity: 0;\n  transform: translateX(-50%) translateY(-100%);\n}\n\n/* Respect prefers-reduced-motion */\n@media (prefers-reduced-motion: reduce) {\n  .b-message-fade-enter-active,\n  .b-message-fade-leave-active {\n    transition: opacity var(--b-message-transition-duration, 300ms) ease;\n  }\n\n  .b-message-fade-enter-from,\n  .b-message-fade-leave-to {\n    transform: translateX(-50%);\n  }\n\n  .b-message__icon-svg--spin {\n    animation: none;\n  }\n}\n</style>\n"],"mappings":""}
+{"version":3,"file":"design-system145.js","names":[],"sources":["../src/components/BMenu/BMenuItem.vue"],"sourcesContent":["<script setup lang=\"ts\">\nimport { computed, inject, onMounted } from 'vue';\nimport {\n  BMenuContextKey,\n  BMenuSubMenuContextKey,\n  type BMenuClickInfo,\n  type BMenuContext,\n  type BMenuSubMenuContext,\n} from './types';\n\n// ─────────────────────────────────────────────\n// Props\n// ─────────────────────────────────────────────\nconst {\n  itemKey,\n  label = '',\n  icon = undefined,\n  disabled = false,\n  danger = false,\n  extra = undefined,\n  title = undefined,\n} = defineProps<{\n  /** Unique key identifying this menu item. */\n  itemKey: string;\n  /** Display label text. */\n  label?: string;\n  /** Icon name rendered before the label. */\n  icon?: string;\n  /** Whether the item is disabled. @default false */\n  disabled?: boolean;\n  /** Display with danger (red) styling. @default false */\n  danger?: boolean;\n  /** Extra content at the right side. */\n  extra?: string;\n  /** Tooltip title when collapsed. */\n  title?: string;\n}>();\n\ndefineSlots<{\n  default?(): unknown;\n  icon?(): unknown;\n  extra?(): unknown;\n}>();\n\n// ─────────────────────────────────────────────\n// Inject context\n// ─────────────────────────────────────────────\nconst menu = inject<BMenuContext>(BMenuContextKey)!;\nconst subMenuCtx = inject<BMenuSubMenuContext | null>(BMenuSubMenuContextKey, null);\n\nconst level = computed(() => (subMenuCtx?.level ?? 0) + 1);\nconst keyPath = computed(() => [...(subMenuCtx?.keyPath ?? []), itemKey]);\n\n// Register key path with root menu\nonMounted(() => {\n  menu.registerKeyPath(itemKey, keyPath.value);\n});\n\n// ─────────────────────────────────────────────\n// Computed\n// ─────────────────────────────────────────────\nconst isSelected = computed(() => menu.selectedKeys.value.includes(itemKey));\n\nconst itemRole = computed(() => {\n  if (!menu.selectable.value) return 'menuitem';\n  return menu.multiple.value ? 'menuitemcheckbox' : 'menuitemradio';\n});\n\nconst paddingLeft = computed(() => {\n  if (menu.mode.value !== 'inline') return undefined;\n  if (menu.inlineCollapsed.value) return undefined;\n  return `${level.value * menu.inlineIndent.value}px`;\n});\n\nconst itemClasses = computed(() => [\n  'b-menu-item',\n  {\n    'b-menu-item--selected': isSelected.value,\n    'b-menu-item--disabled': disabled,\n    'b-menu-item--danger': danger,\n    'b-menu-item--collapsed': menu.inlineCollapsed.value,\n    'b-menu-item--horizontal': menu.mode.value === 'horizontal',\n  },\n]);\n\n// ─────────────────────────────────────────────\n// Handlers\n// ─────────────────────────────────────────────\nfunction handleClick(e: MouseEvent) {\n  if (disabled) return;\n\n  const info: BMenuClickInfo = {\n    key: itemKey,\n    keyPath: keyPath.value,\n    domEvent: e,\n  };\n  menu.onItemClick(info);\n}\n\nfunction handleKeydown(e: KeyboardEvent) {\n  if (disabled) return;\n\n  if (e.key === 'Enter' || e.key === ' ') {\n    e.preventDefault();\n    const info: BMenuClickInfo = {\n      key: itemKey,\n      keyPath: keyPath.value,\n      domEvent: e,\n    };\n    menu.onItemClick(info);\n  }\n}\n</script>\n\n<template>\n  <li\n    :class=\"itemClasses\"\n    :style=\"{ paddingInlineStart: paddingLeft }\"\n    :role=\"itemRole\"\n    :tabindex=\"disabled ? -1 : 0\"\n    :aria-disabled=\"disabled || undefined\"\n    :aria-checked=\"menu.selectable.value ? isSelected : undefined\"\n    :title=\"title ?? (menu.inlineCollapsed.value ? label : undefined)\"\n    :data-menu-key=\"itemKey\"\n    @click=\"handleClick\"\n    @keydown=\"handleKeydown\"\n  >\n    <span v-if=\"icon || $slots.icon\" class=\"b-menu-item__icon\" aria-hidden=\"true\">\n      <slot name=\"icon\">{{ icon }}</slot>\n    </span>\n    <span v-if=\"!menu.inlineCollapsed.value\" class=\"b-menu-item__label\">\n      <slot>{{ label }}</slot>\n    </span>\n    <span v-if=\"extra && !menu.inlineCollapsed.value\" class=\"b-menu-item__extra\">\n      <slot name=\"extra\">{{ extra }}</slot>\n    </span>\n  </li>\n</template>\n\n<style>\n/* ─────────────────────────────────────────────\n   BMenuItem\n   ───────────────────────────────────────────── */\n.b-menu-item {\n  display: flex;\n  align-items: center;\n  height: var(--b-menu-item-height);\n  margin-block: var(--b-menu-item-margin-block);\n  margin-inline: var(--b-menu-item-margin-inline);\n  padding-inline: var(--b-menu-item-padding-inline);\n  border-radius: var(--b-menu-item-border-radius);\n  color: var(--b-menu-item-color);\n  cursor: pointer;\n  user-select: none;\n  list-style: none;\n  outline: none;\n  position: relative;\n  transition:\n    background var(--b-menu-transition-duration),\n    color var(--b-menu-transition-duration),\n    padding var(--b-menu-transition-duration);\n  box-sizing: border-box;\n  white-space: nowrap;\n  overflow: hidden;\n  text-overflow: ellipsis;\n}\n\n.b-menu-item:hover:not(.b-menu-item--disabled) {\n  background: var(--b-menu-item-hover-bg);\n  color: var(--b-menu-item-hover-color);\n}\n\n.b-menu-item:focus-visible {\n  outline: 2px solid #1677ff;\n  outline-offset: -2px;\n}\n\n/* ── Selected ── */\n.b-menu-item--selected {\n  background: var(--b-menu-item-selected-bg);\n  color: var(--b-menu-item-selected-color);\n  font-weight: 500;\n}\n\n/* ── Disabled ── */\n.b-menu-item--disabled {\n  color: var(--b-menu-item-disabled-color);\n  cursor: not-allowed;\n}\n\n/* ── Danger ── */\n.b-menu-item--danger {\n  color: var(--b-menu-danger-item-color);\n}\n\n.b-menu-item--danger:hover:not(.b-menu-item--disabled) {\n  color: var(--b-menu-danger-item-hover-color);\n  background: var(--b-menu-danger-item-active-bg);\n}\n\n.b-menu-item--danger.b-menu-item--selected {\n  background: var(--b-menu-danger-item-selected-bg);\n  color: var(--b-menu-danger-item-selected-color);\n}\n\n/* ── Collapsed ── */\n.b-menu-item--collapsed {\n  justify-content: center;\n  padding-inline: 0;\n}\n\n.b-menu-item--collapsed .b-menu-item__icon {\n  font-size: var(--b-menu-collapsed-icon-size);\n  margin-inline-end: 0;\n}\n\n/* ── Horizontal mode ── */\n.b-menu-item--horizontal {\n  margin-block: 0;\n  border-radius: var(--b-menu-horizontal-item-border-radius);\n  height: auto;\n  line-height: var(--b-menu-horizontal-line-height);\n  position: relative;\n}\n\n.b-menu-item--horizontal::after {\n  content: '';\n  position: absolute;\n  bottom: 0;\n  left: var(--b-menu-item-padding-inline);\n  right: var(--b-menu-item-padding-inline);\n  height: var(--b-menu-active-bar-height);\n  background: transparent;\n  transition: background var(--b-menu-transition-duration);\n}\n\n.b-menu-item--horizontal:hover:not(.b-menu-item--disabled) {\n  background: var(--b-menu-horizontal-item-hover-bg);\n  color: var(--b-menu-horizontal-item-hover-color);\n}\n\n.b-menu-item--horizontal.b-menu-item--selected {\n  background: var(--b-menu-horizontal-item-selected-bg);\n  color: var(--b-menu-horizontal-item-selected-color);\n}\n\n.b-menu-item--horizontal.b-menu-item--selected::after {\n  background: var(--b-menu-horizontal-item-selected-color);\n}\n\n/* ─────────────────────────────────────────────\n   Icon & Label\n   ───────────────────────────────────────────── */\n.b-menu-item__icon {\n  display: inline-flex;\n  align-items: center;\n  justify-content: center;\n  flex-shrink: 0;\n  font-size: var(--b-menu-icon-size);\n  margin-inline-end: var(--b-menu-icon-margin-inline-end);\n}\n\n.b-menu-item__label {\n  flex: 1;\n  min-width: 0;\n  overflow: hidden;\n  text-overflow: ellipsis;\n}\n\n.b-menu-item__extra {\n  margin-inline-start: auto;\n  padding-inline-start: 8px;\n  color: var(--b-menu-group-title-color);\n  font-size: 12px;\n}\n\n/* ── Reduced motion ── */\n@media (prefers-reduced-motion: reduce) {\n  .b-menu-item {\n    transition: none;\n  }\n\n  .b-menu-item--horizontal::after {\n    transition: none;\n  }\n}\n</style>\n"],"mappings":""}

package/dist/design-system146.js

@@ -1,12 +1,45 @@
-import e from "./design-system14.js";
-import { createElementBlock as t, openBlock as n, renderSlot as r } from "vue";
-//#region src/components/BModal/BModalBody.vue
-var i = {}, a = { class: "b:text-sm b:text-black/80" };
-function o(e, i) {
-	return n(), t("div", a, [r(e.$slots, "default")]);
-}
-var s = /* @__PURE__ */ e(i, [["render", o]]);
+import { BMenuContextKey as e } from "./design-system142.js";
+import t from "./design-system145.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, _)]));
+	}
+});
 //#endregion
-export { s as default };
+export { v as default };
 
 //# sourceMappingURL=design-system146.js.map

package/dist/design-system146.js.map

@@ -1 +1 @@
-{"version":3,"file":"design-system146.js","names":[],"sources":["../src/components/BModal/BModalBody.vue"],"sourcesContent":["<template>\n  <div class=\"b:text-sm b:text-black/80\">\n    <slot></slot>\n  </div>\n</template>\n"],"mappings":";;;kBACO,OAAM,6BAA2B;;aAAtC,EAEM,OAFN,GAEM,CADJ,EAAa,EAAA,QAAA,UAAA,CAAA,CAAA"}
+{"version":3,"file":"design-system146.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"}

package/dist/design-system148.js

@@ -1,5 +1,6 @@
-import e from "./design-system147.js";
-//#region src/components/BModal/BModalFooter.vue
+import e from "./design-system146.js";
+/* empty css                 */
+//#region src/components/BMenu/BMenuItemGroup.vue
 var t = e;
 //#endregion
 export { t as default };

package/dist/design-system148.js.map

@@ -1 +1 @@
-{"version":3,"file":"design-system148.js","names":[],"sources":["../src/components/BModal/BModalFooter.vue"],"sourcesContent":["<script setup lang=\"ts\">\nimport { BButton } from '@/components';\n\nconst { cancelText = 'Cancel', okText = 'OK' } = defineProps<{\n  /**\n   * Text to display on the cancel button.\n   */\n  cancelText?: string;\n  /**\n   * If true, the cancel button will not be displayed.\n   */\n  hideCancel?: boolean;\n  /**\n   * If true, the cancel button will be disabled.\n   */\n  cancelDisabled?: boolean;\n  /**\n   * Text to display on the OK button.\n   */\n  okText?: string;\n  /**\n   * If true, the OK button will not be displayed.\n   */\n  hideOk?: boolean;\n  /**\n   * If true, the OK button will be disabled.\n   */\n  okDisabled?: boolean;\n}>();\n\nconst emit = defineEmits<{\n  /**\n   * Emitted when the cancel button is clicked.\n   */\n  cancel: [];\n  /**\n   * Emitted when the OK button is clicked.\n   */\n  ok: [];\n}>();\n</script>\n\n<template>\n  <div class=\"b:mt-2 b:flex b:items-center b:bg-white\">\n    <slot name=\"left\">\n      <div class=\"b:flex-auto\"></div>\n    </slot>\n\n    <slot name=\"right\">\n      <div class=\"b:flex b:flex-initial b:gap-x-2\">\n        <BButton\n          v-if=\"!hideCancel\"\n          variant=\"outlined\"\n          color=\"secondary\"\n          autofocus\n          :disabled=\"cancelDisabled\"\n          @click=\"emit('cancel')\"\n        >\n          {{ cancelText }}\n        </BButton>\n        <BButton v-if=\"!hideOk\" :disabled=\"okDisabled\" @click=\"emit('ok')\">\n          {{ okText }}\n        </BButton>\n      </div>\n    </slot>\n  </div>\n</template>\n"],"mappings":""}
+{"version":3,"file":"design-system148.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":""}

package/dist/design-system149.js

@@ -1,24 +1,236 @@
-import e from "./design-system29.js";
-import { createElementBlock as t, createElementVNode as n, createVNode as r, defineComponent as i, getCurrentInstance as a, openBlock as o, renderSlot as s, toDisplayString as c, unref as l } from "vue";
-//#region src/components/BModal/BModalHeader.vue?vue&type=script&setup=true&lang.ts
-var u = { class: "b:mb-2 b:flex b:items-center b:bg-white" }, d = { class: "b:flex-auto b:font-semibold" }, f = /* @__PURE__ */ i({
-	__name: "BModalHeader",
-	props: { title: {} },
-	setup(i) {
-		let f = a(), p = () => {
-			f?.parent?.emit("update:modelValue", !1);
+import e from "./design-system141.js";
+import { BMenuContextKey as t, BMenuSubMenuContextKey as n, isDivider as r, isItemGroup as i, isSubMenu as a } from "./design-system142.js";
+import o from "./design-system145.js";
+import s from "./design-system148.js";
+import { Fragment as c, computed as l, createBlock as u, createCommentVNode as d, createElementBlock as f, createElementVNode as p, createTextVNode as m, defineComponent as h, inject as g, normalizeClass as _, normalizeStyle as v, onBeforeUnmount as y, openBlock as b, provide as x, ref as S, renderList as C, renderSlot as w, resolveComponent as T, toDisplayString as E, unref as D } from "vue";
+//#region src/components/BMenu/BMenuSubMenu.vue?vue&type=script&setup=true&lang.ts
+var O = ["data-menu-key"], k = [
+	"tabindex",
+	"aria-expanded",
+	"aria-disabled"
+], A = {
+	key: 0,
+	class: "b-menu-submenu__icon",
+	"aria-hidden": "true"
+}, j = {
+	key: 1,
+	class: "b-menu-submenu__label"
+}, M = {
+	key: 2,
+	class: "b-menu-submenu__arrow",
+	"aria-hidden": "true"
+}, N = {
+	class: "b-menu-submenu__inline-list",
+	role: "menu"
+}, P = {
+	class: "b-menu-submenu__popup-inner",
+	role: "menu"
+}, F = /* @__PURE__ */ h({
+	__name: "BMenuSubMenu",
+	props: {
+		itemKey: {},
+		label: { default: "" },
+		icon: { default: void 0 },
+		disabled: {
+			type: Boolean,
+			default: !1
+		},
+		children: { default: () => [] },
+		popupClassName: { default: "" }
+	},
+	setup(h) {
+		let F = h, I = g(t), L = g(n, null), R = l(() => (L?.level ?? 0) + 1), z = l(() => [...L?.keyPath ?? [], F.itemKey]);
+		x(n, {
+			level: R.value,
+			keyPath: z.value
+		});
+		let B = l(() => I.openKeys.value.includes(F.itemKey)), V = l(() => {
+			function e(t) {
+				for (let n of t) if ("key" in n && I.selectedKeys.value.includes(n.key) || a(n) && n.children && e(n.children) || i(n) && n.children && e(n.children)) return !0;
+				return !1;
+			}
+			return e(F.children);
+		}), H = l(() => {
+			if (I.mode.value === "inline" && !I.inlineCollapsed.value) return `${R.value * I.inlineIndent.value}px`;
+		}), U = l(() => I.mode.value !== "inline" || I.inlineCollapsed.value), W = S(null), G = S(null), K = null, q = null;
+		function J() {
+			K &&= (clearTimeout(K), null), q &&= (clearTimeout(q), null);
+		}
+		function Y() {
+			F.disabled || I.onOpenChange(F.itemKey, !B.value);
+		}
+		function X() {
+			F.disabled || (U.value ? I.triggerSubMenuAction.value === "click" && Y() : Y());
+		}
+		function Z(e) {
+			if (!F.disabled) switch (e.key) {
+				case "Enter":
+				case " ":
+					e.preventDefault(), Y();
+					break;
+				case "ArrowRight":
+					I.mode.value !== "inline" && !B.value && (e.preventDefault(), I.onOpenChange(F.itemKey, !0));
+					break;
+				case "ArrowLeft":
+					I.mode.value !== "inline" && B.value && (e.preventDefault(), I.onOpenChange(F.itemKey, !1));
+					break;
+				case "Escape":
+					B.value && (e.preventDefault(), I.onOpenChange(F.itemKey, !1), W.value?.focus());
+					break;
+			}
+		}
+		function Q() {
+			if (F.disabled || !U.value || I.triggerSubMenuAction.value !== "hover") return;
+			J();
+			let e = I.subMenuOpenDelay.value;
+			e > 0 ? K = setTimeout(() => I.onOpenChange(F.itemKey, !0), e) : I.onOpenChange(F.itemKey, !0);
+		}
+		function $() {
+			if (F.disabled || !U.value || I.triggerSubMenuAction.value !== "hover") return;
+			J();
+			let e = I.subMenuCloseDelay.value;
+			e > 0 ? q = setTimeout(() => I.onOpenChange(F.itemKey, !1), e) : I.onOpenChange(F.itemKey, !1);
+		}
+		y(() => {
+			J();
+		});
+		let ee = l(() => ["b-menu-submenu__title", {
+			"b-menu-submenu__title--open": B.value,
+			"b-menu-submenu__title--disabled": F.disabled,
+			"b-menu-submenu__title--selected": V.value,
+			"b-menu-submenu__title--horizontal": I.mode.value === "horizontal"
+		}]), te = l(() => ["b-menu-submenu", {
+			"b-menu-submenu--open": B.value,
+			"b-menu-submenu--disabled": F.disabled,
+			"b-menu-submenu--horizontal": I.mode.value === "horizontal",
+			"b-menu-submenu--collapsed": I.inlineCollapsed.value,
+			"b-menu-submenu--popup": U.value
+		}]), ne = l(() => [
+			"b-menu-submenu__popup",
+			F.popupClassName,
+			{
+				"b-menu-submenu__popup--visible": B.value,
+				"b-menu-submenu__popup--horizontal": I.mode.value === "horizontal",
+				"b-menu-submenu__popup--vertical": I.mode.value === "vertical" || I.inlineCollapsed.value
+			}
+		]), re = l(() => ["b-menu-submenu__inline", { "b-menu-submenu__inline--open": B.value }]);
+		return (t, n) => {
+			let l = T("BMenuSubMenu", !0);
+			return b(), f("li", {
+				class: _(te.value),
+				"data-menu-key": F.itemKey,
+				role: "none",
+				onMouseenter: Q,
+				onMouseleave: $
+			}, [
+				p("div", {
+					ref_key: "titleRef",
+					ref: W,
+					class: _(ee.value),
+					style: v({ paddingInlineStart: H.value }),
+					role: "menuitem",
+					tabindex: F.disabled ? -1 : 0,
+					"aria-haspopup": !0,
+					"aria-expanded": B.value,
+					"aria-disabled": F.disabled || void 0,
+					onClick: X,
+					onKeydown: Z
+				}, [
+					F.icon || t.$slots.icon ? (b(), f("span", A, [w(t.$slots, "icon", {}, () => [m(E(F.icon), 1)])])) : d("", !0),
+					D(I).inlineCollapsed.value ? d("", !0) : (b(), f("span", j, [w(t.$slots, "title", {}, () => [m(E(F.label), 1)])])),
+					D(I).inlineCollapsed.value ? d("", !0) : (b(), f("span", M))
+				], 46, k),
+				U.value ? d("", !0) : (b(), f("div", {
+					key: 0,
+					class: _(re.value),
+					role: "none"
+				}, [p("ul", N, [w(t.$slots, "default", {}, () => [(b(!0), f(c, null, C(F.children, (t) => (b(), f(c, { key: t.key ?? t.type }, [D(r)(t) ? (b(), u(e, {
+					key: 0,
+					dashed: t.dashed
+				}, null, 8, ["dashed"])) : D(i)(t) ? (b(), u(s, {
+					key: 1,
+					label: t.label,
+					children: t.children
+				}, null, 8, ["label", "children"])) : D(a)(t) ? (b(), u(l, {
+					key: 2,
+					"item-key": t.key,
+					label: t.label,
+					icon: t.icon,
+					disabled: t.disabled,
+					children: t.children,
+					"popup-class-name": t.popupClassName
+				}, null, 8, [
+					"item-key",
+					"label",
+					"icon",
+					"disabled",
+					"children",
+					"popup-class-name"
+				])) : (b(), u(o, {
+					key: 3,
+					"item-key": t.key,
+					label: t.label,
+					icon: t.icon,
+					disabled: t.disabled,
+					danger: t.danger,
+					extra: t.extra
+				}, null, 8, [
+					"item-key",
+					"label",
+					"icon",
+					"disabled",
+					"danger",
+					"extra"
+				]))], 64))), 128))])])], 2)),
+				U.value ? (b(), f("div", {
+					key: 1,
+					ref_key: "popupRef",
+					ref: G,
+					class: _(ne.value),
+					role: "none"
+				}, [p("ul", P, [w(t.$slots, "default", {}, () => [(b(!0), f(c, null, C(F.children, (t) => (b(), f(c, { key: t.key ?? t.type }, [D(r)(t) ? (b(), u(e, {
+					key: 0,
+					dashed: t.dashed
+				}, null, 8, ["dashed"])) : D(i)(t) ? (b(), u(s, {
+					key: 1,
+					label: t.label,
+					children: t.children
+				}, null, 8, ["label", "children"])) : D(a)(t) ? (b(), u(l, {
+					key: 2,
+					"item-key": t.key,
+					label: t.label,
+					icon: t.icon,
+					disabled: t.disabled,
+					children: t.children,
+					"popup-class-name": t.popupClassName
+				}, null, 8, [
+					"item-key",
+					"label",
+					"icon",
+					"disabled",
+					"children",
+					"popup-class-name"
+				])) : (b(), u(o, {
+					key: 3,
+					"item-key": t.key,
+					label: t.label,
+					icon: t.icon,
+					disabled: t.disabled,
+					danger: t.danger,
+					extra: t.extra
+				}, null, 8, [
+					"item-key",
+					"label",
+					"icon",
+					"disabled",
+					"danger",
+					"extra"
+				]))], 64))), 128))])])], 2)) : d("", !0)
+			], 42, O);
 		};
-		return (a, f) => (o(), t("div", u, [s(a.$slots, "title", {}, () => [n("h2", d, c(i.title), 1)]), s(a.$slots, "icon", {}, () => [r(l(e), {
-			variant: "text",
-			color: "secondary",
-			"prepend-icon": "xmark",
-			"prepend-icon-size": "md",
-			autofocus: "",
-			onClick: p
-		})])]));
 	}
 });
 //#endregion
-export { f as default };
+export { F as default };
 
 //# sourceMappingURL=design-system149.js.map

package/dist/design-system149.js.map

@@ -1 +1 @@
-{"version":3,"file":"design-system149.js","names":[],"sources":["../src/components/BModal/BModalHeader.vue"],"sourcesContent":["<script setup lang=\"ts\">\nimport { BButton } from '@/components';\nimport { getCurrentInstance } from 'vue';\n\nconst { title } = defineProps<{\n  title?: string;\n}>();\n\nconst instance = getCurrentInstance();\n\nconst close = () => {\n  instance?.parent?.emit('update:modelValue', false);\n};\n</script>\n\n<template>\n  <div class=\"b:mb-2 b:flex b:items-center b:bg-white\">\n    <slot name=\"title\">\n      <h2 class=\"b:flex-auto b:font-semibold\">\n        {{ title }}\n      </h2>\n    </slot>\n    <slot name=\"icon\">\n      <BButton\n        variant=\"text\"\n        color=\"secondary\"\n        prepend-icon=\"xmark\"\n        prepend-icon-size=\"md\"\n        autofocus\n        @click=\"close\"\n      />\n    </slot>\n  </div>\n</template>\n"],"mappings":";;;;;;;EAQA,IAAM,IAAW,GAAoB,EAE/B,UAAc;AAClB,MAAU,QAAQ,KAAK,qBAAqB,GAAM;;yBAKlD,EAgBM,OAhBN,GAgBM,CAfJ,EAIO,EAAA,QAAA,SAAA,EAAA,QAAA,CAHL,EAEK,MAFL,GAEK,EADA,EAAA,MAAK,EAAA,EAAA,CAAA,CAAA,EAGZ,EASO,EAAA,QAAA,QAAA,EAAA,QAAA,CARL,EAOE,EAAA,EAAA,EAAA;GANA,SAAQ;GACR,OAAM;GACN,gBAAa;GACb,qBAAkB;GAClB,WAAA;GACC,SAAO"}
+{"version":3,"file":"design-system149.js","names":["$slots"],"sources":["../src/components/BMenu/BMenuSubMenu.vue"],"sourcesContent":["<script setup lang=\"ts\">\nimport { computed, inject, onBeforeUnmount, provide, ref } from 'vue';\nimport BMenuDivider from './BMenuDivider.vue';\nimport BMenuItem from './BMenuItem.vue';\nimport BMenuItemGroup from './BMenuItemGroup.vue';\nimport {\n  BMenuContextKey,\n  BMenuSubMenuContextKey,\n  isDivider,\n  isItemGroup,\n  isSubMenu,\n  type BMenuContext,\n  type BMenuItemUnion,\n  type BMenuSubMenuContext,\n} from './types';\n\n// ─────────────────────────────────────────────\n// Props\n// ─────────────────────────────────────────────\nconst props = withDefaults(\n  defineProps<{\n    /** Unique key identifying this submenu. */\n    itemKey: string;\n    /** Display label of the submenu title. */\n    label?: string;\n    /** Icon name rendered before the label. */\n    icon?: string;\n    /** Whether the submenu is disabled. @default false */\n    disabled?: boolean;\n    /** Child menu items. */\n    children?: BMenuItemUnion[];\n    /** Extra class for popup container. */\n    popupClassName?: string;\n  }>(),\n  {\n    label: '',\n    icon: undefined,\n    disabled: false,\n    children: () => [],\n    popupClassName: '',\n  },\n);\n\ndefineSlots<{\n  default?(): unknown;\n  icon?(): unknown;\n  title?(): unknown;\n}>();\n\n// ─────────────────────────────────────────────\n// Inject context\n// ─────────────────────────────────────────────\nconst menu = inject<BMenuContext>(BMenuContextKey)!;\nconst parentSubMenu = inject<BMenuSubMenuContext | null>(BMenuSubMenuContextKey, null);\n\nconst level = computed(() => (parentSubMenu?.level ?? 0) + 1);\nconst keyPath = computed(() => [...(parentSubMenu?.keyPath ?? []), props.itemKey]);\n\n// Provide context for children\nprovide<BMenuSubMenuContext>(BMenuSubMenuContextKey, {\n  level: level.value,\n  keyPath: keyPath.value,\n});\n\n// ─────────────────────────────────────────────\n// Open state\n// ─────────────────────────────────────────────\nconst isOpen = computed(() => menu.openKeys.value.includes(props.itemKey));\n\nconst hasSelectedChild = computed(() => {\n  function checkChildren(items: BMenuItemUnion[]): boolean {\n    for (const item of items) {\n      if ('key' in item && menu.selectedKeys.value.includes(item.key!)) return true;\n      if (isSubMenu(item) && item.children) {\n        if (checkChildren(item.children)) return true;\n      }\n      if (isItemGroup(item) && item.children) {\n        if (checkChildren(item.children)) return true;\n      }\n    }\n    return false;\n  }\n  return checkChildren(props.children);\n});\n\n// ─────────────────────────────────────────────\n// Inline indentation\n// ─────────────────────────────────────────────\nconst paddingLeft = computed(() => {\n  if (menu.mode.value !== 'inline') return undefined;\n  if (menu.inlineCollapsed.value) return undefined;\n  return `${level.value * menu.inlineIndent.value}px`;\n});\n\n// ─────────────────────────────────────────────\n// Popup positioning (vertical / horizontal)\n// ─────────────────────────────────────────────\nconst isPopupMode = computed(() => menu.mode.value !== 'inline' || menu.inlineCollapsed.value);\n\nconst titleRef = ref<HTMLElement | null>(null);\nconst popupRef = ref<HTMLElement | null>(null);\n\nlet openTimer: ReturnType<typeof setTimeout> | null = null;\nlet closeTimer: ReturnType<typeof setTimeout> | null = null;\n\nfunction clearTimers() {\n  if (openTimer) {\n    clearTimeout(openTimer);\n    openTimer = null;\n  }\n  if (closeTimer) {\n    clearTimeout(closeTimer);\n    closeTimer = null;\n  }\n}\n\n// ─────────────────────────────────────────────\n// Handlers\n// ─────────────────────────────────────────────\nfunction toggleOpen() {\n  if (props.disabled) return;\n  menu.onOpenChange(props.itemKey, !isOpen.value);\n}\n\nfunction handleTitleClick() {\n  if (props.disabled) return;\n  if (!isPopupMode.value) {\n    toggleOpen();\n  } else if (menu.triggerSubMenuAction.value === 'click') {\n    toggleOpen();\n  }\n}\n\nfunction handleTitleKeydown(e: KeyboardEvent) {\n  if (props.disabled) return;\n\n  switch (e.key) {\n    case 'Enter':\n    case ' ':\n      e.preventDefault();\n      toggleOpen();\n      break;\n    case 'ArrowRight':\n      if (menu.mode.value !== 'inline' && !isOpen.value) {\n        e.preventDefault();\n        menu.onOpenChange(props.itemKey, true);\n      }\n      break;\n    case 'ArrowLeft':\n      if (menu.mode.value !== 'inline' && isOpen.value) {\n        e.preventDefault();\n        menu.onOpenChange(props.itemKey, false);\n      }\n      break;\n    case 'Escape':\n      if (isOpen.value) {\n        e.preventDefault();\n        menu.onOpenChange(props.itemKey, false);\n        titleRef.value?.focus();\n      }\n      break;\n  }\n}\n\nfunction handleMouseEnter() {\n  if (props.disabled || !isPopupMode.value) return;\n  if (menu.triggerSubMenuAction.value !== 'hover') return;\n\n  clearTimers();\n  const delay = menu.subMenuOpenDelay.value;\n  if (delay > 0) {\n    openTimer = setTimeout(() => menu.onOpenChange(props.itemKey, true), delay);\n  } else {\n    menu.onOpenChange(props.itemKey, true);\n  }\n}\n\nfunction handleMouseLeave() {\n  if (props.disabled || !isPopupMode.value) return;\n  if (menu.triggerSubMenuAction.value !== 'hover') return;\n\n  clearTimers();\n  const delay = menu.subMenuCloseDelay.value;\n  if (delay > 0) {\n    closeTimer = setTimeout(() => menu.onOpenChange(props.itemKey, false), delay);\n  } else {\n    menu.onOpenChange(props.itemKey, false);\n  }\n}\n\nonBeforeUnmount(() => {\n  clearTimers();\n});\n\n// ─────────────────────────────────────────────\n// Classes\n// ─────────────────────────────────────────────\nconst titleClasses = computed(() => [\n  'b-menu-submenu__title',\n  {\n    'b-menu-submenu__title--open': isOpen.value,\n    'b-menu-submenu__title--disabled': props.disabled,\n    'b-menu-submenu__title--selected': hasSelectedChild.value,\n    'b-menu-submenu__title--horizontal': menu.mode.value === 'horizontal',\n  },\n]);\n\nconst submenuClasses = computed(() => [\n  'b-menu-submenu',\n  {\n    'b-menu-submenu--open': isOpen.value,\n    'b-menu-submenu--disabled': props.disabled,\n    'b-menu-submenu--horizontal': menu.mode.value === 'horizontal',\n    'b-menu-submenu--collapsed': menu.inlineCollapsed.value,\n    'b-menu-submenu--popup': isPopupMode.value,\n  },\n]);\n\nconst popupClasses = computed(() => [\n  'b-menu-submenu__popup',\n  props.popupClassName,\n  {\n    'b-menu-submenu__popup--visible': isOpen.value,\n    'b-menu-submenu__popup--horizontal': menu.mode.value === 'horizontal',\n    'b-menu-submenu__popup--vertical': menu.mode.value === 'vertical' || menu.inlineCollapsed.value,\n  },\n]);\n\nconst inlineContentClasses = computed(() => [\n  'b-menu-submenu__inline',\n  {\n    'b-menu-submenu__inline--open': isOpen.value,\n  },\n]);\n</script>\n\n<template>\n  <li\n    :class=\"submenuClasses\"\n    :data-menu-key=\"props.itemKey\"\n    role=\"none\"\n    @mouseenter=\"handleMouseEnter\"\n    @mouseleave=\"handleMouseLeave\"\n  >\n    <!-- Title -->\n    <div\n      ref=\"titleRef\"\n      :class=\"titleClasses\"\n      :style=\"{ paddingInlineStart: paddingLeft }\"\n      role=\"menuitem\"\n      :tabindex=\"props.disabled ? -1 : 0\"\n      :aria-haspopup=\"true\"\n      :aria-expanded=\"isOpen\"\n      :aria-disabled=\"props.disabled || undefined\"\n      @click=\"handleTitleClick\"\n      @keydown=\"handleTitleKeydown\"\n    >\n      <span v-if=\"props.icon || $slots.icon\" class=\"b-menu-submenu__icon\" aria-hidden=\"true\">\n        <slot name=\"icon\">{{ props.icon }}</slot>\n      </span>\n      <span v-if=\"!menu.inlineCollapsed.value\" class=\"b-menu-submenu__label\">\n        <slot name=\"title\">{{ props.label }}</slot>\n      </span>\n      <span v-if=\"!menu.inlineCollapsed.value\" class=\"b-menu-submenu__arrow\" aria-hidden=\"true\" />\n    </div>\n\n    <!-- Inline content (inline mode) -->\n    <div v-if=\"!isPopupMode\" :class=\"inlineContentClasses\" role=\"none\">\n      <ul class=\"b-menu-submenu__inline-list\" role=\"menu\">\n        <slot>\n          <template v-for=\"item in props.children\" :key=\"item.key ?? (item as any).type\">\n            <BMenuDivider v-if=\"isDivider(item)\" :dashed=\"item.dashed\" />\n            <BMenuItemGroup\n              v-else-if=\"isItemGroup(item)\"\n              :label=\"item.label\"\n              :children=\"item.children\"\n            />\n            <BMenuSubMenu\n              v-else-if=\"isSubMenu(item)\"\n              :item-key=\"item.key\"\n              :label=\"item.label\"\n              :icon=\"item.icon\"\n              :disabled=\"item.disabled\"\n              :children=\"item.children\"\n              :popup-class-name=\"item.popupClassName\"\n            />\n            <BMenuItem\n              v-else\n              :item-key=\"item.key\"\n              :label=\"item.label\"\n              :icon=\"item.icon\"\n              :disabled=\"item.disabled\"\n              :danger=\"(item as any).danger\"\n              :extra=\"(item as any).extra\"\n            />\n          </template>\n        </slot>\n      </ul>\n    </div>\n\n    <!-- Popup content (vertical / horizontal / collapsed) -->\n    <div v-if=\"isPopupMode\" ref=\"popupRef\" :class=\"popupClasses\" role=\"none\">\n      <ul class=\"b-menu-submenu__popup-inner\" role=\"menu\">\n        <slot>\n          <template v-for=\"item in props.children\" :key=\"item.key ?? (item as any).type\">\n            <BMenuDivider v-if=\"isDivider(item)\" :dashed=\"item.dashed\" />\n            <BMenuItemGroup\n              v-else-if=\"isItemGroup(item)\"\n              :label=\"item.label\"\n              :children=\"item.children\"\n            />\n            <BMenuSubMenu\n              v-else-if=\"isSubMenu(item)\"\n              :item-key=\"item.key\"\n              :label=\"item.label\"\n              :icon=\"item.icon\"\n              :disabled=\"item.disabled\"\n              :children=\"item.children\"\n              :popup-class-name=\"item.popupClassName\"\n            />\n            <BMenuItem\n              v-else\n              :item-key=\"item.key\"\n              :label=\"item.label\"\n              :icon=\"item.icon\"\n              :disabled=\"item.disabled\"\n              :danger=\"(item as any).danger\"\n              :extra=\"(item as any).extra\"\n            />\n          </template>\n        </slot>\n      </ul>\n    </div>\n  </li>\n</template>\n\n<style>\n/* ─────────────────────────────────────────────\n   BMenuSubMenu\n   ───────────────────────────────────────────── */\n.b-menu-submenu {\n  list-style: none;\n  position: relative;\n}\n\n.b-menu-submenu--horizontal {\n  display: inline-flex;\n  flex-direction: column;\n  position: relative;\n}\n\n/* ── Title ── */\n.b-menu-submenu__title {\n  display: flex;\n  align-items: center;\n  height: var(--b-menu-item-height);\n  margin-block: var(--b-menu-item-margin-block);\n  margin-inline: var(--b-menu-item-margin-inline);\n  padding-inline: var(--b-menu-item-padding-inline);\n  border-radius: var(--b-menu-item-border-radius);\n  color: var(--b-menu-item-color);\n  cursor: pointer;\n  user-select: none;\n  outline: none;\n  position: relative;\n  transition:\n    background var(--b-menu-transition-duration),\n    color var(--b-menu-transition-duration),\n    padding var(--b-menu-transition-duration);\n  box-sizing: border-box;\n}\n\n.b-menu-submenu__title:hover:not(.b-menu-submenu__title--disabled) {\n  background: var(--b-menu-item-hover-bg);\n  color: var(--b-menu-item-hover-color);\n}\n\n.b-menu-submenu__title:focus-visible {\n  outline: 2px solid #1677ff;\n  outline-offset: -2px;\n}\n\n.b-menu-submenu__title--selected {\n  color: var(--b-menu-sub-menu-item-selected-color);\n}\n\n.b-menu-submenu__title--disabled {\n  color: var(--b-menu-item-disabled-color);\n  cursor: not-allowed;\n}\n\n/* ── Horizontal title ── */\n.b-menu-submenu__title--horizontal {\n  margin-block: 0;\n  border-radius: var(--b-menu-horizontal-item-border-radius);\n  height: auto;\n  line-height: var(--b-menu-horizontal-line-height);\n}\n\n.b-menu-submenu__title--horizontal::after {\n  content: '';\n  position: absolute;\n  bottom: 0;\n  left: var(--b-menu-item-padding-inline);\n  right: var(--b-menu-item-padding-inline);\n  height: var(--b-menu-active-bar-height);\n  background: transparent;\n  transition: background var(--b-menu-transition-duration);\n}\n\n.b-menu-submenu__title--horizontal:hover:not(.b-menu-submenu__title--disabled) {\n  background: var(--b-menu-horizontal-item-hover-bg);\n  color: var(--b-menu-horizontal-item-hover-color);\n}\n\n.b-menu-submenu__title--horizontal.b-menu-submenu__title--selected {\n  color: var(--b-menu-horizontal-item-selected-color);\n}\n\n.b-menu-submenu__title--horizontal.b-menu-submenu__title--selected::after {\n  background: var(--b-menu-horizontal-item-selected-color);\n}\n\n/* ── Icon & Label ── */\n.b-menu-submenu__icon {\n  display: inline-flex;\n  align-items: center;\n  justify-content: center;\n  flex-shrink: 0;\n  font-size: var(--b-menu-icon-size);\n  margin-inline-end: var(--b-menu-icon-margin-inline-end);\n}\n\n.b-menu-submenu__label {\n  flex: 1;\n  min-width: 0;\n  overflow: hidden;\n  text-overflow: ellipsis;\n  white-space: nowrap;\n}\n\n/* ── Expand arrow (CSS-only) ── */\n.b-menu-submenu__arrow {\n  display: inline-block;\n  width: 0;\n  height: 0;\n  margin-inline-start: auto;\n  padding-inline-start: 8px;\n  position: relative;\n}\n\n.b-menu-submenu__arrow::before,\n.b-menu-submenu__arrow::after {\n  content: '';\n  position: absolute;\n  width: 6px;\n  height: 1.5px;\n  background: currentColor;\n  border-radius: 1px;\n  transition: transform var(--b-menu-transition-duration);\n  top: 50%;\n}\n\n.b-menu-submenu__arrow::before {\n  transform: rotate(-45deg) translateX(2px);\n}\n\n.b-menu-submenu__arrow::after {\n  transform: rotate(45deg) translateX(-2px);\n}\n\n.b-menu-submenu__title--open .b-menu-submenu__arrow::before {\n  transform: rotate(45deg) translateX(2px);\n}\n\n.b-menu-submenu__title--open .b-menu-submenu__arrow::after {\n  transform: rotate(-45deg) translateX(-2px);\n}\n\n/* Collapsed submenu hides arrow */\n.b-menu-submenu--collapsed .b-menu-submenu__title {\n  justify-content: center;\n  padding-inline: 0;\n}\n\n.b-menu-submenu--collapsed .b-menu-submenu__icon {\n  font-size: var(--b-menu-collapsed-icon-size);\n  margin-inline-end: 0;\n}\n\n/* ─────────────────────────────────────────────\n   Inline content (expand/collapse via grid)\n   ───────────────────────────────────────────── */\n.b-menu-submenu__inline {\n  display: grid;\n  grid-template-rows: 0fr;\n  transition: grid-template-rows var(--b-menu-transition-duration) ease;\n  overflow: hidden;\n}\n\n.b-menu-submenu__inline--open {\n  grid-template-rows: 1fr;\n}\n\n.b-menu-submenu__inline-list {\n  min-height: 0;\n  overflow: hidden;\n  list-style: none;\n  padding: 0;\n  margin: 0;\n  background: var(--b-menu-sub-menu-item-bg);\n}\n\n/* ─────────────────────────────────────────────\n   Popup content (fly-out)\n   ───────────────────────────────────────────── */\n.b-menu-submenu__popup {\n  position: absolute;\n  z-index: var(--b-menu-popup-z-index);\n  min-width: var(--b-menu-dropdown-width);\n  visibility: hidden;\n  opacity: 0;\n  pointer-events: none;\n  transition:\n    opacity var(--b-menu-transition-duration),\n    visibility var(--b-menu-transition-duration);\n}\n\n.b-menu-submenu__popup--visible {\n  visibility: visible;\n  opacity: 1;\n  pointer-events: auto;\n}\n\n.b-menu-submenu__popup--horizontal {\n  top: 100%;\n  left: 0;\n  padding-top: 4px;\n}\n\n.b-menu-submenu__popup--vertical {\n  top: 0;\n  left: 100%;\n  padding-inline-start: 4px;\n}\n\n.b-menu-submenu__popup-inner {\n  background: var(--b-menu-popup-bg);\n  border-radius: var(--b-menu-popup-border-radius);\n  box-shadow: var(--b-menu-popup-shadow);\n  padding: 4px;\n  list-style: none;\n  margin: 0;\n}\n\n.b-menu-submenu__popup-inner .b-menu-item {\n  border-radius: var(--b-menu-sub-menu-item-border-radius);\n  margin-inline: 0;\n}\n\n/* ── Reduced motion ── */\n@media (prefers-reduced-motion: reduce) {\n  .b-menu-submenu__title {\n    transition: none;\n  }\n\n  .b-menu-submenu__arrow::before,\n  .b-menu-submenu__arrow::after {\n    transition: none;\n  }\n\n  .b-menu-submenu__inline {\n    transition: none;\n  }\n\n  .b-menu-submenu__popup {\n    transition: none;\n  }\n\n  .b-menu-submenu__title--horizontal::after {\n    transition: none;\n  }\n}\n</style>\n"],"mappings":"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"}

package/dist/design-system151.js

@@ -1,161 +1,8 @@
-import { BNotificationPlacement as e, BNotificationType as t } from "./design-system3.js";
-import { Teleport as n, Transition as r, computed as i, createBlock as a, createCommentVNode as o, createElementBlock as s, createElementVNode as c, createTextVNode as l, createVNode as u, defineComponent as d, nextTick as f, normalizeClass as p, onUnmounted as m, openBlock as h, ref as g, renderSlot as _, toDisplayString as v, unref as y, useId as b, watch as x, withCtx as S } from "vue";
-//#region src/components/BNotification/BNotification.vue?vue&type=script&setup=true&lang.ts
-var C = [
-	"id",
-	"role",
-	"aria-live",
-	"aria-describedby"
-], w = {
-	key: 0,
-	class: "b-notification__icon",
-	"aria-hidden": "true"
-}, T = ["innerHTML"], E = {
-	key: 1,
-	class: "b-notification__icon-svg",
-	viewBox: "0 0 24 24",
-	xmlns: "http://www.w3.org/2000/svg",
-	focusable: "false",
-	"aria-hidden": "true"
-}, D = ["d"], O = { class: "b-notification__body" }, k = {
-	key: 1,
-	class: "b-notification__btn"
-}, A = ["innerHTML"], j = {
-	key: 1,
-	class: "b-notification__close-svg",
-	viewBox: "0 0 24 24",
-	xmlns: "http://www.w3.org/2000/svg",
-	focusable: "false",
-	"aria-hidden": "true"
-}, M = "M19 6.41L17.59 5 12 10.59 6.41 5 5 6.41 10.59 12 5 17.59 6.41 19 12 13.41 17.59 19 19 17.59 13.41 12z", N = /* @__PURE__ */ d({
-	__name: "BNotification",
-	props: {
-		type: { default: () => void 0 },
-		message: { default: "" },
-		description: { default: "" },
-		placement: { default: () => e.TopRight },
-		duration: { default: 4.5 },
-		closable: {
-			type: Boolean,
-			default: !0
-		},
-		showIcon: {
-			type: Boolean,
-			default: !0
-		},
-		icon: {},
-		closeIcon: {},
-		btn: {},
-		modelValue: {
-			type: Boolean,
-			default: () => void 0
-		}
-	},
-	emits: [
-		"close",
-		"afterClose",
-		"update:modelValue"
-	],
-	setup(e, { expose: d, emit: N }) {
-		let P = N, F = b(), I = `${F}-title`, L = `${F}-desc`, R = g(!1), z = g(null), B = g(null), V = i(() => e.modelValue === void 0 ? R.value : e.modelValue), H = i(() => e.modelValue !== void 0), U = i(() => e.type === t.Error || e.type === t.Warning ? "alert" : "status"), W = i(() => U.value === "alert" ? "assertive" : "polite"), G = i(() => !!(e.type && e.showIcon) || !!e.icon || !1), K = i(() => !!e.description), q = i(() => {
-			switch (e.type) {
-				case t.Success: return "M12 2C6.48 2 2 6.48 2 12s4.48 10 10 10 10-4.48 10-10S17.52 2 12 2zm-2 14.5-4-4 1.41-1.41L10 13.67l6.59-6.59L18 8.5l-8 8z";
-				case t.Warning: return "M1 21h22L12 2 1 21zm12-3h-2v-2h2v2zm0-4h-2v-4h2v4z";
-				case t.Error: return "M12 2C6.47 2 2 6.47 2 12s4.47 10 10 10 10-4.47 10-10S17.53 2 12 2zm5 13.59L15.59 17 12 13.41 8.41 17 7 15.59 10.59 12 7 8.41 8.41 7 12 10.59 15.59 7 17 8.41 13.41 12 17 15.59z";
-				default: return "M12 2C6.48 2 2 6.48 2 12s4.48 10 10 10 10-4.48 10-10S17.52 2 12 2zm1 15h-2v-6h2v6zm0-8h-2V7h2v2z";
-			}
-		}), J = null;
-		function Y() {
-			X(), e.duration > 0 && (J = setTimeout(() => {
-				Q();
-			}, e.duration * 1e3));
-		}
-		function X() {
-			J !== null && (clearTimeout(J), J = null);
-		}
-		function Z() {
-			H.value ? P("update:modelValue", !0) : R.value = !0;
-		}
-		function Q() {
-			P("close"), H.value ? P("update:modelValue", !1) : R.value = !1;
-		}
-		function $() {
-			B.value && document.contains(B.value) && (B.value.focus(), B.value = null), P("afterClose");
-		}
-		function ee() {
-			X();
-		}
-		function te() {
-			Y();
-		}
-		function ne(t) {
-			t.key === "Escape" && e.closable && (t.stopPropagation(), Q());
-		}
-		return x(V, async (t) => {
-			t ? (B.value = document.activeElement, Y(), e.closable && (await f(), (z.value?.querySelector(".b-notification__close"))?.focus())) : X();
-		}, { immediate: !0 }), m(() => {
-			X();
-		}), d({
-			open: Z,
-			close: Q
-		}), (t, i) => (h(), a(n, { to: "body" }, [u(r, {
-			name: "b-notification-fade",
-			onAfterLeave: $
-		}, {
-			default: S(() => [V.value ? (h(), s("div", {
-				key: 0,
-				id: y(F),
-				ref_key: "notificationRef",
-				ref: z,
-				class: p(["b-notification", [
-					e.placement && `b-notification--${e.placement}`,
-					e.type && `b-notification--${e.type}`,
-					{
-						"b-notification--with-icon": G.value,
-						"b-notification--with-description": K.value
-					}
-				]]),
-				role: U.value,
-				"aria-live": W.value,
-				"aria-atomic": !0,
-				"aria-labelledby": I,
-				"aria-describedby": K.value ? L : void 0,
-				onMouseenter: ee,
-				onMouseleave: te,
-				onKeydown: ne
-			}, [
-				G.value ? (h(), s("span", w, [_(t.$slots, "icon", {}, () => [e.icon ? (h(), s("span", {
-					key: 0,
-					innerHTML: e.icon
-				}, null, 8, T)) : e.type ? (h(), s("svg", E, [c("path", { d: q.value }, null, 8, D)])) : o("", !0)])])) : o("", !0),
-				c("div", O, [
-					c("div", {
-						id: I,
-						class: "b-notification__message"
-					}, [_(t.$slots, "message", {}, () => [l(v(e.message), 1)])]),
-					K.value || t.$slots.description ? (h(), s("div", {
-						key: 0,
-						id: L,
-						class: "b-notification__description"
-					}, [_(t.$slots, "description", {}, () => [l(v(e.description), 1)])])) : o("", !0),
-					e.btn || t.$slots.btn ? (h(), s("div", k, [_(t.$slots, "btn", {}, () => [l(v(e.btn), 1)])])) : o("", !0)
-				]),
-				e.closable ? (h(), s("button", {
-					key: 1,
-					type: "button",
-					class: "b-notification__close",
-					"aria-label": "Close notification",
-					onClick: Q
-				}, [_(t.$slots, "closeIcon", {}, () => [e.closeIcon ? (h(), s("span", {
-					key: 0,
-					innerHTML: e.closeIcon
-				}, null, 8, A)) : (h(), s("svg", j, [c("path", { d: M })]))])])) : o("", !0)
-			], 42, C)) : o("", !0)]),
-			_: 3
-		})]));
-	}
-});
+import e from "./design-system149.js";
+/* empty css                 */
+//#region src/components/BMenu/BMenuSubMenu.vue
+var t = e;
 //#endregion
-export { N as default };
+export { t as default };
 
 //# sourceMappingURL=design-system151.js.map