@7pmlabs/design-system 1.0.9 → 1.0.11

package/dist/design-system154.js.map

@@ -1 +1 @@
-{"version":3,"file":"design-system154.js","names":[],"sources":["../src/components/BPopover/BPopover.vue?vue&type=script&setup=true&lang.ts"],"sourcesContent":["import { defineComponent as _defineComponent } from 'vue'\nimport { renderSlot as _renderSlot, normalizeStyle as _normalizeStyle, createElementVNode as _createElementVNode, unref as _unref, openBlock as _openBlock, createElementBlock as _createElementBlock, createCommentVNode as _createCommentVNode, toDisplayString as _toDisplayString, createTextVNode as _createTextVNode, Fragment as _Fragment, normalizeClass as _normalizeClass } from \"vue\"\n\nconst _hoisted_1 = [\"id\"]\nconst _hoisted_2 = {\n  key: 0,\n  class: \"b-popover__arrow\",\n  \"aria-hidden\": \"true\"\n}\nconst _hoisted_3 = { class: \"b-popover__inner\" }\nconst _hoisted_4 = { class: \"b-popover__body\" }\n\nimport { useComponentId } from '@/composables/useComponentId.ts';\nimport { BPopoverPlacement, BPopoverTrigger } from '@/types.ts';\nimport { computed, nextTick, onBeforeUnmount, onMounted, ref, useId, watch } from 'vue';\n\n// ─────────────────────────────────────────────\n// Props & emits\n// ─────────────────────────────────────────────\nconst focusableSelector =\n  'a[href], button:not([disabled]), textarea:not([disabled]), input:not([disabled]), select:not([disabled]), [tabindex]:not([tabindex=\"-1\"])';\n\n\nexport default /*@__PURE__*/_defineComponent({\n  __name: 'BPopover',\n  props: {\n    title: {},\n    content: {},\n    trigger: { default: () => (BPopoverTrigger.Hover) },\n    placement: { default: () => (BPopoverPlacement.TopCenter) },\n    arrow: { type: Boolean, default: true },\n    mouseEnterDelay: { default: 100 },\n    mouseLeaveDelay: { default: 100 },\n    destroyTooltipOnHide: { type: Boolean, default: false },\n    zIndex: { default: 1030 },\n    fresh: { type: Boolean, default: false },\n    modelValue: { type: Boolean, default: () => (undefined) }\n  },\n  emits: [\"openChange\", \"update:modelValue\"],\n  setup(__props: any, { expose: __expose, emit: __emit }) {\n\n\n\nconst emit = __emit;\n\n\n\n// ─────────────────────────────────────────────\n// Internal state\n// ─────────────────────────────────────────────\nconst { componentUID } = useComponentId();\nconst popoverId = useId();\nconst titleId = `${popoverId}-title`;\n\nconst internalOpen = ref(false);\nconst isOpen = computed(() => (__props.modelValue !== undefined ? __props.modelValue : internalOpen.value));\n\nconst hasBeenOpened = ref(false);\nconst shouldRender = computed(() => {\n  if (__props.fresh) return isOpen.value;\n  if (__props.destroyTooltipOnHide) return isOpen.value;\n  return hasBeenOpened.value || isOpen.value;\n});\n\nwatch(isOpen, (val) => {\n  if (val) hasBeenOpened.value = true;\n});\n\n// ─────────────────────────────────────────────\n// Visibility control\n// ─────────────────────────────────────────────\nlet showTimer: ReturnType<typeof setTimeout> | null = null;\nlet hideTimer: ReturnType<typeof setTimeout> | null = null;\n\nfunction clearTimers() {\n  if (showTimer) {\n    clearTimeout(showTimer);\n    showTimer = null;\n  }\n  if (hideTimer) {\n    clearTimeout(hideTimer);\n    hideTimer = null;\n  }\n}\n\nfunction requestOpen(delay = 0) {\n  clearTimers();\n  if (isOpen.value) return;\n  if (delay > 0) {\n    showTimer = setTimeout(() => doOpen(), delay);\n  } else {\n    doOpen();\n  }\n}\n\nfunction requestClose(delay = 0) {\n  clearTimers();\n  if (!isOpen.value) return;\n  if (delay > 0) {\n    hideTimer = setTimeout(() => doClose(), delay);\n  } else {\n    doClose();\n  }\n}\n\nfunction doOpen() {\n  popoverRef.value?.showPopover();\n}\n\nfunction doClose() {\n  popoverRef.value?.hidePopover();\n}\n\nfunction setOpen(val: boolean) {\n  if (__props.modelValue !== undefined) {\n    emit('update:modelValue', val);\n  } else {\n    internalOpen.value = val;\n  }\n  emit('openChange', val);\n}\n\n// ─────────────────────────────────────────────\n// Popover toggle event\n// ─────────────────────────────────────────────\nconst onPopoverToggle = ({ newState }: ToggleEvent) => {\n  setOpen(newState === 'open');\n};\n\n// ─────────────────────────────────────────────\n// Refs\n// ─────────────────────────────────────────────\nconst popoverRef = ref<HTMLDivElement | null>(null);\nconst toggleRef = ref<HTMLDivElement | null>(null);\n\n// ─────────────────────────────────────────────\n// Focus management\n// ─────────────────────────────────────────────\nlet previouslyFocusedElement: HTMLElement | null = null;\n\nfunction focusPopoverContent() {\n  nextTick(() => {\n    if (!popoverRef.value) return;\n    const first = popoverRef.value.querySelector<HTMLElement>(focusableSelector);\n    if (first) {\n      first.focus();\n    } else {\n      popoverRef.value.focus();\n    }\n  });\n}\n\nfunction trapFocus(event: KeyboardEvent) {\n  if (event.key !== 'Tab' || !popoverRef.value) return;\n\n  const focusable = Array.from(popoverRef.value.querySelectorAll<HTMLElement>(focusableSelector));\n  if (focusable.length === 0) {\n    event.preventDefault();\n    return;\n  }\n\n  const first = focusable[0];\n  const last = focusable[focusable.length - 1];\n\n  if (event.shiftKey) {\n    if (document.activeElement === first) {\n      event.preventDefault();\n      last.focus();\n    }\n  } else {\n    if (document.activeElement === last) {\n      event.preventDefault();\n      first.focus();\n    }\n  }\n}\n\nwatch(isOpen, (val) => {\n  if (val) {\n    previouslyFocusedElement = document.activeElement as HTMLElement | null;\n    focusPopoverContent();\n  } else {\n    if (previouslyFocusedElement) {\n      nextTick(() => previouslyFocusedElement?.focus());\n    }\n  }\n});\n\n// ─────────────────────────────────────────────\n// Event handlers\n// ─────────────────────────────────────────────\nfunction onClick() {\n  if (isOpen.value) {\n    requestClose();\n  } else {\n    requestOpen();\n  }\n}\n\nfunction onMouseEnter() {\n  requestOpen(__props.mouseEnterDelay);\n}\n\nfunction onMouseLeave() {\n  requestClose(__props.mouseLeaveDelay);\n}\n\nfunction onFocusIn() {\n  requestOpen();\n}\n\nfunction onFocusOut() {\n  requestClose();\n}\n\nfunction onKeydown(event: KeyboardEvent) {\n  if (event.key === 'Escape' && isOpen.value) {\n    event.preventDefault();\n    requestClose();\n  }\n}\n\nfunction onPopoverKeydown(event: KeyboardEvent) {\n  if (event.key === 'Escape') {\n    event.preventDefault();\n    requestClose();\n  }\n  trapFocus(event);\n}\n\n// ─────────────────────────────────────────────\n// Popover hover (keep open when hovering content)\n// ─────────────────────────────────────────────\nfunction onPopoverMouseEnter() {\n  if (__props.trigger === BPopoverTrigger.Hover) {\n    clearTimers();\n  }\n}\n\nfunction onPopoverMouseLeave() {\n  if (__props.trigger === BPopoverTrigger.Hover) {\n    requestClose(__props.mouseLeaveDelay);\n  }\n}\n\n// ─────────────────────────────────────────────\n// Event listener management\n// ─────────────────────────────────────────────\nfunction attachListeners() {\n  const el = toggleRef.value;\n  if (!el) return;\n\n  el.addEventListener('keydown', onKeydown);\n\n  switch (__props.trigger) {\n    case BPopoverTrigger.Click:\n      el.addEventListener('click', onClick);\n      break;\n    case BPopoverTrigger.Focus:\n      el.addEventListener('focusin', onFocusIn);\n      el.addEventListener('focusout', onFocusOut);\n      break;\n    case BPopoverTrigger.Hover:\n    default:\n      el.addEventListener('mouseenter', onMouseEnter);\n      el.addEventListener('mouseleave', onMouseLeave);\n      el.addEventListener('focusin', onFocusIn);\n      el.addEventListener('focusout', onFocusOut);\n      break;\n  }\n}\n\nfunction detachListeners() {\n  const el = toggleRef.value;\n  if (!el) return;\n\n  el.removeEventListener('keydown', onKeydown);\n  el.removeEventListener('click', onClick);\n  el.removeEventListener('focusin', onFocusIn);\n  el.removeEventListener('focusout', onFocusOut);\n  el.removeEventListener('mouseenter', onMouseEnter);\n  el.removeEventListener('mouseleave', onMouseLeave);\n}\n\nonMounted(() => {\n  attachListeners();\n});\n\nonBeforeUnmount(() => {\n  detachListeners();\n  clearTimers();\n});\n\nwatch(\n  () => __props.trigger,\n  () => {\n    detachListeners();\n    attachListeners();\n  },\n);\n\n// Sync controlled v-model → popover state\nwatch(\n  () => __props.modelValue,\n  (val) => {\n    if (val === undefined) return;\n    if (val) {\n      popoverRef.value?.showPopover();\n    } else {\n      popoverRef.value?.hidePopover();\n    }\n  },\n);\n\n// ─────────────────────────────────────────────\n// Computed styles\n// ─────────────────────────────────────────────\nconst anchorName = computed(() => `--b-popover-anchor-${componentUID.value}`);\n\nconst placementClass = computed(() => {\n  const map: Record<string, string> = {\n    [BPopoverPlacement.TopLeft]: 'top-left',\n    [BPopoverPlacement.TopCenter]: 'top-center',\n    [BPopoverPlacement.TopRight]: 'top-right',\n    [BPopoverPlacement.RightTop]: 'right-top',\n    [BPopoverPlacement.RightCenter]: 'right-center',\n    [BPopoverPlacement.RightBottom]: 'right-bottom',\n    [BPopoverPlacement.BottomRight]: 'bottom-right',\n    [BPopoverPlacement.BottomCenter]: 'bottom-center',\n    [BPopoverPlacement.BottomLeft]: 'bottom-left',\n    [BPopoverPlacement.LeftBottom]: 'left-bottom',\n    [BPopoverPlacement.LeftCenter]: 'left-center',\n    [BPopoverPlacement.LeftTop]: 'left-top',\n  };\n  return map[__props.placement] ?? 'top-center';\n});\n\n// ─────────────────────────────────────────────\n// Public API\n// ─────────────────────────────────────────────\n__expose({ open: doOpen, close: doClose });\n\nreturn (_ctx: any,_cache: any) => {\n  return (_openBlock(), _createElementBlock(_Fragment, null, [\n    _createElementVNode(\"div\", {\n      ref_key: \"toggleRef\",\n      ref: toggleRef,\n      class: \"b-popover__toggle\",\n      style: _normalizeStyle({ anchorName: anchorName.value })\n    }, [\n      _renderSlot(_ctx.$slots, \"default\")\n    ], 4),\n    _createElementVNode(\"div\", {\n      ref_key: \"popoverRef\",\n      ref: popoverRef,\n      popover: \"manual\",\n      class: _normalizeClass(['b-popover__content', placementClass.value, { 'b-popover__content--no-arrow': !__props.arrow }]),\n      style: _normalizeStyle({ zIndex: __props.zIndex, positionAnchor: anchorName.value }),\n      role: \"tooltip\",\n      \"aria-labelledby\": titleId,\n      id: _unref(popoverId),\n      tabindex: \"-1\",\n      onToggle: onPopoverToggle,\n      onKeydown: onPopoverKeydown,\n      onMouseenter: onPopoverMouseEnter,\n      onMouseleave: onPopoverMouseLeave\n    }, [\n      (shouldRender.value || !__props.destroyTooltipOnHide)\n        ? (_openBlock(), _createElementBlock(_Fragment, { key: 0 }, [\n            (__props.arrow)\n              ? (_openBlock(), _createElementBlock(\"div\", _hoisted_2))\n              : _createCommentVNode(\"\", true),\n            _createElementVNode(\"div\", _hoisted_3, [\n              (__props.title || _ctx.$slots.title)\n                ? (_openBlock(), _createElementBlock(\"div\", {\n                    key: 0,\n                    id: titleId,\n                    class: \"b-popover__title\"\n                  }, [\n                    _renderSlot(_ctx.$slots, \"title\", {}, () => [\n                      _createTextVNode(_toDisplayString(__props.title), 1)\n                    ])\n                  ]))\n                : _createCommentVNode(\"\", true),\n              _createElementVNode(\"div\", _hoisted_4, [\n                _renderSlot(_ctx.$slots, \"content\", {}, () => [\n                  _createTextVNode(_toDisplayString(__props.content), 1)\n                ])\n              ])\n            ])\n          ], 64))\n        : _createCommentVNode(\"\", true)\n    ], 46, _hoisted_1)\n  ], 64))\n}\n}\n\n})"],"mappings":"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"}
+{"version":3,"file":"design-system154.js","names":[],"sources":["../src/components/BPagination/BPagination.vue"],"sourcesContent":["<script setup lang=\"ts\">\nimport { BIcon } from '@/components';\nimport { computed, ref, watch } from 'vue';\n\nimport type {\n  BPaginationAlign,\n  BPaginationQuickJumper,\n  BPaginationShowTotal,\n  BPaginationSimple,\n  BPaginationSize,\n} from './types';\n\n// ─────────────────────────────────────────────\n// Props\n// ─────────────────────────────────────────────\nconst props = withDefaults(\n  defineProps<{\n    /** Current page number (controlled). */\n    current?: number;\n    /** Default initial page number (uncontrolled). @default 1 */\n    defaultCurrent?: number;\n    /** Default number of items per page. @default 10 */\n    defaultPageSize?: number;\n    /** Number of items per page (controlled). */\n    pageSize?: number;\n    /** Available page size options. @default [10, 20, 50, 100] */\n    pageSizeOptions?: number[];\n    /** Total number of data items. @default 0 */\n    total?: number;\n    /** Disable pagination. @default false */\n    disabled?: boolean;\n    /** Hide on single page. @default false */\n    hideOnSinglePage?: boolean;\n    /** Show less page items. @default false */\n    showLessItems?: boolean;\n    /** Show quick jumper input. @default false */\n    showQuickJumper?: BPaginationQuickJumper;\n    /** Show page size changer. Auto-shown when total > totalBoundaryShowSizeChanger. */\n    showSizeChanger?: boolean;\n    /** Show title attribute on page items. @default true */\n    showTitle?: boolean;\n    /** Show total number and range. */\n    showTotal?: BPaginationShowTotal;\n    /** Simple mode. @default false */\n    simple?: BPaginationSimple;\n    /** Size of the pagination. @default 'default' */\n    size?: BPaginationSize;\n    /** Alignment of pagination within container. @default 'start' */\n    align?: BPaginationAlign;\n    /** When total exceeds this value, showSizeChanger defaults to true. @default 50 */\n    totalBoundaryShowSizeChanger?: number;\n    /** Custom aria-label for the nav element. @default 'Pagination' */\n    ariaLabel?: string;\n  }>(),\n  {\n    defaultCurrent: 1,\n    defaultPageSize: 10,\n    pageSizeOptions: () => [10, 20, 50, 100],\n    total: 0,\n    disabled: false,\n    hideOnSinglePage: false,\n    showLessItems: false,\n    showQuickJumper: false,\n    showSizeChanger: undefined,\n    showTitle: true,\n    simple: false,\n    size: 'default',\n    align: 'start',\n    totalBoundaryShowSizeChanger: 50,\n    ariaLabel: 'Pagination',\n  },\n);\n\n// ─────────────────────────────────────────────\n// Emits\n// ─────────────────────────────────────────────\nconst emit = defineEmits<{\n  /** Fires when page number or page size changes. */\n  (e: 'change', page: number, pageSize: number): void;\n  /** Fires when page size changes. */\n  (e: 'showSizeChange', current: number, size: number): void;\n  /** v-model:current binding. */\n  (e: 'update:current', page: number): void;\n  /** v-model:pageSize binding. */\n  (e: 'update:pageSize', size: number): void;\n}>();\n\n// ─────────────────────────────────────────────\n// Internal state\n// ─────────────────────────────────────────────\nconst internalCurrent = ref(props.current ?? props.defaultCurrent);\nconst internalPageSize = ref(props.pageSize ?? props.defaultPageSize);\n\nconst isCurrentControlled = computed(() => props.current !== undefined);\nconst isPageSizeControlled = computed(() => props.pageSize !== undefined);\n\nwatch(\n  () => props.current,\n  (val) => {\n    if (val !== undefined) internalCurrent.value = val;\n  },\n);\n\nwatch(\n  () => props.pageSize,\n  (val) => {\n    if (val !== undefined) internalPageSize.value = val;\n  },\n);\n\nconst activePage = computed(() =>\n  isCurrentControlled.value ? props.current! : internalCurrent.value,\n);\nconst activePageSize = computed(() =>\n  isPageSizeControlled.value ? props.pageSize! : internalPageSize.value,\n);\n\n// ─────────────────────────────────────────────\n// Derived\n// ─────────────────────────────────────────────\nconst totalPages = computed(() => {\n  if (props.total <= 0 || activePageSize.value <= 0) return 0;\n  return Math.ceil(props.total / activePageSize.value);\n});\n\nconst shouldHide = computed(() => props.hideOnSinglePage && totalPages.value <= 1);\n\nconst computedShowSizeChanger = computed(() => {\n  if (props.showSizeChanger !== undefined) return props.showSizeChanger;\n  return props.total > props.totalBoundaryShowSizeChanger;\n});\n\nconst isSimple = computed(() => !!props.simple);\nconst isSimpleReadOnly = computed(\n  () => typeof props.simple === 'object' && props.simple.readOnly === true,\n);\n\nconst totalRangeText = computed(() => {\n  if (!props.showTotal) return '';\n  const start = (activePage.value - 1) * activePageSize.value + 1;\n  const end = Math.min(activePage.value * activePageSize.value, props.total);\n  return props.showTotal(props.total, [start, end]);\n});\n\n// ─────────────────────────────────────────────\n// Page list computation\n// ─────────────────────────────────────────────\nconst pageList = computed(() => {\n  const tp = totalPages.value;\n  if (tp <= 0) return [];\n\n  const siblingCount = props.showLessItems ? 1 : 2;\n  const cur = activePage.value;\n\n  const items: Array<{ type: 'page' | 'prev-ellipsis' | 'next-ellipsis'; page: number }> = [];\n\n  items.push({ type: 'page', page: 1 });\n\n  if (tp <= (props.showLessItems ? 4 : 6) + 2) {\n    for (let i = 2; i <= tp; i++) {\n      items.push({ type: 'page', page: i });\n    }\n    return items;\n  }\n\n  const left = Math.max(2, cur - siblingCount);\n  const right = Math.min(tp - 1, cur + siblingCount);\n\n  if (left > 2) {\n    items.push({ type: 'prev-ellipsis', page: Math.max(1, cur - (props.showLessItems ? 3 : 5)) });\n  }\n\n  for (let i = left; i <= right; i++) {\n    items.push({ type: 'page', page: i });\n  }\n\n  if (right < tp - 1) {\n    items.push({\n      type: 'next-ellipsis',\n      page: Math.min(tp, cur + (props.showLessItems ? 3 : 5)),\n    });\n  }\n\n  if (tp > 1) {\n    items.push({ type: 'page', page: tp });\n  }\n\n  return items;\n});\n\n// ─────────────────────────────────────────────\n// Actions\n// ─────────────────────────────────────────────\nfunction setPage(page: number) {\n  if (props.disabled) return;\n  const clamped = Math.max(1, Math.min(page, totalPages.value));\n  if (clamped === activePage.value) return;\n\n  if (!isCurrentControlled.value) {\n    internalCurrent.value = clamped;\n  }\n  emit('update:current', clamped);\n  emit('change', clamped, activePageSize.value);\n}\n\nfunction setPageSize(newSize: number) {\n  if (props.disabled) return;\n  if (newSize === activePageSize.value) return;\n\n  const newTotalPages = Math.ceil(props.total / newSize);\n  const newCurrent = Math.min(activePage.value, newTotalPages) || 1;\n\n  if (!isPageSizeControlled.value) {\n    internalPageSize.value = newSize;\n  }\n  if (!isCurrentControlled.value) {\n    internalCurrent.value = newCurrent;\n  }\n\n  emit('update:pageSize', newSize);\n  emit('update:current', newCurrent);\n  emit('showSizeChange', newCurrent, newSize);\n  emit('change', newCurrent, newSize);\n}\n\nfunction goPrev() {\n  setPage(activePage.value - 1);\n}\n\nfunction goNext() {\n  setPage(activePage.value + 1);\n}\n\n// ─────────────────────────────────────────────\n// Quick jumper\n// ─────────────────────────────────────────────\nconst jumperValue = ref('');\n\nfunction handleJumperKeydown(event: KeyboardEvent) {\n  if (event.key === 'Enter') {\n    submitJumper();\n  }\n}\n\nfunction submitJumper() {\n  const val = parseInt(jumperValue.value, 10);\n  if (!isNaN(val) && val >= 1 && val <= totalPages.value) {\n    setPage(val);\n  }\n  jumperValue.value = '';\n}\n\n// ─────────────────────────────────────────────\n// Simple mode input\n// ─────────────────────────────────────────────\nconst simpleInputValue = ref(String(activePage.value));\n\nwatch(activePage, (val) => {\n  simpleInputValue.value = String(val);\n});\n\nfunction handleSimpleInputKeydown(event: KeyboardEvent) {\n  if (event.key === 'Enter') {\n    const val = parseInt(simpleInputValue.value, 10);\n    if (!isNaN(val)) {\n      setPage(val);\n    } else {\n      simpleInputValue.value = String(activePage.value);\n    }\n  }\n}\n\nfunction handleSimpleInputBlur() {\n  const val = parseInt(simpleInputValue.value, 10);\n  if (!isNaN(val) && val >= 1 && val <= totalPages.value) {\n    setPage(val);\n  } else {\n    simpleInputValue.value = String(activePage.value);\n  }\n}\n\n// ─────────────────────────────────────────────\n// Classes\n// ─────────────────────────────────────────────\nconst rootClasses = computed(() => [\n  'b-pagination',\n  {\n    'b-pagination--disabled': props.disabled,\n    'b-pagination--simple': isSimple.value,\n    'b-pagination--small': props.size === 'small',\n    'b-pagination--large': props.size === 'large',\n    'b-pagination--align-start': props.align === 'start',\n    'b-pagination--align-center': props.align === 'center',\n    'b-pagination--align-end': props.align === 'end',\n  },\n]);\n</script>\n\n<template>\n  <nav v-if=\"!shouldHide\" :class=\"rootClasses\" role=\"navigation\" :aria-label=\"props.ariaLabel\">\n    <!-- Total display -->\n    <span v-if=\"props.showTotal\" class=\"b-pagination__total\">\n      {{ totalRangeText }}\n    </span>\n\n    <!-- Simple mode -->\n    <template v-if=\"isSimple\">\n      <!-- Prev -->\n      <button\n        class=\"b-pagination__item b-pagination__prev\"\n        type=\"button\"\n        :disabled=\"props.disabled || activePage <= 1\"\n        :aria-disabled=\"props.disabled || activePage <= 1 ? 'true' : undefined\"\n        :title=\"props.showTitle ? 'Previous Page' : undefined\"\n        aria-label=\"Previous Page\"\n        @click=\"goPrev\"\n      >\n        <BIcon icon=\"chevron-left\" aria-hidden=\"true\" />\n      </button>\n\n      <!-- Simple input -->\n      <span class=\"b-pagination__simple-pager\">\n        <input\n          v-if=\"!isSimpleReadOnly\"\n          class=\"b-pagination__simple-input\"\n          type=\"text\"\n          inputmode=\"numeric\"\n          :value=\"simpleInputValue\"\n          :disabled=\"props.disabled\"\n          :aria-label=\"`Page ${activePage} of ${totalPages}`\"\n          @input=\"simpleInputValue = ($event.target as HTMLInputElement).value\"\n          @keydown=\"handleSimpleInputKeydown\"\n          @blur=\"handleSimpleInputBlur\"\n        />\n        <span v-else class=\"b-pagination__simple-current\" aria-current=\"page\">\n          {{ activePage }}\n        </span>\n        <span class=\"b-pagination__simple-separator\" aria-hidden=\"true\">/</span>\n        <span class=\"b-pagination__simple-total\">{{ totalPages }}</span>\n      </span>\n\n      <!-- Next -->\n      <button\n        class=\"b-pagination__item b-pagination__next\"\n        type=\"button\"\n        :disabled=\"props.disabled || activePage >= totalPages\"\n        :aria-disabled=\"props.disabled || activePage >= totalPages ? 'true' : undefined\"\n        :title=\"props.showTitle ? 'Next Page' : undefined\"\n        aria-label=\"Next Page\"\n        @click=\"goNext\"\n      >\n        <BIcon icon=\"chevron-right\" aria-hidden=\"true\" />\n      </button>\n    </template>\n\n    <!-- Normal mode -->\n    <template v-else>\n      <!-- Prev -->\n      <button\n        class=\"b-pagination__item b-pagination__prev\"\n        type=\"button\"\n        :disabled=\"props.disabled || activePage <= 1\"\n        :aria-disabled=\"props.disabled || activePage <= 1 ? 'true' : undefined\"\n        :title=\"props.showTitle ? 'Previous Page' : undefined\"\n        aria-label=\"Previous Page\"\n        @click=\"goPrev\"\n      >\n        <BIcon icon=\"chevron-left\" aria-hidden=\"true\" />\n      </button>\n\n      <!-- Page items -->\n      <template v-for=\"item in pageList\" :key=\"`${item.type}-${item.page}`\">\n        <!-- Ellipsis -->\n        <button\n          v-if=\"item.type === 'prev-ellipsis' || item.type === 'next-ellipsis'\"\n          class=\"b-pagination__item b-pagination__ellipsis\"\n          type=\"button\"\n          :disabled=\"props.disabled\"\n          :title=\"\n            props.showTitle\n              ? item.type === 'prev-ellipsis'\n                ? 'Previous 5 Pages'\n                : 'Next 5 Pages'\n              : undefined\n          \"\n          :aria-label=\"item.type === 'prev-ellipsis' ? 'Previous 5 Pages' : 'Next 5 Pages'\"\n          @click=\"setPage(item.page)\"\n        >\n          <span aria-hidden=\"true\">•••</span>\n        </button>\n\n        <!-- Page number -->\n        <button\n          v-else\n          class=\"b-pagination__item b-pagination__page\"\n          :class=\"{ 'b-pagination__page--active': item.page === activePage }\"\n          type=\"button\"\n          :disabled=\"props.disabled\"\n          :aria-current=\"item.page === activePage ? 'page' : undefined\"\n          :aria-label=\"`Page ${item.page}`\"\n          :title=\"props.showTitle ? `${item.page}` : undefined\"\n          @click=\"setPage(item.page)\"\n        >\n          {{ item.page }}\n        </button>\n      </template>\n\n      <!-- Next -->\n      <button\n        class=\"b-pagination__item b-pagination__next\"\n        type=\"button\"\n        :disabled=\"props.disabled || activePage >= totalPages\"\n        :aria-disabled=\"props.disabled || activePage >= totalPages ? 'true' : undefined\"\n        :title=\"props.showTitle ? 'Next Page' : undefined\"\n        aria-label=\"Next Page\"\n        @click=\"goNext\"\n      >\n        <BIcon icon=\"chevron-right\" aria-hidden=\"true\" />\n      </button>\n    </template>\n\n    <!-- Size changer -->\n    <select\n      v-if=\"computedShowSizeChanger && !isSimple\"\n      class=\"b-pagination__size-changer\"\n      :value=\"activePageSize\"\n      :disabled=\"props.disabled\"\n      aria-label=\"Items per page\"\n      @change=\"setPageSize(Number(($event.target as HTMLSelectElement).value))\"\n    >\n      <option v-for=\"opt in pageSizeOptions\" :key=\"opt\" :value=\"opt\">{{ opt }} / page</option>\n    </select>\n\n    <!-- Quick jumper -->\n    <span v-if=\"props.showQuickJumper && !isSimple\" class=\"b-pagination__quick-jumper\">\n      <span>Go to</span>\n      <input\n        class=\"b-pagination__jumper-input\"\n        type=\"text\"\n        inputmode=\"numeric\"\n        :value=\"jumperValue\"\n        :disabled=\"props.disabled\"\n        aria-label=\"Go to page\"\n        @input=\"jumperValue = ($event.target as HTMLInputElement).value\"\n        @keydown=\"handleJumperKeydown\"\n      />\n    </span>\n  </nav>\n</template>\n\n<style>\n/* ─────────────────────────────────────────────\n   BPagination - CSS custom properties\n   ───────────────────────────────────────────── */\n.b-pagination {\n  /* Item */\n  --b-pagination-item-bg: #ffffff;\n  --b-pagination-item-bg-hover: rgba(0, 0, 0, 0.04);\n  --b-pagination-item-size: 32px;\n  --b-pagination-item-size-sm: 24px;\n  --b-pagination-item-size-lg: 40px;\n  --b-pagination-item-border-radius: 6px;\n  --b-pagination-item-font-size: 14px;\n\n  /* Active */\n  --b-pagination-item-active-bg: #ffffff;\n  --b-pagination-item-active-color: #0958d9;\n  --b-pagination-item-active-border-color: #0958d9;\n  --b-pagination-item-active-color-hover: #1677ff;\n  --b-pagination-item-active-border-color-hover: #1677ff;\n\n  /* Disabled */\n  --b-pagination-item-active-bg-disabled: rgba(0, 0, 0, 0.15);\n  --b-pagination-item-active-color-disabled: rgba(0, 0, 0, 0.25);\n  --b-pagination-item-color-disabled: rgba(0, 0, 0, 0.25);\n\n  /* Input */\n  --b-pagination-item-input-bg: #ffffff;\n\n  /* Link */\n  --b-pagination-item-link-bg: #ffffff;\n\n  /* Layout */\n  --b-pagination-gap: 8px;\n  --b-pagination-color: rgba(0, 0, 0, 0.88);\n  --b-pagination-font-family: inherit;\n  --b-pagination-mini-options-size-changer-top: 0px;\n\n  /* Focus */\n  --b-pagination-focus-ring: 0 0 0 2px rgba(22, 119, 255, 0.2);\n\n  /* ── Layout ── */\n  display: flex;\n  align-items: center;\n  gap: var(--b-pagination-gap);\n  font-family: var(--b-pagination-font-family);\n  font-size: var(--b-pagination-item-font-size);\n  color: var(--b-pagination-color);\n  flex-wrap: wrap;\n  list-style: none;\n  padding: 0;\n  margin: 0;\n}\n\n/* ── Alignment ── */\n.b-pagination--align-start {\n  justify-content: flex-start;\n}\n\n.b-pagination--align-center {\n  justify-content: center;\n}\n\n.b-pagination--align-end {\n  justify-content: flex-end;\n}\n\n/* ── Size variants ── */\n.b-pagination--small {\n  --b-pagination-item-size: var(--b-pagination-item-size-sm);\n  --b-pagination-item-font-size: 12px;\n  --b-pagination-gap: 4px;\n}\n\n.b-pagination--large {\n  --b-pagination-item-size: var(--b-pagination-item-size-lg);\n  --b-pagination-item-font-size: 16px;\n  --b-pagination-gap: 10px;\n}\n\n/* ── Item (shared styles for page, prev, next, ellipsis) ── */\n.b-pagination__item {\n  display: inline-flex;\n  align-items: center;\n  justify-content: center;\n  min-width: var(--b-pagination-item-size);\n  height: var(--b-pagination-item-size);\n  padding: 0 6px;\n  border: 1px solid transparent;\n  border-radius: var(--b-pagination-item-border-radius);\n  background: var(--b-pagination-item-bg);\n  color: var(--b-pagination-color);\n  font-size: var(--b-pagination-item-font-size);\n  font-family: inherit;\n  line-height: 1;\n  text-align: center;\n  cursor: pointer;\n  user-select: none;\n  transition:\n    color 200ms,\n    border-color 200ms,\n    background 200ms;\n  outline: none;\n  box-sizing: border-box;\n}\n\n.b-pagination__item:hover:not(:disabled):not(.b-pagination__page--active) {\n  background: var(--b-pagination-item-bg-hover);\n  color: var(--b-pagination-item-active-color);\n}\n\n.b-pagination__item:focus-visible {\n  box-shadow: var(--b-pagination-focus-ring);\n}\n\n.b-pagination__item:disabled {\n  color: var(--b-pagination-item-color-disabled);\n  cursor: not-allowed;\n  background: transparent;\n}\n\n/* ── Active page ── */\n.b-pagination__page--active {\n  background: var(--b-pagination-item-active-bg);\n  color: var(--b-pagination-item-active-color);\n  border-color: var(--b-pagination-item-active-border-color);\n  font-weight: 500;\n  cursor: default;\n}\n\n.b-pagination__page--active:hover:not(:disabled) {\n  color: var(--b-pagination-item-active-color-hover);\n  border-color: var(--b-pagination-item-active-border-color-hover);\n  background: var(--b-pagination-item-active-bg);\n}\n\n.b-pagination__page--active:disabled {\n  background: var(--b-pagination-item-active-bg-disabled);\n  color: var(--b-pagination-item-active-color-disabled);\n  border-color: transparent;\n}\n\n/* ── Ellipsis ── */\n.b-pagination__ellipsis {\n  border-color: transparent;\n  letter-spacing: 1px;\n  color: rgba(0, 0, 0, 0.25);\n}\n\n.b-pagination__ellipsis:hover:not(:disabled) {\n  color: var(--b-pagination-item-active-color);\n  background: transparent;\n}\n\n/* ── Prev/Next arrows ── */\n.b-pagination__prev,\n.b-pagination__next {\n  background: var(--b-pagination-item-link-bg);\n}\n\n/* ── Total ── */\n.b-pagination__total {\n  white-space: nowrap;\n  font-size: var(--b-pagination-item-font-size);\n}\n\n/* ── Simple mode ── */\n.b-pagination--simple .b-pagination__simple-pager {\n  display: inline-flex;\n  align-items: center;\n  gap: 4px;\n}\n\n.b-pagination__simple-input {\n  width: 48px;\n  height: var(--b-pagination-item-size);\n  padding: 0 6px;\n  border: 1px solid #d9d9d9;\n  border-radius: var(--b-pagination-item-border-radius);\n  background: var(--b-pagination-item-input-bg);\n  color: var(--b-pagination-color);\n  font-size: var(--b-pagination-item-font-size);\n  text-align: center;\n  outline: none;\n  box-sizing: border-box;\n  transition: border-color 200ms;\n}\n\n.b-pagination__simple-input:focus {\n  border-color: var(--b-pagination-item-active-border-color);\n  box-shadow: var(--b-pagination-focus-ring);\n}\n\n.b-pagination__simple-input:disabled {\n  background: rgba(0, 0, 0, 0.04);\n  color: var(--b-pagination-item-color-disabled);\n  cursor: not-allowed;\n}\n\n.b-pagination__simple-separator {\n  color: rgba(0, 0, 0, 0.25);\n  padding: 0 2px;\n}\n\n.b-pagination__simple-current {\n  font-weight: 500;\n  color: var(--b-pagination-item-active-color);\n}\n\n/* ── Size changer ── */\n.b-pagination__size-changer {\n  height: var(--b-pagination-item-size);\n  padding: 0 8px;\n  border: 1px solid #d9d9d9;\n  border-radius: var(--b-pagination-item-border-radius);\n  background: var(--b-pagination-item-input-bg);\n  color: var(--b-pagination-color);\n  font-size: var(--b-pagination-item-font-size);\n  font-family: inherit;\n  cursor: pointer;\n  outline: none;\n  box-sizing: border-box;\n  margin-top: var(--b-pagination-mini-options-size-changer-top);\n  transition: border-color 200ms;\n}\n\n.b-pagination__size-changer:focus {\n  border-color: var(--b-pagination-item-active-border-color);\n  box-shadow: var(--b-pagination-focus-ring);\n}\n\n.b-pagination__size-changer:disabled {\n  background: rgba(0, 0, 0, 0.04);\n  color: var(--b-pagination-item-color-disabled);\n  cursor: not-allowed;\n}\n\n/* ── Quick jumper ── */\n.b-pagination__quick-jumper {\n  display: inline-flex;\n  align-items: center;\n  gap: 8px;\n  font-size: var(--b-pagination-item-font-size);\n  white-space: nowrap;\n}\n\n.b-pagination__jumper-input {\n  width: 50px;\n  height: var(--b-pagination-item-size);\n  padding: 0 6px;\n  border: 1px solid #d9d9d9;\n  border-radius: var(--b-pagination-item-border-radius);\n  background: var(--b-pagination-item-input-bg);\n  color: var(--b-pagination-color);\n  font-size: var(--b-pagination-item-font-size);\n  text-align: center;\n  outline: none;\n  box-sizing: border-box;\n  transition: border-color 200ms;\n}\n\n.b-pagination__jumper-input:focus {\n  border-color: var(--b-pagination-item-active-border-color);\n  box-shadow: var(--b-pagination-focus-ring);\n}\n\n.b-pagination__jumper-input:disabled {\n  background: rgba(0, 0, 0, 0.04);\n  color: var(--b-pagination-item-color-disabled);\n  cursor: not-allowed;\n}\n\n/* ── Disabled state (entire control) ── */\n.b-pagination--disabled {\n  opacity: 0.65;\n  pointer-events: none;\n}\n\n/* ── Dark mode ── */\n[data-prefers-color='dark'] .b-pagination {\n  --b-pagination-item-bg: #1d1d1d;\n  --b-pagination-item-bg-hover: rgba(255, 255, 255, 0.08);\n  --b-pagination-item-active-bg: #1d1d1d;\n  --b-pagination-item-active-color: #4096ff;\n  --b-pagination-item-active-border-color: #4096ff;\n  --b-pagination-item-active-color-hover: #69b1ff;\n  --b-pagination-item-active-border-color-hover: #69b1ff;\n  --b-pagination-item-active-bg-disabled: rgba(255, 255, 255, 0.08);\n  --b-pagination-item-active-color-disabled: rgba(255, 255, 255, 0.3);\n  --b-pagination-item-color-disabled: rgba(255, 255, 255, 0.3);\n  --b-pagination-item-input-bg: #1d1d1d;\n  --b-pagination-item-link-bg: #1d1d1d;\n  --b-pagination-color: rgba(255, 255, 255, 0.88);\n  --b-pagination-focus-ring: 0 0 0 2px rgba(64, 150, 255, 0.25);\n}\n\n@media (prefers-color-scheme: dark) {\n  [data-prefers-color='system'] .b-pagination {\n    --b-pagination-item-bg: #1d1d1d;\n    --b-pagination-item-bg-hover: rgba(255, 255, 255, 0.08);\n    --b-pagination-item-active-bg: #1d1d1d;\n    --b-pagination-item-active-color: #4096ff;\n    --b-pagination-item-active-border-color: #4096ff;\n    --b-pagination-item-active-color-hover: #69b1ff;\n    --b-pagination-item-active-border-color-hover: #69b1ff;\n    --b-pagination-item-active-bg-disabled: rgba(255, 255, 255, 0.08);\n    --b-pagination-item-active-color-disabled: rgba(255, 255, 255, 0.3);\n    --b-pagination-item-color-disabled: rgba(255, 255, 255, 0.3);\n    --b-pagination-item-input-bg: #1d1d1d;\n    --b-pagination-item-link-bg: #1d1d1d;\n    --b-pagination-color: rgba(255, 255, 255, 0.88);\n    --b-pagination-focus-ring: 0 0 0 2px rgba(64, 150, 255, 0.25);\n  }\n}\n\n/* ── Reduced motion ── */\n@media (prefers-reduced-motion: reduce) {\n  .b-pagination__item,\n  .b-pagination__simple-input,\n  .b-pagination__size-changer,\n  .b-pagination__jumper-input {\n    transition: none;\n  }\n}\n</style>\n"],"mappings":"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"}

package/dist/design-system156.js

@@ -1,6 +1,6 @@
 import e from "./design-system154.js";
 /* empty css                 */
-//#region src/components/BPopover/BPopover.vue
+//#region src/components/BPagination/BPagination.vue
 var t = e;
 //#endregion
 export { t as default };

package/dist/design-system156.js.map

@@ -1 +1 @@
-{"version":3,"file":"design-system156.js","names":[],"sources":["../src/components/BPopover/BPopover.vue"],"sourcesContent":["<script setup lang=\"ts\">\nimport { useComponentId } from '@/composables/useComponentId.ts';\nimport { BPopoverPlacement, BPopoverTrigger } from '@/types.ts';\nimport { computed, nextTick, onBeforeUnmount, onMounted, ref, useId, watch } from 'vue';\n\n// ─────────────────────────────────────────────\n// Props & emits\n// ─────────────────────────────────────────────\nconst {\n  title,\n  content,\n  trigger = BPopoverTrigger.Hover,\n  placement = BPopoverPlacement.TopCenter,\n  arrow = true,\n  mouseEnterDelay = 100,\n  mouseLeaveDelay = 100,\n  destroyTooltipOnHide = false,\n  zIndex = 1030,\n  fresh = false,\n  modelValue = undefined,\n} = defineProps<{\n  /** The title shown at the top of the popover. Also accepts the `title` slot. */\n  title?: string;\n  /** The main content of the popover. Also accepts the `content` slot. */\n  content?: string;\n  /** The event that triggers the popover to open. */\n  trigger?: `${BPopoverTrigger}`;\n  /** Placement of the popover relative to the target element. */\n  placement?: `${BPopoverPlacement}`;\n  /** Whether the popover has an arrow pointing to the target. */\n  arrow?: boolean;\n  /** Delay in ms before showing on mouseenter. */\n  mouseEnterDelay?: number;\n  /** Delay in ms before hiding on mouseleave. */\n  mouseLeaveDelay?: number;\n  /** Whether to destroy the popover DOM when hidden. */\n  destroyTooltipOnHide?: boolean;\n  /** z-index of the popover. */\n  zIndex?: number;\n  /** Force re-render when popover is shown. */\n  fresh?: boolean;\n  /** Controlled visibility - bind with `v-model`. */\n  modelValue?: boolean;\n}>();\n\nconst emit = defineEmits<{\n  /** Emitted when the popover visibility changes. */\n  (e: 'openChange', open: boolean): void;\n  /** v-model support. */\n  (e: 'update:modelValue', value: boolean): void;\n}>();\n\ndefineSlots<{\n  /** The target element that triggers the popover. */\n  default?(): unknown;\n  /** Overrides the `title` prop with custom content. */\n  title?(): unknown;\n  /** Overrides the `content` prop with custom content. */\n  content?(): unknown;\n}>();\n\n// ─────────────────────────────────────────────\n// Internal state\n// ─────────────────────────────────────────────\nconst { componentUID } = useComponentId();\nconst popoverId = useId();\nconst titleId = `${popoverId}-title`;\n\nconst internalOpen = ref(false);\nconst isOpen = computed(() => (modelValue !== undefined ? modelValue : internalOpen.value));\n\nconst hasBeenOpened = ref(false);\nconst shouldRender = computed(() => {\n  if (fresh) return isOpen.value;\n  if (destroyTooltipOnHide) return isOpen.value;\n  return hasBeenOpened.value || isOpen.value;\n});\n\nwatch(isOpen, (val) => {\n  if (val) hasBeenOpened.value = true;\n});\n\n// ─────────────────────────────────────────────\n// Visibility control\n// ─────────────────────────────────────────────\nlet showTimer: ReturnType<typeof setTimeout> | null = null;\nlet hideTimer: ReturnType<typeof setTimeout> | null = null;\n\nfunction clearTimers() {\n  if (showTimer) {\n    clearTimeout(showTimer);\n    showTimer = null;\n  }\n  if (hideTimer) {\n    clearTimeout(hideTimer);\n    hideTimer = null;\n  }\n}\n\nfunction requestOpen(delay = 0) {\n  clearTimers();\n  if (isOpen.value) return;\n  if (delay > 0) {\n    showTimer = setTimeout(() => doOpen(), delay);\n  } else {\n    doOpen();\n  }\n}\n\nfunction requestClose(delay = 0) {\n  clearTimers();\n  if (!isOpen.value) return;\n  if (delay > 0) {\n    hideTimer = setTimeout(() => doClose(), delay);\n  } else {\n    doClose();\n  }\n}\n\nfunction doOpen() {\n  popoverRef.value?.showPopover();\n}\n\nfunction doClose() {\n  popoverRef.value?.hidePopover();\n}\n\nfunction setOpen(val: boolean) {\n  if (modelValue !== undefined) {\n    emit('update:modelValue', val);\n  } else {\n    internalOpen.value = val;\n  }\n  emit('openChange', val);\n}\n\n// ─────────────────────────────────────────────\n// Popover toggle event\n// ─────────────────────────────────────────────\nconst onPopoverToggle = ({ newState }: ToggleEvent) => {\n  setOpen(newState === 'open');\n};\n\n// ─────────────────────────────────────────────\n// Refs\n// ─────────────────────────────────────────────\nconst popoverRef = ref<HTMLDivElement | null>(null);\nconst toggleRef = ref<HTMLDivElement | null>(null);\n\n// ─────────────────────────────────────────────\n// Focus management\n// ─────────────────────────────────────────────\nlet previouslyFocusedElement: HTMLElement | null = null;\n\nconst focusableSelector =\n  'a[href], button:not([disabled]), textarea:not([disabled]), input:not([disabled]), select:not([disabled]), [tabindex]:not([tabindex=\"-1\"])';\n\nfunction focusPopoverContent() {\n  nextTick(() => {\n    if (!popoverRef.value) return;\n    const first = popoverRef.value.querySelector<HTMLElement>(focusableSelector);\n    if (first) {\n      first.focus();\n    } else {\n      popoverRef.value.focus();\n    }\n  });\n}\n\nfunction trapFocus(event: KeyboardEvent) {\n  if (event.key !== 'Tab' || !popoverRef.value) return;\n\n  const focusable = Array.from(popoverRef.value.querySelectorAll<HTMLElement>(focusableSelector));\n  if (focusable.length === 0) {\n    event.preventDefault();\n    return;\n  }\n\n  const first = focusable[0];\n  const last = focusable[focusable.length - 1];\n\n  if (event.shiftKey) {\n    if (document.activeElement === first) {\n      event.preventDefault();\n      last.focus();\n    }\n  } else {\n    if (document.activeElement === last) {\n      event.preventDefault();\n      first.focus();\n    }\n  }\n}\n\nwatch(isOpen, (val) => {\n  if (val) {\n    previouslyFocusedElement = document.activeElement as HTMLElement | null;\n    focusPopoverContent();\n  } else {\n    if (previouslyFocusedElement) {\n      nextTick(() => previouslyFocusedElement?.focus());\n    }\n  }\n});\n\n// ─────────────────────────────────────────────\n// Event handlers\n// ─────────────────────────────────────────────\nfunction onClick() {\n  if (isOpen.value) {\n    requestClose();\n  } else {\n    requestOpen();\n  }\n}\n\nfunction onMouseEnter() {\n  requestOpen(mouseEnterDelay);\n}\n\nfunction onMouseLeave() {\n  requestClose(mouseLeaveDelay);\n}\n\nfunction onFocusIn() {\n  requestOpen();\n}\n\nfunction onFocusOut() {\n  requestClose();\n}\n\nfunction onKeydown(event: KeyboardEvent) {\n  if (event.key === 'Escape' && isOpen.value) {\n    event.preventDefault();\n    requestClose();\n  }\n}\n\nfunction onPopoverKeydown(event: KeyboardEvent) {\n  if (event.key === 'Escape') {\n    event.preventDefault();\n    requestClose();\n  }\n  trapFocus(event);\n}\n\n// ─────────────────────────────────────────────\n// Popover hover (keep open when hovering content)\n// ─────────────────────────────────────────────\nfunction onPopoverMouseEnter() {\n  if (trigger === BPopoverTrigger.Hover) {\n    clearTimers();\n  }\n}\n\nfunction onPopoverMouseLeave() {\n  if (trigger === BPopoverTrigger.Hover) {\n    requestClose(mouseLeaveDelay);\n  }\n}\n\n// ─────────────────────────────────────────────\n// Event listener management\n// ─────────────────────────────────────────────\nfunction attachListeners() {\n  const el = toggleRef.value;\n  if (!el) return;\n\n  el.addEventListener('keydown', onKeydown);\n\n  switch (trigger) {\n    case BPopoverTrigger.Click:\n      el.addEventListener('click', onClick);\n      break;\n    case BPopoverTrigger.Focus:\n      el.addEventListener('focusin', onFocusIn);\n      el.addEventListener('focusout', onFocusOut);\n      break;\n    case BPopoverTrigger.Hover:\n    default:\n      el.addEventListener('mouseenter', onMouseEnter);\n      el.addEventListener('mouseleave', onMouseLeave);\n      el.addEventListener('focusin', onFocusIn);\n      el.addEventListener('focusout', onFocusOut);\n      break;\n  }\n}\n\nfunction detachListeners() {\n  const el = toggleRef.value;\n  if (!el) return;\n\n  el.removeEventListener('keydown', onKeydown);\n  el.removeEventListener('click', onClick);\n  el.removeEventListener('focusin', onFocusIn);\n  el.removeEventListener('focusout', onFocusOut);\n  el.removeEventListener('mouseenter', onMouseEnter);\n  el.removeEventListener('mouseleave', onMouseLeave);\n}\n\nonMounted(() => {\n  attachListeners();\n});\n\nonBeforeUnmount(() => {\n  detachListeners();\n  clearTimers();\n});\n\nwatch(\n  () => trigger,\n  () => {\n    detachListeners();\n    attachListeners();\n  },\n);\n\n// Sync controlled v-model → popover state\nwatch(\n  () => modelValue,\n  (val) => {\n    if (val === undefined) return;\n    if (val) {\n      popoverRef.value?.showPopover();\n    } else {\n      popoverRef.value?.hidePopover();\n    }\n  },\n);\n\n// ─────────────────────────────────────────────\n// Computed styles\n// ─────────────────────────────────────────────\nconst anchorName = computed(() => `--b-popover-anchor-${componentUID.value}`);\n\nconst placementClass = computed(() => {\n  const map: Record<string, string> = {\n    [BPopoverPlacement.TopLeft]: 'top-left',\n    [BPopoverPlacement.TopCenter]: 'top-center',\n    [BPopoverPlacement.TopRight]: 'top-right',\n    [BPopoverPlacement.RightTop]: 'right-top',\n    [BPopoverPlacement.RightCenter]: 'right-center',\n    [BPopoverPlacement.RightBottom]: 'right-bottom',\n    [BPopoverPlacement.BottomRight]: 'bottom-right',\n    [BPopoverPlacement.BottomCenter]: 'bottom-center',\n    [BPopoverPlacement.BottomLeft]: 'bottom-left',\n    [BPopoverPlacement.LeftBottom]: 'left-bottom',\n    [BPopoverPlacement.LeftCenter]: 'left-center',\n    [BPopoverPlacement.LeftTop]: 'left-top',\n  };\n  return map[placement] ?? 'top-center';\n});\n\n// ─────────────────────────────────────────────\n// Public API\n// ─────────────────────────────────────────────\ndefineExpose({ open: doOpen, close: doClose });\n</script>\n\n<template>\n  <div ref=\"toggleRef\" class=\"b-popover__toggle\" :style=\"{ anchorName: anchorName }\">\n    <slot />\n  </div>\n\n  <div\n    ref=\"popoverRef\"\n    popover=\"manual\"\n    :class=\"['b-popover__content', placementClass, { 'b-popover__content--no-arrow': !arrow }]\"\n    :style=\"{ zIndex, positionAnchor: anchorName }\"\n    role=\"tooltip\"\n    :aria-labelledby=\"titleId\"\n    :id=\"popoverId\"\n    tabindex=\"-1\"\n    @toggle=\"onPopoverToggle\"\n    @keydown=\"onPopoverKeydown\"\n    @mouseenter=\"onPopoverMouseEnter\"\n    @mouseleave=\"onPopoverMouseLeave\"\n  >\n    <template v-if=\"shouldRender || !destroyTooltipOnHide\">\n      <div v-if=\"arrow\" class=\"b-popover__arrow\" aria-hidden=\"true\" />\n      <div class=\"b-popover__inner\">\n        <div v-if=\"title || $slots.title\" :id=\"titleId\" class=\"b-popover__title\">\n          <slot name=\"title\">{{ title }}</slot>\n        </div>\n        <div class=\"b-popover__body\">\n          <slot name=\"content\">{{ content }}</slot>\n        </div>\n      </div>\n    </template>\n  </div>\n</template>\n\n<style>\n/* ────────────────────────────────────────────\n   CSS Custom Properties (tokens)\n   ──────────────────────────────────────────── */\n.b-popover__content {\n  --b-popover-bg: #fff;\n  --b-popover-color: oklch(25% 0 0);\n  --b-popover-font-size: 0.875rem;\n  --b-popover-line-height: 1.5;\n  --b-popover-padding-x: 0.75rem;\n  --b-popover-padding-y: 0.75rem;\n  --b-popover-border-radius: 0.5rem;\n  --b-popover-max-width: 320px;\n  --b-popover-min-width: 177px;\n  --b-popover-arrow-size: 8px;\n  --b-popover-arrow-color: #fff;\n  --b-popover-gap: 8px;\n  --b-popover-transition-duration: 200ms;\n  --b-popover-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-popover-title-font-weight: 600;\n  --b-popover-title-font-size: 0.875rem;\n  --b-popover-title-color: oklch(15% 0 0);\n  --b-popover-title-padding-bottom: 0.5rem;\n  --b-popover-title-border-bottom: 1px solid oklch(90% 0 0);\n  --b-popover-title-margin-bottom: 0.5rem;\n  --b-popover-body-color: oklch(35% 0 0);\n}\n\n/* ── Dark mode ── */\n[data-prefers-color='dark'] .b-popover__content {\n  --b-popover-bg: oklch(22% 0 0);\n  --b-popover-color: oklch(90% 0 0);\n  --b-popover-arrow-color: oklch(22% 0 0);\n  --b-popover-shadow:\n    0 6px 16px 0 rgba(0, 0, 0, 0.24), 0 3px 6px -4px rgba(0, 0, 0, 0.36),\n    0 9px 28px 8px rgba(0, 0, 0, 0.2);\n  --b-popover-title-color: oklch(95% 0 0);\n  --b-popover-title-border-bottom: 1px solid oklch(30% 0 0);\n  --b-popover-body-color: oklch(75% 0 0);\n}\n\n@media (prefers-color-scheme: dark) {\n  [data-prefers-color='system'] .b-popover__content {\n    --b-popover-bg: oklch(22% 0 0);\n    --b-popover-color: oklch(90% 0 0);\n    --b-popover-arrow-color: oklch(22% 0 0);\n    --b-popover-shadow:\n      0 6px 16px 0 rgba(0, 0, 0, 0.24), 0 3px 6px -4px rgba(0, 0, 0, 0.36),\n      0 9px 28px 8px rgba(0, 0, 0, 0.2);\n    --b-popover-title-color: oklch(95% 0 0);\n    --b-popover-title-border-bottom: 1px solid oklch(30% 0 0);\n    --b-popover-body-color: oklch(75% 0 0);\n  }\n}\n\n/* ─────────────────────────────────────────────\n   Toggle wrapper\n   ───────────────────────────────────────────── */\n.b-popover__toggle {\n  display: inline-block;\n}\n\n/* ─────────────────────────────────────────────\n   Popover content (popover)\n   ───────────────────────────────────────────── */\n.b-popover__content {\n  /* Reset popover defaults */\n  position: absolute;\n  border: none;\n  padding: 0;\n  margin: 0;\n  background: transparent;\n  overflow: visible;\n  max-width: var(--b-popover-max-width);\n  min-width: var(--b-popover-min-width);\n  box-sizing: border-box;\n  pointer-events: auto;\n\n  /* Animation and visibility */\n  transition:\n    display var(--b-popover-transition-duration),\n    opacity var(--b-popover-transition-duration);\n  transition-behavior: allow-discrete;\n  opacity: 0;\n\n  &:popover-open {\n    opacity: 1;\n\n    @starting-style {\n      opacity: 0;\n    }\n  }\n\n  /* ── Placement: Top ── */\n  &.top-left {\n    inset: auto;\n    bottom: anchor(top);\n    left: anchor(left);\n    margin-bottom: var(--b-popover-gap);\n  }\n  &.top-center {\n    inset: auto;\n    bottom: anchor(top);\n    justify-self: anchor-center;\n    margin-bottom: var(--b-popover-gap);\n  }\n  &.top-right {\n    inset: auto;\n    bottom: anchor(top);\n    right: anchor(right);\n    margin-bottom: var(--b-popover-gap);\n  }\n\n  /* ── Placement: Right ── */\n  &.right-top {\n    inset: auto;\n    top: anchor(top);\n    left: anchor(right);\n    margin-left: var(--b-popover-gap);\n  }\n  &.right-center {\n    inset: auto;\n    align-self: anchor-center;\n    left: anchor(right);\n    margin-left: var(--b-popover-gap);\n  }\n  &.right-bottom {\n    inset: auto;\n    bottom: anchor(bottom);\n    left: anchor(right);\n    margin-left: var(--b-popover-gap);\n  }\n\n  /* ── Placement: Bottom ── */\n  &.bottom-right {\n    inset: auto;\n    top: anchor(bottom);\n    right: anchor(right);\n    margin-top: var(--b-popover-gap);\n  }\n  &.bottom-center {\n    inset: auto;\n    top: anchor(bottom);\n    justify-self: anchor-center;\n    margin-top: var(--b-popover-gap);\n  }\n  &.bottom-left {\n    inset: auto;\n    top: anchor(bottom);\n    left: anchor(left);\n    margin-top: var(--b-popover-gap);\n  }\n\n  /* ── Placement: Left ── */\n  &.left-bottom {\n    inset: auto;\n    bottom: anchor(bottom);\n    right: anchor(left);\n    margin-right: var(--b-popover-gap);\n  }\n  &.left-center {\n    inset: auto;\n    align-self: anchor-center;\n    right: anchor(left);\n    margin-right: var(--b-popover-gap);\n  }\n  &.left-top {\n    inset: auto;\n    top: anchor(top);\n    right: anchor(left);\n    margin-right: var(--b-popover-gap);\n  }\n}\n\n/* ─────────────────────────────────────────────\n   Inner content\n   ───────────────────────────────────────────── */\n.b-popover__inner {\n  background: var(--b-popover-bg);\n  color: var(--b-popover-color);\n  font-size: var(--b-popover-font-size);\n  line-height: var(--b-popover-line-height);\n  padding: var(--b-popover-padding-y) var(--b-popover-padding-x);\n  border-radius: var(--b-popover-border-radius);\n  box-shadow: var(--b-popover-shadow);\n  word-wrap: break-word;\n}\n\n/* ─────────────────────────────────────────────\n   Title\n   ───────────────────────────────────────────── */\n.b-popover__title {\n  font-weight: var(--b-popover-title-font-weight);\n  font-size: var(--b-popover-title-font-size);\n  color: var(--b-popover-title-color);\n  padding-bottom: var(--b-popover-title-padding-bottom);\n  border-bottom: var(--b-popover-title-border-bottom);\n  margin-bottom: var(--b-popover-title-margin-bottom);\n}\n\n/* ─────────────────────────────────────────────\n   Body\n   ───────────────────────────────────────────── */\n.b-popover__body {\n  color: var(--b-popover-body-color);\n}\n\n/* ─────────────────────────────────────────────\n   Arrow\n   ───────────────────────────────────────────── */\n.b-popover__arrow {\n  position: absolute;\n  width: var(--b-popover-arrow-size);\n  height: var(--b-popover-arrow-size);\n  background: var(--b-popover-arrow-color);\n  transform: rotate(45deg);\n  pointer-events: none;\n}\n\n/* Arrow positioning for top placements */\n.b-popover__content.top-left .b-popover__arrow,\n.b-popover__content.top-center .b-popover__arrow,\n.b-popover__content.top-right .b-popover__arrow {\n  bottom: calc(var(--b-popover-arrow-size) / -2);\n  left: 50%;\n  margin-left: calc(var(--b-popover-arrow-size) / -2);\n}\n\n/* Arrow positioning for bottom placements */\n.b-popover__content.bottom-left .b-popover__arrow,\n.b-popover__content.bottom-center .b-popover__arrow,\n.b-popover__content.bottom-right .b-popover__arrow {\n  top: calc(var(--b-popover-arrow-size) / -2);\n  left: 50%;\n  margin-left: calc(var(--b-popover-arrow-size) / -2);\n}\n\n/* Arrow positioning for right placements */\n.b-popover__content.right-top .b-popover__arrow,\n.b-popover__content.right-center .b-popover__arrow,\n.b-popover__content.right-bottom .b-popover__arrow {\n  left: calc(var(--b-popover-arrow-size) / -2);\n  top: 50%;\n  margin-top: calc(var(--b-popover-arrow-size) / -2);\n}\n\n/* Arrow positioning for left placements */\n.b-popover__content.left-top .b-popover__arrow,\n.b-popover__content.left-center .b-popover__arrow,\n.b-popover__content.left-bottom .b-popover__arrow {\n  right: calc(var(--b-popover-arrow-size) / -2);\n  top: 50%;\n  margin-top: calc(var(--b-popover-arrow-size) / -2);\n}\n\n/* ─────────────────────────────────────────────\n   Position fallbacks (auto-adjust overflow)\n   ───────────────────────────────────────────── */\n@position-try --b-popover-top-center {\n  inset: auto;\n  bottom: anchor(top);\n  justify-self: anchor-center;\n  margin-bottom: var(--b-popover-gap);\n}\n\n@position-try --b-popover-bottom-center {\n  inset: auto;\n  top: anchor(bottom);\n  justify-self: anchor-center;\n  margin-top: var(--b-popover-gap);\n}\n\n@position-try --b-popover-right-center {\n  inset: auto;\n  align-self: anchor-center;\n  left: anchor(right);\n  margin-left: var(--b-popover-gap);\n}\n\n@position-try --b-popover-left-center {\n  inset: auto;\n  align-self: anchor-center;\n  right: anchor(left);\n  margin-right: var(--b-popover-gap);\n}\n\n/* ── Reduced motion ── */\n@media (prefers-reduced-motion: reduce) {\n  .b-popover__content {\n    transition-duration: 0ms;\n  }\n}\n</style>\n"],"mappings":""}
+{"version":3,"file":"design-system156.js","names":[],"sources":["../src/components/BPagination/BPagination.vue"],"sourcesContent":["<script setup lang=\"ts\">\nimport { BIcon } from '@/components';\nimport { computed, ref, watch } from 'vue';\n\nimport type {\n  BPaginationAlign,\n  BPaginationQuickJumper,\n  BPaginationShowTotal,\n  BPaginationSimple,\n  BPaginationSize,\n} from './types';\n\n// ─────────────────────────────────────────────\n// Props\n// ─────────────────────────────────────────────\nconst props = withDefaults(\n  defineProps<{\n    /** Current page number (controlled). */\n    current?: number;\n    /** Default initial page number (uncontrolled). @default 1 */\n    defaultCurrent?: number;\n    /** Default number of items per page. @default 10 */\n    defaultPageSize?: number;\n    /** Number of items per page (controlled). */\n    pageSize?: number;\n    /** Available page size options. @default [10, 20, 50, 100] */\n    pageSizeOptions?: number[];\n    /** Total number of data items. @default 0 */\n    total?: number;\n    /** Disable pagination. @default false */\n    disabled?: boolean;\n    /** Hide on single page. @default false */\n    hideOnSinglePage?: boolean;\n    /** Show less page items. @default false */\n    showLessItems?: boolean;\n    /** Show quick jumper input. @default false */\n    showQuickJumper?: BPaginationQuickJumper;\n    /** Show page size changer. Auto-shown when total > totalBoundaryShowSizeChanger. */\n    showSizeChanger?: boolean;\n    /** Show title attribute on page items. @default true */\n    showTitle?: boolean;\n    /** Show total number and range. */\n    showTotal?: BPaginationShowTotal;\n    /** Simple mode. @default false */\n    simple?: BPaginationSimple;\n    /** Size of the pagination. @default 'default' */\n    size?: BPaginationSize;\n    /** Alignment of pagination within container. @default 'start' */\n    align?: BPaginationAlign;\n    /** When total exceeds this value, showSizeChanger defaults to true. @default 50 */\n    totalBoundaryShowSizeChanger?: number;\n    /** Custom aria-label for the nav element. @default 'Pagination' */\n    ariaLabel?: string;\n  }>(),\n  {\n    defaultCurrent: 1,\n    defaultPageSize: 10,\n    pageSizeOptions: () => [10, 20, 50, 100],\n    total: 0,\n    disabled: false,\n    hideOnSinglePage: false,\n    showLessItems: false,\n    showQuickJumper: false,\n    showSizeChanger: undefined,\n    showTitle: true,\n    simple: false,\n    size: 'default',\n    align: 'start',\n    totalBoundaryShowSizeChanger: 50,\n    ariaLabel: 'Pagination',\n  },\n);\n\n// ─────────────────────────────────────────────\n// Emits\n// ─────────────────────────────────────────────\nconst emit = defineEmits<{\n  /** Fires when page number or page size changes. */\n  (e: 'change', page: number, pageSize: number): void;\n  /** Fires when page size changes. */\n  (e: 'showSizeChange', current: number, size: number): void;\n  /** v-model:current binding. */\n  (e: 'update:current', page: number): void;\n  /** v-model:pageSize binding. */\n  (e: 'update:pageSize', size: number): void;\n}>();\n\n// ─────────────────────────────────────────────\n// Internal state\n// ─────────────────────────────────────────────\nconst internalCurrent = ref(props.current ?? props.defaultCurrent);\nconst internalPageSize = ref(props.pageSize ?? props.defaultPageSize);\n\nconst isCurrentControlled = computed(() => props.current !== undefined);\nconst isPageSizeControlled = computed(() => props.pageSize !== undefined);\n\nwatch(\n  () => props.current,\n  (val) => {\n    if (val !== undefined) internalCurrent.value = val;\n  },\n);\n\nwatch(\n  () => props.pageSize,\n  (val) => {\n    if (val !== undefined) internalPageSize.value = val;\n  },\n);\n\nconst activePage = computed(() =>\n  isCurrentControlled.value ? props.current! : internalCurrent.value,\n);\nconst activePageSize = computed(() =>\n  isPageSizeControlled.value ? props.pageSize! : internalPageSize.value,\n);\n\n// ─────────────────────────────────────────────\n// Derived\n// ─────────────────────────────────────────────\nconst totalPages = computed(() => {\n  if (props.total <= 0 || activePageSize.value <= 0) return 0;\n  return Math.ceil(props.total / activePageSize.value);\n});\n\nconst shouldHide = computed(() => props.hideOnSinglePage && totalPages.value <= 1);\n\nconst computedShowSizeChanger = computed(() => {\n  if (props.showSizeChanger !== undefined) return props.showSizeChanger;\n  return props.total > props.totalBoundaryShowSizeChanger;\n});\n\nconst isSimple = computed(() => !!props.simple);\nconst isSimpleReadOnly = computed(\n  () => typeof props.simple === 'object' && props.simple.readOnly === true,\n);\n\nconst totalRangeText = computed(() => {\n  if (!props.showTotal) return '';\n  const start = (activePage.value - 1) * activePageSize.value + 1;\n  const end = Math.min(activePage.value * activePageSize.value, props.total);\n  return props.showTotal(props.total, [start, end]);\n});\n\n// ─────────────────────────────────────────────\n// Page list computation\n// ─────────────────────────────────────────────\nconst pageList = computed(() => {\n  const tp = totalPages.value;\n  if (tp <= 0) return [];\n\n  const siblingCount = props.showLessItems ? 1 : 2;\n  const cur = activePage.value;\n\n  const items: Array<{ type: 'page' | 'prev-ellipsis' | 'next-ellipsis'; page: number }> = [];\n\n  items.push({ type: 'page', page: 1 });\n\n  if (tp <= (props.showLessItems ? 4 : 6) + 2) {\n    for (let i = 2; i <= tp; i++) {\n      items.push({ type: 'page', page: i });\n    }\n    return items;\n  }\n\n  const left = Math.max(2, cur - siblingCount);\n  const right = Math.min(tp - 1, cur + siblingCount);\n\n  if (left > 2) {\n    items.push({ type: 'prev-ellipsis', page: Math.max(1, cur - (props.showLessItems ? 3 : 5)) });\n  }\n\n  for (let i = left; i <= right; i++) {\n    items.push({ type: 'page', page: i });\n  }\n\n  if (right < tp - 1) {\n    items.push({\n      type: 'next-ellipsis',\n      page: Math.min(tp, cur + (props.showLessItems ? 3 : 5)),\n    });\n  }\n\n  if (tp > 1) {\n    items.push({ type: 'page', page: tp });\n  }\n\n  return items;\n});\n\n// ─────────────────────────────────────────────\n// Actions\n// ─────────────────────────────────────────────\nfunction setPage(page: number) {\n  if (props.disabled) return;\n  const clamped = Math.max(1, Math.min(page, totalPages.value));\n  if (clamped === activePage.value) return;\n\n  if (!isCurrentControlled.value) {\n    internalCurrent.value = clamped;\n  }\n  emit('update:current', clamped);\n  emit('change', clamped, activePageSize.value);\n}\n\nfunction setPageSize(newSize: number) {\n  if (props.disabled) return;\n  if (newSize === activePageSize.value) return;\n\n  const newTotalPages = Math.ceil(props.total / newSize);\n  const newCurrent = Math.min(activePage.value, newTotalPages) || 1;\n\n  if (!isPageSizeControlled.value) {\n    internalPageSize.value = newSize;\n  }\n  if (!isCurrentControlled.value) {\n    internalCurrent.value = newCurrent;\n  }\n\n  emit('update:pageSize', newSize);\n  emit('update:current', newCurrent);\n  emit('showSizeChange', newCurrent, newSize);\n  emit('change', newCurrent, newSize);\n}\n\nfunction goPrev() {\n  setPage(activePage.value - 1);\n}\n\nfunction goNext() {\n  setPage(activePage.value + 1);\n}\n\n// ─────────────────────────────────────────────\n// Quick jumper\n// ─────────────────────────────────────────────\nconst jumperValue = ref('');\n\nfunction handleJumperKeydown(event: KeyboardEvent) {\n  if (event.key === 'Enter') {\n    submitJumper();\n  }\n}\n\nfunction submitJumper() {\n  const val = parseInt(jumperValue.value, 10);\n  if (!isNaN(val) && val >= 1 && val <= totalPages.value) {\n    setPage(val);\n  }\n  jumperValue.value = '';\n}\n\n// ─────────────────────────────────────────────\n// Simple mode input\n// ─────────────────────────────────────────────\nconst simpleInputValue = ref(String(activePage.value));\n\nwatch(activePage, (val) => {\n  simpleInputValue.value = String(val);\n});\n\nfunction handleSimpleInputKeydown(event: KeyboardEvent) {\n  if (event.key === 'Enter') {\n    const val = parseInt(simpleInputValue.value, 10);\n    if (!isNaN(val)) {\n      setPage(val);\n    } else {\n      simpleInputValue.value = String(activePage.value);\n    }\n  }\n}\n\nfunction handleSimpleInputBlur() {\n  const val = parseInt(simpleInputValue.value, 10);\n  if (!isNaN(val) && val >= 1 && val <= totalPages.value) {\n    setPage(val);\n  } else {\n    simpleInputValue.value = String(activePage.value);\n  }\n}\n\n// ─────────────────────────────────────────────\n// Classes\n// ─────────────────────────────────────────────\nconst rootClasses = computed(() => [\n  'b-pagination',\n  {\n    'b-pagination--disabled': props.disabled,\n    'b-pagination--simple': isSimple.value,\n    'b-pagination--small': props.size === 'small',\n    'b-pagination--large': props.size === 'large',\n    'b-pagination--align-start': props.align === 'start',\n    'b-pagination--align-center': props.align === 'center',\n    'b-pagination--align-end': props.align === 'end',\n  },\n]);\n</script>\n\n<template>\n  <nav v-if=\"!shouldHide\" :class=\"rootClasses\" role=\"navigation\" :aria-label=\"props.ariaLabel\">\n    <!-- Total display -->\n    <span v-if=\"props.showTotal\" class=\"b-pagination__total\">\n      {{ totalRangeText }}\n    </span>\n\n    <!-- Simple mode -->\n    <template v-if=\"isSimple\">\n      <!-- Prev -->\n      <button\n        class=\"b-pagination__item b-pagination__prev\"\n        type=\"button\"\n        :disabled=\"props.disabled || activePage <= 1\"\n        :aria-disabled=\"props.disabled || activePage <= 1 ? 'true' : undefined\"\n        :title=\"props.showTitle ? 'Previous Page' : undefined\"\n        aria-label=\"Previous Page\"\n        @click=\"goPrev\"\n      >\n        <BIcon icon=\"chevron-left\" aria-hidden=\"true\" />\n      </button>\n\n      <!-- Simple input -->\n      <span class=\"b-pagination__simple-pager\">\n        <input\n          v-if=\"!isSimpleReadOnly\"\n          class=\"b-pagination__simple-input\"\n          type=\"text\"\n          inputmode=\"numeric\"\n          :value=\"simpleInputValue\"\n          :disabled=\"props.disabled\"\n          :aria-label=\"`Page ${activePage} of ${totalPages}`\"\n          @input=\"simpleInputValue = ($event.target as HTMLInputElement).value\"\n          @keydown=\"handleSimpleInputKeydown\"\n          @blur=\"handleSimpleInputBlur\"\n        />\n        <span v-else class=\"b-pagination__simple-current\" aria-current=\"page\">\n          {{ activePage }}\n        </span>\n        <span class=\"b-pagination__simple-separator\" aria-hidden=\"true\">/</span>\n        <span class=\"b-pagination__simple-total\">{{ totalPages }}</span>\n      </span>\n\n      <!-- Next -->\n      <button\n        class=\"b-pagination__item b-pagination__next\"\n        type=\"button\"\n        :disabled=\"props.disabled || activePage >= totalPages\"\n        :aria-disabled=\"props.disabled || activePage >= totalPages ? 'true' : undefined\"\n        :title=\"props.showTitle ? 'Next Page' : undefined\"\n        aria-label=\"Next Page\"\n        @click=\"goNext\"\n      >\n        <BIcon icon=\"chevron-right\" aria-hidden=\"true\" />\n      </button>\n    </template>\n\n    <!-- Normal mode -->\n    <template v-else>\n      <!-- Prev -->\n      <button\n        class=\"b-pagination__item b-pagination__prev\"\n        type=\"button\"\n        :disabled=\"props.disabled || activePage <= 1\"\n        :aria-disabled=\"props.disabled || activePage <= 1 ? 'true' : undefined\"\n        :title=\"props.showTitle ? 'Previous Page' : undefined\"\n        aria-label=\"Previous Page\"\n        @click=\"goPrev\"\n      >\n        <BIcon icon=\"chevron-left\" aria-hidden=\"true\" />\n      </button>\n\n      <!-- Page items -->\n      <template v-for=\"item in pageList\" :key=\"`${item.type}-${item.page}`\">\n        <!-- Ellipsis -->\n        <button\n          v-if=\"item.type === 'prev-ellipsis' || item.type === 'next-ellipsis'\"\n          class=\"b-pagination__item b-pagination__ellipsis\"\n          type=\"button\"\n          :disabled=\"props.disabled\"\n          :title=\"\n            props.showTitle\n              ? item.type === 'prev-ellipsis'\n                ? 'Previous 5 Pages'\n                : 'Next 5 Pages'\n              : undefined\n          \"\n          :aria-label=\"item.type === 'prev-ellipsis' ? 'Previous 5 Pages' : 'Next 5 Pages'\"\n          @click=\"setPage(item.page)\"\n        >\n          <span aria-hidden=\"true\">•••</span>\n        </button>\n\n        <!-- Page number -->\n        <button\n          v-else\n          class=\"b-pagination__item b-pagination__page\"\n          :class=\"{ 'b-pagination__page--active': item.page === activePage }\"\n          type=\"button\"\n          :disabled=\"props.disabled\"\n          :aria-current=\"item.page === activePage ? 'page' : undefined\"\n          :aria-label=\"`Page ${item.page}`\"\n          :title=\"props.showTitle ? `${item.page}` : undefined\"\n          @click=\"setPage(item.page)\"\n        >\n          {{ item.page }}\n        </button>\n      </template>\n\n      <!-- Next -->\n      <button\n        class=\"b-pagination__item b-pagination__next\"\n        type=\"button\"\n        :disabled=\"props.disabled || activePage >= totalPages\"\n        :aria-disabled=\"props.disabled || activePage >= totalPages ? 'true' : undefined\"\n        :title=\"props.showTitle ? 'Next Page' : undefined\"\n        aria-label=\"Next Page\"\n        @click=\"goNext\"\n      >\n        <BIcon icon=\"chevron-right\" aria-hidden=\"true\" />\n      </button>\n    </template>\n\n    <!-- Size changer -->\n    <select\n      v-if=\"computedShowSizeChanger && !isSimple\"\n      class=\"b-pagination__size-changer\"\n      :value=\"activePageSize\"\n      :disabled=\"props.disabled\"\n      aria-label=\"Items per page\"\n      @change=\"setPageSize(Number(($event.target as HTMLSelectElement).value))\"\n    >\n      <option v-for=\"opt in pageSizeOptions\" :key=\"opt\" :value=\"opt\">{{ opt }} / page</option>\n    </select>\n\n    <!-- Quick jumper -->\n    <span v-if=\"props.showQuickJumper && !isSimple\" class=\"b-pagination__quick-jumper\">\n      <span>Go to</span>\n      <input\n        class=\"b-pagination__jumper-input\"\n        type=\"text\"\n        inputmode=\"numeric\"\n        :value=\"jumperValue\"\n        :disabled=\"props.disabled\"\n        aria-label=\"Go to page\"\n        @input=\"jumperValue = ($event.target as HTMLInputElement).value\"\n        @keydown=\"handleJumperKeydown\"\n      />\n    </span>\n  </nav>\n</template>\n\n<style>\n/* ─────────────────────────────────────────────\n   BPagination - CSS custom properties\n   ───────────────────────────────────────────── */\n.b-pagination {\n  /* Item */\n  --b-pagination-item-bg: #ffffff;\n  --b-pagination-item-bg-hover: rgba(0, 0, 0, 0.04);\n  --b-pagination-item-size: 32px;\n  --b-pagination-item-size-sm: 24px;\n  --b-pagination-item-size-lg: 40px;\n  --b-pagination-item-border-radius: 6px;\n  --b-pagination-item-font-size: 14px;\n\n  /* Active */\n  --b-pagination-item-active-bg: #ffffff;\n  --b-pagination-item-active-color: #0958d9;\n  --b-pagination-item-active-border-color: #0958d9;\n  --b-pagination-item-active-color-hover: #1677ff;\n  --b-pagination-item-active-border-color-hover: #1677ff;\n\n  /* Disabled */\n  --b-pagination-item-active-bg-disabled: rgba(0, 0, 0, 0.15);\n  --b-pagination-item-active-color-disabled: rgba(0, 0, 0, 0.25);\n  --b-pagination-item-color-disabled: rgba(0, 0, 0, 0.25);\n\n  /* Input */\n  --b-pagination-item-input-bg: #ffffff;\n\n  /* Link */\n  --b-pagination-item-link-bg: #ffffff;\n\n  /* Layout */\n  --b-pagination-gap: 8px;\n  --b-pagination-color: rgba(0, 0, 0, 0.88);\n  --b-pagination-font-family: inherit;\n  --b-pagination-mini-options-size-changer-top: 0px;\n\n  /* Focus */\n  --b-pagination-focus-ring: 0 0 0 2px rgba(22, 119, 255, 0.2);\n\n  /* ── Layout ── */\n  display: flex;\n  align-items: center;\n  gap: var(--b-pagination-gap);\n  font-family: var(--b-pagination-font-family);\n  font-size: var(--b-pagination-item-font-size);\n  color: var(--b-pagination-color);\n  flex-wrap: wrap;\n  list-style: none;\n  padding: 0;\n  margin: 0;\n}\n\n/* ── Alignment ── */\n.b-pagination--align-start {\n  justify-content: flex-start;\n}\n\n.b-pagination--align-center {\n  justify-content: center;\n}\n\n.b-pagination--align-end {\n  justify-content: flex-end;\n}\n\n/* ── Size variants ── */\n.b-pagination--small {\n  --b-pagination-item-size: var(--b-pagination-item-size-sm);\n  --b-pagination-item-font-size: 12px;\n  --b-pagination-gap: 4px;\n}\n\n.b-pagination--large {\n  --b-pagination-item-size: var(--b-pagination-item-size-lg);\n  --b-pagination-item-font-size: 16px;\n  --b-pagination-gap: 10px;\n}\n\n/* ── Item (shared styles for page, prev, next, ellipsis) ── */\n.b-pagination__item {\n  display: inline-flex;\n  align-items: center;\n  justify-content: center;\n  min-width: var(--b-pagination-item-size);\n  height: var(--b-pagination-item-size);\n  padding: 0 6px;\n  border: 1px solid transparent;\n  border-radius: var(--b-pagination-item-border-radius);\n  background: var(--b-pagination-item-bg);\n  color: var(--b-pagination-color);\n  font-size: var(--b-pagination-item-font-size);\n  font-family: inherit;\n  line-height: 1;\n  text-align: center;\n  cursor: pointer;\n  user-select: none;\n  transition:\n    color 200ms,\n    border-color 200ms,\n    background 200ms;\n  outline: none;\n  box-sizing: border-box;\n}\n\n.b-pagination__item:hover:not(:disabled):not(.b-pagination__page--active) {\n  background: var(--b-pagination-item-bg-hover);\n  color: var(--b-pagination-item-active-color);\n}\n\n.b-pagination__item:focus-visible {\n  box-shadow: var(--b-pagination-focus-ring);\n}\n\n.b-pagination__item:disabled {\n  color: var(--b-pagination-item-color-disabled);\n  cursor: not-allowed;\n  background: transparent;\n}\n\n/* ── Active page ── */\n.b-pagination__page--active {\n  background: var(--b-pagination-item-active-bg);\n  color: var(--b-pagination-item-active-color);\n  border-color: var(--b-pagination-item-active-border-color);\n  font-weight: 500;\n  cursor: default;\n}\n\n.b-pagination__page--active:hover:not(:disabled) {\n  color: var(--b-pagination-item-active-color-hover);\n  border-color: var(--b-pagination-item-active-border-color-hover);\n  background: var(--b-pagination-item-active-bg);\n}\n\n.b-pagination__page--active:disabled {\n  background: var(--b-pagination-item-active-bg-disabled);\n  color: var(--b-pagination-item-active-color-disabled);\n  border-color: transparent;\n}\n\n/* ── Ellipsis ── */\n.b-pagination__ellipsis {\n  border-color: transparent;\n  letter-spacing: 1px;\n  color: rgba(0, 0, 0, 0.25);\n}\n\n.b-pagination__ellipsis:hover:not(:disabled) {\n  color: var(--b-pagination-item-active-color);\n  background: transparent;\n}\n\n/* ── Prev/Next arrows ── */\n.b-pagination__prev,\n.b-pagination__next {\n  background: var(--b-pagination-item-link-bg);\n}\n\n/* ── Total ── */\n.b-pagination__total {\n  white-space: nowrap;\n  font-size: var(--b-pagination-item-font-size);\n}\n\n/* ── Simple mode ── */\n.b-pagination--simple .b-pagination__simple-pager {\n  display: inline-flex;\n  align-items: center;\n  gap: 4px;\n}\n\n.b-pagination__simple-input {\n  width: 48px;\n  height: var(--b-pagination-item-size);\n  padding: 0 6px;\n  border: 1px solid #d9d9d9;\n  border-radius: var(--b-pagination-item-border-radius);\n  background: var(--b-pagination-item-input-bg);\n  color: var(--b-pagination-color);\n  font-size: var(--b-pagination-item-font-size);\n  text-align: center;\n  outline: none;\n  box-sizing: border-box;\n  transition: border-color 200ms;\n}\n\n.b-pagination__simple-input:focus {\n  border-color: var(--b-pagination-item-active-border-color);\n  box-shadow: var(--b-pagination-focus-ring);\n}\n\n.b-pagination__simple-input:disabled {\n  background: rgba(0, 0, 0, 0.04);\n  color: var(--b-pagination-item-color-disabled);\n  cursor: not-allowed;\n}\n\n.b-pagination__simple-separator {\n  color: rgba(0, 0, 0, 0.25);\n  padding: 0 2px;\n}\n\n.b-pagination__simple-current {\n  font-weight: 500;\n  color: var(--b-pagination-item-active-color);\n}\n\n/* ── Size changer ── */\n.b-pagination__size-changer {\n  height: var(--b-pagination-item-size);\n  padding: 0 8px;\n  border: 1px solid #d9d9d9;\n  border-radius: var(--b-pagination-item-border-radius);\n  background: var(--b-pagination-item-input-bg);\n  color: var(--b-pagination-color);\n  font-size: var(--b-pagination-item-font-size);\n  font-family: inherit;\n  cursor: pointer;\n  outline: none;\n  box-sizing: border-box;\n  margin-top: var(--b-pagination-mini-options-size-changer-top);\n  transition: border-color 200ms;\n}\n\n.b-pagination__size-changer:focus {\n  border-color: var(--b-pagination-item-active-border-color);\n  box-shadow: var(--b-pagination-focus-ring);\n}\n\n.b-pagination__size-changer:disabled {\n  background: rgba(0, 0, 0, 0.04);\n  color: var(--b-pagination-item-color-disabled);\n  cursor: not-allowed;\n}\n\n/* ── Quick jumper ── */\n.b-pagination__quick-jumper {\n  display: inline-flex;\n  align-items: center;\n  gap: 8px;\n  font-size: var(--b-pagination-item-font-size);\n  white-space: nowrap;\n}\n\n.b-pagination__jumper-input {\n  width: 50px;\n  height: var(--b-pagination-item-size);\n  padding: 0 6px;\n  border: 1px solid #d9d9d9;\n  border-radius: var(--b-pagination-item-border-radius);\n  background: var(--b-pagination-item-input-bg);\n  color: var(--b-pagination-color);\n  font-size: var(--b-pagination-item-font-size);\n  text-align: center;\n  outline: none;\n  box-sizing: border-box;\n  transition: border-color 200ms;\n}\n\n.b-pagination__jumper-input:focus {\n  border-color: var(--b-pagination-item-active-border-color);\n  box-shadow: var(--b-pagination-focus-ring);\n}\n\n.b-pagination__jumper-input:disabled {\n  background: rgba(0, 0, 0, 0.04);\n  color: var(--b-pagination-item-color-disabled);\n  cursor: not-allowed;\n}\n\n/* ── Disabled state (entire control) ── */\n.b-pagination--disabled {\n  opacity: 0.65;\n  pointer-events: none;\n}\n\n/* ── Dark mode ── */\n[data-prefers-color='dark'] .b-pagination {\n  --b-pagination-item-bg: #1d1d1d;\n  --b-pagination-item-bg-hover: rgba(255, 255, 255, 0.08);\n  --b-pagination-item-active-bg: #1d1d1d;\n  --b-pagination-item-active-color: #4096ff;\n  --b-pagination-item-active-border-color: #4096ff;\n  --b-pagination-item-active-color-hover: #69b1ff;\n  --b-pagination-item-active-border-color-hover: #69b1ff;\n  --b-pagination-item-active-bg-disabled: rgba(255, 255, 255, 0.08);\n  --b-pagination-item-active-color-disabled: rgba(255, 255, 255, 0.3);\n  --b-pagination-item-color-disabled: rgba(255, 255, 255, 0.3);\n  --b-pagination-item-input-bg: #1d1d1d;\n  --b-pagination-item-link-bg: #1d1d1d;\n  --b-pagination-color: rgba(255, 255, 255, 0.88);\n  --b-pagination-focus-ring: 0 0 0 2px rgba(64, 150, 255, 0.25);\n}\n\n@media (prefers-color-scheme: dark) {\n  [data-prefers-color='system'] .b-pagination {\n    --b-pagination-item-bg: #1d1d1d;\n    --b-pagination-item-bg-hover: rgba(255, 255, 255, 0.08);\n    --b-pagination-item-active-bg: #1d1d1d;\n    --b-pagination-item-active-color: #4096ff;\n    --b-pagination-item-active-border-color: #4096ff;\n    --b-pagination-item-active-color-hover: #69b1ff;\n    --b-pagination-item-active-border-color-hover: #69b1ff;\n    --b-pagination-item-active-bg-disabled: rgba(255, 255, 255, 0.08);\n    --b-pagination-item-active-color-disabled: rgba(255, 255, 255, 0.3);\n    --b-pagination-item-color-disabled: rgba(255, 255, 255, 0.3);\n    --b-pagination-item-input-bg: #1d1d1d;\n    --b-pagination-item-link-bg: #1d1d1d;\n    --b-pagination-color: rgba(255, 255, 255, 0.88);\n    --b-pagination-focus-ring: 0 0 0 2px rgba(64, 150, 255, 0.25);\n  }\n}\n\n/* ── Reduced motion ── */\n@media (prefers-reduced-motion: reduce) {\n  .b-pagination__item,\n  .b-pagination__simple-input,\n  .b-pagination__size-changer,\n  .b-pagination__jumper-input {\n    transition: none;\n  }\n}\n</style>\n"],"mappings":""}

package/dist/design-system157.js

@@ -1,6 +1,243 @@
-//#region src/components/BRadio/types.ts
-var e = Symbol("BRadioGroup");
+import { BPopconfirmPlacement as e, BPopconfirmTrigger as t } from "./design-system3.js";
+import { useComponentId as n } from "./design-system10.js";
+import { Fragment as r, computed as i, createCommentVNode as a, createElementBlock as o, createElementVNode as s, createTextVNode as c, defineComponent as l, nextTick as u, normalizeClass as d, normalizeStyle as f, onBeforeUnmount as ee, onMounted as te, openBlock as p, ref as m, renderSlot as h, toDisplayString as g, unref as ne, useId as re, watch as _ } from "vue";
+//#region src/components/BPopconfirm/BPopconfirm.vue?vue&type=script&setup=true&lang.ts
+var ie = ["aria-describedby", "id"], ae = {
+	key: 0,
+	class: "b-popconfirm__arrow",
+	"aria-hidden": "true"
+}, oe = { class: "b-popconfirm__inner" }, v = { class: "b-popconfirm__message" }, y = {
+	class: "b-popconfirm__icon",
+	"aria-hidden": "true"
+}, b = { class: "b-popconfirm__text" }, se = {
+	class: "b-popconfirm__buttons",
+	role: "group"
+}, x = "a[href], button:not([disabled]), textarea:not([disabled]), input:not([disabled]), select:not([disabled]), [tabindex]:not([tabindex=\"-1\"])", S = /* @__PURE__ */ l({
+	__name: "BPopconfirm",
+	props: {
+		title: {},
+		description: {},
+		okText: { default: "Yes" },
+		cancelText: { default: "No" },
+		okType: { default: "primary" },
+		disabled: {
+			type: Boolean,
+			default: !1
+		},
+		icon: {},
+		showCancel: {
+			type: Boolean,
+			default: !0
+		},
+		trigger: { default: () => t.Click },
+		placement: { default: () => e.TopCenter },
+		arrow: {
+			type: Boolean,
+			default: !0
+		},
+		mouseEnterDelay: { default: 100 },
+		mouseLeaveDelay: { default: 100 },
+		destroyTooltipOnHide: {
+			type: Boolean,
+			default: !1
+		},
+		zIndex: { default: 1060 },
+		modelValue: {
+			type: Boolean,
+			default: () => void 0
+		}
+	},
+	emits: [
+		"confirm",
+		"cancel",
+		"openChange",
+		"update:modelValue"
+	],
+	setup(l, { expose: S, emit: C }) {
+		let w = C, { componentUID: ce } = n(), T = re(), E = `${T}-title`, D = `${T}-desc`, O = m(!1), k = i(() => l.modelValue === void 0 ? O.value : l.modelValue), A = m(!1), le = i(() => l.destroyTooltipOnHide ? k.value : A.value || k.value);
+		_(k, (e) => {
+			e && (A.value = !0);
+		});
+		let j = null, M = null;
+		function N() {
+			j &&= (clearTimeout(j), null), M &&= (clearTimeout(M), null);
+		}
+		function P(e = 0) {
+			l.disabled || (N(), !k.value && (e > 0 ? j = setTimeout(() => I(), e) : I()));
+		}
+		function F(e = 0) {
+			N(), k.value && (e > 0 ? M = setTimeout(() => L(), e) : L());
+		}
+		function I() {
+			B.value?.showPopover();
+		}
+		function L() {
+			B.value?.hidePopover();
+		}
+		function R(e) {
+			l.modelValue === void 0 ? O.value = e : w("update:modelValue", e), w("openChange", e);
+		}
+		let z = ({ newState: e }) => {
+			R(e === "open");
+		}, B = m(null), V = m(null), H = null;
+		function U() {
+			u(() => {
+				if (!B.value) return;
+				let e = B.value.querySelector(x);
+				e ? e.focus() : B.value.focus();
+			});
+		}
+		function ue(e) {
+			if (e.key !== "Tab" || !B.value) return;
+			let t = Array.from(B.value.querySelectorAll(x));
+			if (t.length === 0) {
+				e.preventDefault();
+				return;
+			}
+			let n = t[0], r = t[t.length - 1];
+			e.shiftKey ? document.activeElement === n && (e.preventDefault(), r.focus()) : document.activeElement === r && (e.preventDefault(), n.focus());
+		}
+		_(k, (e) => {
+			e ? (H = document.activeElement, U()) : H && u(() => H?.focus());
+		});
+		function de(e) {
+			w("confirm", e), F();
+		}
+		function fe(e) {
+			w("cancel", e), F();
+		}
+		function W() {
+			l.disabled || (k.value ? F() : P());
+		}
+		function G() {
+			P(l.mouseEnterDelay);
+		}
+		function K() {
+			F(l.mouseLeaveDelay);
+		}
+		function q() {
+			P();
+		}
+		function J() {
+			F();
+		}
+		function Y(e) {
+			e.key === "Escape" && k.value && (e.preventDefault(), F());
+		}
+		function pe(e) {
+			e.key === "Escape" && (e.preventDefault(), F()), ue(e);
+		}
+		function me() {
+			l.trigger === t.Hover && N();
+		}
+		function X() {
+			l.trigger === t.Hover && F(l.mouseLeaveDelay);
+		}
+		function Z() {
+			let e = V.value;
+			if (e) switch (e.addEventListener("keydown", Y), l.trigger) {
+				case t.Click:
+					e.addEventListener("click", W);
+					break;
+				case t.Focus:
+					e.addEventListener("focusin", q), e.addEventListener("focusout", J);
+					break;
+				case t.Hover:
+				default:
+					e.addEventListener("mouseenter", G), e.addEventListener("mouseleave", K), e.addEventListener("focusin", q), e.addEventListener("focusout", J);
+					break;
+			}
+		}
+		function Q() {
+			let e = V.value;
+			e && (e.removeEventListener("keydown", Y), e.removeEventListener("click", W), e.removeEventListener("focusin", q), e.removeEventListener("focusout", J), e.removeEventListener("mouseenter", G), e.removeEventListener("mouseleave", K));
+		}
+		te(() => {
+			Z();
+		}), ee(() => {
+			Q(), N();
+		}), _(() => l.trigger, () => {
+			Q(), Z();
+		}), _(() => l.modelValue, (e) => {
+			e !== void 0 && (e ? B.value?.showPopover() : B.value?.hidePopover());
+		});
+		let $ = i(() => `--b-popconfirm-anchor-${ce.value}`), he = i(() => ({
+			[e.TopLeft]: "top-left",
+			[e.TopCenter]: "top-center",
+			[e.TopRight]: "top-right",
+			[e.RightTop]: "right-top",
+			[e.RightCenter]: "right-center",
+			[e.RightBottom]: "right-bottom",
+			[e.BottomRight]: "bottom-right",
+			[e.BottomCenter]: "bottom-center",
+			[e.BottomLeft]: "bottom-left",
+			[e.LeftBottom]: "left-bottom",
+			[e.LeftCenter]: "left-center",
+			[e.LeftTop]: "left-top"
+		})[l.placement] ?? "top-center"), ge = i(() => ({
+			primary: "b-popconfirm__btn--primary",
+			default: "b-popconfirm__btn--default",
+			dashed: "b-popconfirm__btn--dashed",
+			text: "b-popconfirm__btn--text",
+			link: "b-popconfirm__btn--link"
+		})[l.okType] ?? "b-popconfirm__btn--primary");
+		return S({
+			open: I,
+			close: L
+		}), (e, t) => (p(), o(r, null, [s("div", {
+			ref_key: "toggleRef",
+			ref: V,
+			class: "b-popconfirm__toggle",
+			style: f({ anchorName: $.value })
+		}, [h(e.$slots, "default")], 4), s("div", {
+			ref_key: "popconfirmRef",
+			ref: B,
+			popover: "manual",
+			class: d([
+				"b-popconfirm__content",
+				he.value,
+				{ "b-popconfirm__content--no-arrow": !l.arrow }
+			]),
+			style: f({
+				zIndex: l.zIndex,
+				positionAnchor: $.value
+			}),
+			role: "dialog",
+			"aria-modal": "false",
+			"aria-labelledby": E,
+			"aria-describedby": l.description ? D : void 0,
+			id: ne(T),
+			tabindex: "-1",
+			onToggle: z,
+			onKeydown: pe,
+			onMouseenter: me,
+			onMouseleave: X
+		}, [le.value || !l.destroyTooltipOnHide ? (p(), o(r, { key: 0 }, [l.arrow ? (p(), o("div", ae)) : a("", !0), s("div", oe, [s("div", v, [s("span", y, [h(e.$slots, "icon", {}, () => [t[0] ||= s("svg", {
+			viewBox: "0 0 24 24",
+			fill: "currentColor",
+			width: "16",
+			height: "16",
+			"aria-hidden": "true"
+		}, [s("path", { d: "M12 2C6.48 2 2 6.48 2 12s4.48 10 10 10 10-4.48 10-10S17.52 2 12 2zm1 15h-2v-2h2v2zm0-4h-2V7h2v6z" })], -1)])]), s("div", b, [s("div", {
+			id: E,
+			class: "b-popconfirm__title"
+		}, [h(e.$slots, "title", {}, () => [c(g(l.title), 1)])]), l.description || e.$slots.description ? (p(), o("div", {
+			key: 0,
+			id: D,
+			class: "b-popconfirm__description"
+		}, [h(e.$slots, "description", {}, () => [c(g(l.description), 1)])])) : a("", !0)])]), s("div", se, [h(e.$slots, "cancelButton", {}, () => [l.showCancel ? (p(), o("button", {
+			key: 0,
+			type: "button",
+			class: "b-popconfirm__btn b-popconfirm__btn--default",
+			onClick: fe
+		}, g(l.cancelText), 1)) : a("", !0)]), h(e.$slots, "okButton", {}, () => [s("button", {
+			type: "button",
+			class: d(["b-popconfirm__btn", ge.value]),
+			onClick: de
+		}, g(l.okText), 3)])])])], 64)) : a("", !0)], 46, ie)], 64));
+	}
+});
 //#endregion
-export { e as B_RADIO_GROUP_KEY };
+export { S as default };
 
 //# sourceMappingURL=design-system157.js.map

package/dist/design-system157.js.map

@@ -1 +1 @@
-{"version":3,"file":"design-system157.js","names":[],"sources":["../src/components/BRadio/types.ts"],"sourcesContent":["import type { InjectionKey, Ref } from 'vue';\n\nexport interface BRadioOption {\n  /** Display label for the radio */\n  label: string;\n  /** Value associated with this radio */\n  value: string | number;\n  /** Whether this specific radio is disabled */\n  disabled?: boolean;\n}\n\nexport interface BRadioGroupContext {\n  modelValue: Ref<string | number | undefined>;\n  disabled: Ref<boolean>;\n  name: Ref<string>;\n  size: Ref<'large' | 'middle' | 'small'>;\n  optionType: Ref<'default' | 'button'>;\n  buttonStyle: Ref<'outline' | 'solid'>;\n  setValue: (val: string | number) => void;\n}\n\nexport const B_RADIO_GROUP_KEY: InjectionKey<BRadioGroupContext> = Symbol('BRadioGroup');\n"],"mappings":";AAqBA,IAAa,IAAsD,OAAO,cAAc"}
+{"version":3,"file":"design-system157.js","names":["$slots"],"sources":["../src/components/BPopconfirm/BPopconfirm.vue"],"sourcesContent":["<script setup lang=\"ts\">\nimport { useComponentId } from '@/composables/useComponentId.ts';\nimport { BPopconfirmPlacement, BPopconfirmTrigger } from '@/types.ts';\nimport { computed, nextTick, onBeforeUnmount, onMounted, ref, useId, watch } from 'vue';\n\n// ─────────────────────────────────────────────\n// Props & emits\n// ─────────────────────────────────────────────\nconst {\n  title,\n  description,\n  okText = 'Yes',\n  cancelText = 'No',\n  okType = 'primary',\n  disabled = false,\n  icon: _icon,\n  showCancel = true,\n  trigger = BPopconfirmTrigger.Click,\n  placement = BPopconfirmPlacement.TopCenter,\n  arrow = true,\n  mouseEnterDelay = 100,\n  mouseLeaveDelay = 100,\n  destroyTooltipOnHide = false,\n  zIndex = 1060,\n  modelValue = undefined,\n} = defineProps<{\n  /** The confirmation question or text shown in the popconfirm. Also accepts the `title` slot. */\n  title?: string;\n  /** Additional description below the title. Also accepts the `description` slot. */\n  description?: string;\n  /** Text of the confirm button. */\n  okText?: string;\n  /** Text of the cancel button. */\n  cancelText?: string;\n  /** Button type of the confirm button: 'primary' | 'default' | 'dashed' | 'text' | 'link'. */\n  okType?: 'primary' | 'default' | 'dashed' | 'text' | 'link';\n  /** Whether the popconfirm is disabled (clicking trigger does nothing). */\n  disabled?: boolean;\n  /** Custom icon slot name override. When not provided, a default warning icon is used. */\n  icon?: string;\n  /** Whether to show the cancel button. */\n  showCancel?: boolean;\n  /** The event that triggers the popconfirm to open. */\n  trigger?: `${BPopconfirmTrigger}`;\n  /** Placement of the popconfirm relative to the target element. */\n  placement?: `${BPopconfirmPlacement}`;\n  /** Whether the popconfirm has an arrow pointing to the target. */\n  arrow?: boolean;\n  /** Delay in ms before showing on mouseenter. */\n  mouseEnterDelay?: number;\n  /** Delay in ms before hiding on mouseleave. */\n  mouseLeaveDelay?: number;\n  /** Whether to destroy the popconfirm DOM when hidden. */\n  destroyTooltipOnHide?: boolean;\n  /** z-index of the popconfirm. */\n  zIndex?: number;\n  /** Controlled visibility - bind with `v-model`. */\n  modelValue?: boolean;\n}>();\n\nconst emit = defineEmits<{\n  /** Emitted when the confirm button is clicked. Receives a callback to close programmatically. */\n  (e: 'confirm', event: MouseEvent): void;\n  /** Emitted when the cancel button is clicked. Receives a callback to close programmatically. */\n  (e: 'cancel', event: MouseEvent): void;\n  /** Emitted when the popconfirm visibility changes. */\n  (e: 'openChange', open: boolean): void;\n  /** v-model support. */\n  (e: 'update:modelValue', value: boolean): void;\n}>();\n\ndefineSlots<{\n  /** The target element that triggers the popconfirm. */\n  default?(): unknown;\n  /** Overrides the `title` prop with custom content. */\n  title?(): unknown;\n  /** Overrides the `description` prop with custom content. */\n  description?(): unknown;\n  /** Overrides the default warning icon. */\n  icon?(): unknown;\n  /** Overrides the confirm button. */\n  okButton?(): unknown;\n  /** Overrides the cancel button. */\n  cancelButton?(): unknown;\n}>();\n\n// ─────────────────────────────────────────────\n// Internal state\n// ─────────────────────────────────────────────\nconst { componentUID } = useComponentId();\nconst popconfirmId = useId();\nconst titleId = `${popconfirmId}-title`;\nconst descId = `${popconfirmId}-desc`;\n\nconst internalOpen = ref(false);\nconst isOpen = computed(() => (modelValue !== undefined ? modelValue : internalOpen.value));\n\nconst hasBeenOpened = ref(false);\nconst shouldRender = computed(() => {\n  if (destroyTooltipOnHide) return isOpen.value;\n  return hasBeenOpened.value || isOpen.value;\n});\n\nwatch(isOpen, (val) => {\n  if (val) hasBeenOpened.value = true;\n});\n\n// ─────────────────────────────────────────────\n// Visibility control\n// ─────────────────────────────────────────────\nlet showTimer: ReturnType<typeof setTimeout> | null = null;\nlet hideTimer: ReturnType<typeof setTimeout> | null = null;\n\nfunction clearTimers() {\n  if (showTimer) {\n    clearTimeout(showTimer);\n    showTimer = null;\n  }\n  if (hideTimer) {\n    clearTimeout(hideTimer);\n    hideTimer = null;\n  }\n}\n\nfunction requestOpen(delay = 0) {\n  if (disabled) return;\n  clearTimers();\n  if (isOpen.value) return;\n  if (delay > 0) {\n    showTimer = setTimeout(() => doOpen(), delay);\n  } else {\n    doOpen();\n  }\n}\n\nfunction requestClose(delay = 0) {\n  clearTimers();\n  if (!isOpen.value) return;\n  if (delay > 0) {\n    hideTimer = setTimeout(() => doClose(), delay);\n  } else {\n    doClose();\n  }\n}\n\nfunction doOpen() {\n  popconfirmRef.value?.showPopover();\n}\n\nfunction doClose() {\n  popconfirmRef.value?.hidePopover();\n}\n\nfunction setOpen(val: boolean) {\n  if (modelValue !== undefined) {\n    emit('update:modelValue', val);\n  } else {\n    internalOpen.value = val;\n  }\n  emit('openChange', val);\n}\n\n// ─────────────────────────────────────────────\n// Popover toggle event\n// ─────────────────────────────────────────────\nconst onPopoverToggle = ({ newState }: ToggleEvent) => {\n  setOpen(newState === 'open');\n};\n\n// ─────────────────────────────────────────────\n// Refs\n// ─────────────────────────────────────────────\nconst popconfirmRef = ref<HTMLDivElement | null>(null);\nconst toggleRef = ref<HTMLDivElement | null>(null);\n\n// ─────────────────────────────────────────────\n// Focus management\n// ─────────────────────────────────────────────\nlet previouslyFocusedElement: HTMLElement | null = null;\n\nconst focusableSelector =\n  'a[href], button:not([disabled]), textarea:not([disabled]), input:not([disabled]), select:not([disabled]), [tabindex]:not([tabindex=\"-1\"])';\n\nfunction focusFirstButton() {\n  nextTick(() => {\n    if (!popconfirmRef.value) return;\n    const first = popconfirmRef.value.querySelector<HTMLElement>(focusableSelector);\n    if (first) {\n      first.focus();\n    } else {\n      popconfirmRef.value.focus();\n    }\n  });\n}\n\nfunction trapFocus(event: KeyboardEvent) {\n  if (event.key !== 'Tab' || !popconfirmRef.value) return;\n\n  const focusable = Array.from(\n    popconfirmRef.value.querySelectorAll<HTMLElement>(focusableSelector),\n  );\n  if (focusable.length === 0) {\n    event.preventDefault();\n    return;\n  }\n\n  const first = focusable[0];\n  const last = focusable[focusable.length - 1];\n\n  if (event.shiftKey) {\n    if (document.activeElement === first) {\n      event.preventDefault();\n      last.focus();\n    }\n  } else {\n    if (document.activeElement === last) {\n      event.preventDefault();\n      first.focus();\n    }\n  }\n}\n\nwatch(isOpen, (val) => {\n  if (val) {\n    previouslyFocusedElement = document.activeElement as HTMLElement | null;\n    focusFirstButton();\n  } else {\n    if (previouslyFocusedElement) {\n      nextTick(() => previouslyFocusedElement?.focus());\n    }\n  }\n});\n\n// ─────────────────────────────────────────────\n// Button handlers\n// ─────────────────────────────────────────────\nfunction onConfirm(event: MouseEvent) {\n  emit('confirm', event);\n  requestClose();\n}\n\nfunction onCancel(event: MouseEvent) {\n  emit('cancel', event);\n  requestClose();\n}\n\n// ─────────────────────────────────────────────\n// Event handlers\n// ─────────────────────────────────────────────\nfunction onClick() {\n  if (disabled) return;\n  if (isOpen.value) {\n    requestClose();\n  } else {\n    requestOpen();\n  }\n}\n\nfunction onMouseEnter() {\n  requestOpen(mouseEnterDelay);\n}\n\nfunction onMouseLeave() {\n  requestClose(mouseLeaveDelay);\n}\n\nfunction onFocusIn() {\n  requestOpen();\n}\n\nfunction onFocusOut() {\n  requestClose();\n}\n\nfunction onKeydown(event: KeyboardEvent) {\n  if (event.key === 'Escape' && isOpen.value) {\n    event.preventDefault();\n    requestClose();\n  }\n}\n\nfunction onPopconfirmKeydown(event: KeyboardEvent) {\n  if (event.key === 'Escape') {\n    event.preventDefault();\n    requestClose();\n  }\n  trapFocus(event);\n}\n\n// ─────────────────────────────────────────────\n// Popconfirm hover (keep open when hovering content)\n// ─────────────────────────────────────────────\nfunction onPopconfirmMouseEnter() {\n  if (trigger === BPopconfirmTrigger.Hover) {\n    clearTimers();\n  }\n}\n\nfunction onPopconfirmMouseLeave() {\n  if (trigger === BPopconfirmTrigger.Hover) {\n    requestClose(mouseLeaveDelay);\n  }\n}\n\n// ─────────────────────────────────────────────\n// Event listener management\n// ─────────────────────────────────────────────\nfunction attachListeners() {\n  const el = toggleRef.value;\n  if (!el) return;\n\n  el.addEventListener('keydown', onKeydown);\n\n  switch (trigger) {\n    case BPopconfirmTrigger.Click:\n      el.addEventListener('click', onClick);\n      break;\n    case BPopconfirmTrigger.Focus:\n      el.addEventListener('focusin', onFocusIn);\n      el.addEventListener('focusout', onFocusOut);\n      break;\n    case BPopconfirmTrigger.Hover:\n    default:\n      el.addEventListener('mouseenter', onMouseEnter);\n      el.addEventListener('mouseleave', onMouseLeave);\n      el.addEventListener('focusin', onFocusIn);\n      el.addEventListener('focusout', onFocusOut);\n      break;\n  }\n}\n\nfunction detachListeners() {\n  const el = toggleRef.value;\n  if (!el) return;\n\n  el.removeEventListener('keydown', onKeydown);\n  el.removeEventListener('click', onClick);\n  el.removeEventListener('focusin', onFocusIn);\n  el.removeEventListener('focusout', onFocusOut);\n  el.removeEventListener('mouseenter', onMouseEnter);\n  el.removeEventListener('mouseleave', onMouseLeave);\n}\n\nonMounted(() => {\n  attachListeners();\n});\n\nonBeforeUnmount(() => {\n  detachListeners();\n  clearTimers();\n});\n\nwatch(\n  () => trigger,\n  () => {\n    detachListeners();\n    attachListeners();\n  },\n);\n\n// Sync controlled v-model → popover state\nwatch(\n  () => modelValue,\n  (val) => {\n    if (val === undefined) return;\n    if (val) {\n      popconfirmRef.value?.showPopover();\n    } else {\n      popconfirmRef.value?.hidePopover();\n    }\n  },\n);\n\n// ─────────────────────────────────────────────\n// Computed styles\n// ─────────────────────────────────────────────\nconst anchorName = computed(() => `--b-popconfirm-anchor-${componentUID.value}`);\n\nconst placementClass = computed(() => {\n  const map: Record<string, string> = {\n    [BPopconfirmPlacement.TopLeft]: 'top-left',\n    [BPopconfirmPlacement.TopCenter]: 'top-center',\n    [BPopconfirmPlacement.TopRight]: 'top-right',\n    [BPopconfirmPlacement.RightTop]: 'right-top',\n    [BPopconfirmPlacement.RightCenter]: 'right-center',\n    [BPopconfirmPlacement.RightBottom]: 'right-bottom',\n    [BPopconfirmPlacement.BottomRight]: 'bottom-right',\n    [BPopconfirmPlacement.BottomCenter]: 'bottom-center',\n    [BPopconfirmPlacement.BottomLeft]: 'bottom-left',\n    [BPopconfirmPlacement.LeftBottom]: 'left-bottom',\n    [BPopconfirmPlacement.LeftCenter]: 'left-center',\n    [BPopconfirmPlacement.LeftTop]: 'left-top',\n  };\n  return map[placement] ?? 'top-center';\n});\n\nconst okButtonClass = computed(() => {\n  const map: Record<string, string> = {\n    primary: 'b-popconfirm__btn--primary',\n    default: 'b-popconfirm__btn--default',\n    dashed: 'b-popconfirm__btn--dashed',\n    text: 'b-popconfirm__btn--text',\n    link: 'b-popconfirm__btn--link',\n  };\n  return map[okType] ?? 'b-popconfirm__btn--primary';\n});\n\n// ─────────────────────────────────────────────\n// Public API\n// ─────────────────────────────────────────────\ndefineExpose({ open: doOpen, close: doClose });\n</script>\n\n<template>\n  <div ref=\"toggleRef\" class=\"b-popconfirm__toggle\" :style=\"{ anchorName: anchorName }\">\n    <slot />\n  </div>\n\n  <div\n    ref=\"popconfirmRef\"\n    popover=\"manual\"\n    :class=\"[\n      'b-popconfirm__content',\n      placementClass,\n      { 'b-popconfirm__content--no-arrow': !arrow },\n    ]\"\n    :style=\"{ zIndex, positionAnchor: anchorName }\"\n    role=\"dialog\"\n    aria-modal=\"false\"\n    :aria-labelledby=\"titleId\"\n    :aria-describedby=\"description ? descId : undefined\"\n    :id=\"popconfirmId\"\n    tabindex=\"-1\"\n    @toggle=\"onPopoverToggle\"\n    @keydown=\"onPopconfirmKeydown\"\n    @mouseenter=\"onPopconfirmMouseEnter\"\n    @mouseleave=\"onPopconfirmMouseLeave\"\n  >\n    <template v-if=\"shouldRender || !destroyTooltipOnHide\">\n      <div v-if=\"arrow\" class=\"b-popconfirm__arrow\" aria-hidden=\"true\" />\n      <div class=\"b-popconfirm__inner\">\n        <div class=\"b-popconfirm__message\">\n          <span class=\"b-popconfirm__icon\" aria-hidden=\"true\">\n            <slot name=\"icon\">\n              <svg\n                viewBox=\"0 0 24 24\"\n                fill=\"currentColor\"\n                width=\"16\"\n                height=\"16\"\n                aria-hidden=\"true\"\n              >\n                <path\n                  d=\"M12 2C6.48 2 2 6.48 2 12s4.48 10 10 10 10-4.48 10-10S17.52 2 12 2zm1 15h-2v-2h2v2zm0-4h-2V7h2v6z\"\n                />\n              </svg>\n            </slot>\n          </span>\n          <div class=\"b-popconfirm__text\">\n            <div :id=\"titleId\" class=\"b-popconfirm__title\">\n              <slot name=\"title\">{{ title }}</slot>\n            </div>\n            <div\n              v-if=\"description || $slots.description\"\n              :id=\"descId\"\n              class=\"b-popconfirm__description\"\n            >\n              <slot name=\"description\">{{ description }}</slot>\n            </div>\n          </div>\n        </div>\n        <div class=\"b-popconfirm__buttons\" role=\"group\">\n          <slot name=\"cancelButton\">\n            <button\n              v-if=\"showCancel\"\n              type=\"button\"\n              class=\"b-popconfirm__btn b-popconfirm__btn--default\"\n              @click=\"onCancel\"\n            >\n              {{ cancelText }}\n            </button>\n          </slot>\n          <slot name=\"okButton\">\n            <button type=\"button\" :class=\"['b-popconfirm__btn', okButtonClass]\" @click=\"onConfirm\">\n              {{ okText }}\n            </button>\n          </slot>\n        </div>\n      </div>\n    </template>\n  </div>\n</template>\n\n<style>\n/* ────────────────────────────────────────────\n   CSS Custom Properties (tokens)\n   ──────────────────────────────────────────── */\n:root {\n  --b-popconfirm-bg: #fff;\n  --b-popconfirm-color: oklch(25% 0 0);\n  --b-popconfirm-font-size: 0.875rem;\n  --b-popconfirm-line-height: 1.5;\n  --b-popconfirm-padding-x: 0.75rem;\n  --b-popconfirm-padding-y: 0.75rem;\n  --b-popconfirm-border-radius: 0.5rem;\n  --b-popconfirm-max-width: 320px;\n  --b-popconfirm-arrow-size: 8px;\n  --b-popconfirm-arrow-color: #fff;\n  --b-popconfirm-gap: 8px;\n  --b-popconfirm-transition-duration: 200ms;\n  --b-popconfirm-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-popconfirm-icon-color: oklch(75% 0.15 85);\n  --b-popconfirm-title-font-weight: 600;\n  --b-popconfirm-description-color: oklch(45% 0 0);\n  --b-popconfirm-btn-font-size: 0.8125rem;\n  --b-popconfirm-btn-padding-x: 0.5rem;\n  --b-popconfirm-btn-padding-y: 0.125rem;\n  --b-popconfirm-btn-border-radius: 0.25rem;\n  --b-popconfirm-btn-primary-bg: oklch(55% 0.2 260);\n  --b-popconfirm-btn-primary-color: #fff;\n  --b-popconfirm-btn-default-bg: transparent;\n  --b-popconfirm-btn-default-color: oklch(25% 0 0);\n  --b-popconfirm-btn-default-border: oklch(80% 0 0);\n}\n\n/* ── Dark mode ── */\n[data-prefers-color='dark'] {\n  --b-popconfirm-bg: oklch(22% 0 0);\n  --b-popconfirm-color: oklch(90% 0 0);\n  --b-popconfirm-arrow-color: oklch(22% 0 0);\n  --b-popconfirm-shadow:\n    0 6px 16px 0 rgba(0, 0, 0, 0.24), 0 3px 6px -4px rgba(0, 0, 0, 0.36),\n    0 9px 28px 8px rgba(0, 0, 0, 0.2);\n  --b-popconfirm-icon-color: oklch(80% 0.15 85);\n  --b-popconfirm-description-color: oklch(65% 0 0);\n  --b-popconfirm-btn-primary-bg: oklch(55% 0.2 260);\n  --b-popconfirm-btn-default-color: oklch(90% 0 0);\n  --b-popconfirm-btn-default-border: oklch(40% 0 0);\n}\n\n@media (prefers-color-scheme: dark) {\n  [data-prefers-color='system'] {\n    --b-popconfirm-bg: oklch(22% 0 0);\n    --b-popconfirm-color: oklch(90% 0 0);\n    --b-popconfirm-arrow-color: oklch(22% 0 0);\n    --b-popconfirm-shadow:\n      0 6px 16px 0 rgba(0, 0, 0, 0.24), 0 3px 6px -4px rgba(0, 0, 0, 0.36),\n      0 9px 28px 8px rgba(0, 0, 0, 0.2);\n    --b-popconfirm-icon-color: oklch(80% 0.15 85);\n    --b-popconfirm-description-color: oklch(65% 0 0);\n    --b-popconfirm-btn-primary-bg: oklch(55% 0.2 260);\n    --b-popconfirm-btn-default-color: oklch(90% 0 0);\n    --b-popconfirm-btn-default-border: oklch(40% 0 0);\n  }\n}\n\n/* ─────────────────────────────────────────────\n   Toggle wrapper\n   ───────────────────────────────────────────── */\n.b-popconfirm__toggle {\n  display: inline-block;\n}\n\n/* ─────────────────────────────────────────────\n   Popconfirm content (popover)\n   ───────────────────────────────────────────── */\n.b-popconfirm__content {\n  /* Reset popover defaults */\n  position: absolute;\n  border: none;\n  padding: 0;\n  margin: 0;\n  background: transparent;\n  overflow: visible;\n  max-width: var(--b-popconfirm-max-width);\n  box-sizing: border-box;\n  pointer-events: auto;\n\n  /* Animation and visibility */\n  transition:\n    display var(--b-popconfirm-transition-duration),\n    opacity var(--b-popconfirm-transition-duration);\n  transition-behavior: allow-discrete;\n  opacity: 0;\n\n  &:popover-open {\n    opacity: 1;\n\n    @starting-style {\n      opacity: 0;\n    }\n  }\n\n  /* ── Placement: Top ── */\n  &.top-left {\n    inset: auto;\n    bottom: anchor(top);\n    left: anchor(left);\n    margin-bottom: var(--b-popconfirm-gap);\n  }\n  &.top-center {\n    inset: auto;\n    bottom: anchor(top);\n    justify-self: anchor-center;\n    margin-bottom: var(--b-popconfirm-gap);\n  }\n  &.top-right {\n    inset: auto;\n    bottom: anchor(top);\n    right: anchor(right);\n    margin-bottom: var(--b-popconfirm-gap);\n  }\n\n  /* ── Placement: Right ── */\n  &.right-top {\n    inset: auto;\n    top: anchor(top);\n    left: anchor(right);\n    margin-left: var(--b-popconfirm-gap);\n  }\n  &.right-center {\n    inset: auto;\n    align-self: anchor-center;\n    left: anchor(right);\n    margin-left: var(--b-popconfirm-gap);\n  }\n  &.right-bottom {\n    inset: auto;\n    bottom: anchor(bottom);\n    left: anchor(right);\n    margin-left: var(--b-popconfirm-gap);\n  }\n\n  /* ── Placement: Bottom ── */\n  &.bottom-right {\n    inset: auto;\n    top: anchor(bottom);\n    right: anchor(right);\n    margin-top: var(--b-popconfirm-gap);\n  }\n  &.bottom-center {\n    inset: auto;\n    top: anchor(bottom);\n    justify-self: anchor-center;\n    margin-top: var(--b-popconfirm-gap);\n  }\n  &.bottom-left {\n    inset: auto;\n    top: anchor(bottom);\n    left: anchor(left);\n    margin-top: var(--b-popconfirm-gap);\n  }\n\n  /* ── Placement: Left ── */\n  &.left-bottom {\n    inset: auto;\n    bottom: anchor(bottom);\n    right: anchor(left);\n    margin-right: var(--b-popconfirm-gap);\n  }\n  &.left-center {\n    inset: auto;\n    align-self: anchor-center;\n    right: anchor(left);\n    margin-right: var(--b-popconfirm-gap);\n  }\n  &.left-top {\n    inset: auto;\n    top: anchor(top);\n    right: anchor(left);\n    margin-right: var(--b-popconfirm-gap);\n  }\n}\n\n/* ─────────────────────────────────────────────\n   Inner content\n   ───────────────────────────────────────────── */\n.b-popconfirm__inner {\n  background: var(--b-popconfirm-bg);\n  color: var(--b-popconfirm-color);\n  font-size: var(--b-popconfirm-font-size);\n  line-height: var(--b-popconfirm-line-height);\n  padding: var(--b-popconfirm-padding-y) var(--b-popconfirm-padding-x);\n  border-radius: var(--b-popconfirm-border-radius);\n  box-shadow: var(--b-popconfirm-shadow);\n  word-wrap: break-word;\n}\n\n/* ─────────────────────────────────────────────\n   Message row (icon + text)\n   ───────────────────────────────────────────── */\n.b-popconfirm__message {\n  display: flex;\n  align-items: flex-start;\n  gap: 0.5rem;\n  margin-bottom: 0.5rem;\n}\n\n.b-popconfirm__icon {\n  flex-shrink: 0;\n  color: var(--b-popconfirm-icon-color);\n  line-height: 1;\n  margin-top: 0.125rem;\n}\n\n.b-popconfirm__text {\n  flex: 1;\n  min-width: 0;\n}\n\n.b-popconfirm__title {\n  font-weight: var(--b-popconfirm-title-font-weight);\n}\n\n.b-popconfirm__description {\n  color: var(--b-popconfirm-description-color);\n  margin-top: 0.25rem;\n  font-size: 0.8125rem;\n}\n\n/* ─────────────────────────────────────────────\n   Buttons\n   ───────────────────────────────────────────── */\n.b-popconfirm__buttons {\n  display: flex;\n  justify-content: flex-end;\n  gap: 0.5rem;\n}\n\n.b-popconfirm__btn {\n  cursor: pointer;\n  font-size: var(--b-popconfirm-btn-font-size);\n  line-height: 1.5;\n  padding: var(--b-popconfirm-btn-padding-y) var(--b-popconfirm-btn-padding-x);\n  border-radius: var(--b-popconfirm-btn-border-radius);\n  border: 1px solid transparent;\n  font-family: inherit;\n  transition: opacity 150ms;\n\n  &:hover {\n    opacity: 0.85;\n  }\n\n  &:focus-visible {\n    outline: 2px solid oklch(55% 0.2 260);\n    outline-offset: 1px;\n  }\n}\n\n.b-popconfirm__btn--primary {\n  background: var(--b-popconfirm-btn-primary-bg);\n  color: var(--b-popconfirm-btn-primary-color);\n}\n\n.b-popconfirm__btn--default {\n  background: var(--b-popconfirm-btn-default-bg);\n  color: var(--b-popconfirm-btn-default-color);\n  border-color: var(--b-popconfirm-btn-default-border);\n}\n\n.b-popconfirm__btn--dashed {\n  background: var(--b-popconfirm-btn-default-bg);\n  color: var(--b-popconfirm-btn-default-color);\n  border-color: var(--b-popconfirm-btn-default-border);\n  border-style: dashed;\n}\n\n.b-popconfirm__btn--text {\n  background: transparent;\n  color: var(--b-popconfirm-btn-default-color);\n  border: none;\n}\n\n.b-popconfirm__btn--link {\n  background: transparent;\n  color: var(--b-popconfirm-btn-primary-bg);\n  border: none;\n  text-decoration: underline;\n}\n\n/* ─────────────────────────────────────────────\n   Arrow\n   ───────────────────────────────────────────── */\n.b-popconfirm__arrow {\n  position: absolute;\n  width: var(--b-popconfirm-arrow-size);\n  height: var(--b-popconfirm-arrow-size);\n  background: var(--b-popconfirm-arrow-color);\n  transform: rotate(45deg);\n  pointer-events: none;\n}\n\n/* Arrow positioning for top placements */\n.b-popconfirm__content.top-left .b-popconfirm__arrow,\n.b-popconfirm__content.top-center .b-popconfirm__arrow,\n.b-popconfirm__content.top-right .b-popconfirm__arrow {\n  bottom: calc(var(--b-popconfirm-arrow-size) / -2);\n  left: 50%;\n  margin-left: calc(var(--b-popconfirm-arrow-size) / -2);\n}\n\n/* Arrow positioning for bottom placements */\n.b-popconfirm__content.bottom-left .b-popconfirm__arrow,\n.b-popconfirm__content.bottom-center .b-popconfirm__arrow,\n.b-popconfirm__content.bottom-right .b-popconfirm__arrow {\n  top: calc(var(--b-popconfirm-arrow-size) / -2);\n  left: 50%;\n  margin-left: calc(var(--b-popconfirm-arrow-size) / -2);\n}\n\n/* Arrow positioning for right placements */\n.b-popconfirm__content.right-top .b-popconfirm__arrow,\n.b-popconfirm__content.right-center .b-popconfirm__arrow,\n.b-popconfirm__content.right-bottom .b-popconfirm__arrow {\n  left: calc(var(--b-popconfirm-arrow-size) / -2);\n  top: 50%;\n  margin-top: calc(var(--b-popconfirm-arrow-size) / -2);\n}\n\n/* Arrow positioning for left placements */\n.b-popconfirm__content.left-top .b-popconfirm__arrow,\n.b-popconfirm__content.left-center .b-popconfirm__arrow,\n.b-popconfirm__content.left-bottom .b-popconfirm__arrow {\n  right: calc(var(--b-popconfirm-arrow-size) / -2);\n  top: 50%;\n  margin-top: calc(var(--b-popconfirm-arrow-size) / -2);\n}\n\n/* ─────────────────────────────────────────────\n   Position fallbacks (auto-adjust overflow)\n   ───────────────────────────────────────────── */\n@position-try --b-popconfirm-top-center {\n  inset: auto;\n  bottom: anchor(top);\n  justify-self: anchor-center;\n  margin-bottom: var(--b-popconfirm-gap);\n}\n\n@position-try --b-popconfirm-bottom-center {\n  inset: auto;\n  top: anchor(bottom);\n  justify-self: anchor-center;\n  margin-top: var(--b-popconfirm-gap);\n}\n\n@position-try --b-popconfirm-right-center {\n  inset: auto;\n  align-self: anchor-center;\n  left: anchor(right);\n  margin-left: var(--b-popconfirm-gap);\n}\n\n@position-try --b-popconfirm-left-center {\n  inset: auto;\n  align-self: anchor-center;\n  right: anchor(left);\n  margin-right: var(--b-popconfirm-gap);\n}\n\n/* ── Reduced motion ── */\n@media (prefers-reduced-motion: reduce) {\n  .b-popconfirm__content {\n    transition-duration: 0ms;\n  }\n\n  .b-popconfirm__btn {\n    transition-duration: 0ms;\n  }\n}\n</style>\n"],"mappings":"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"}

package/dist/design-system159.js

@@ -0,0 +1,8 @@
+import e from "./design-system157.js";
+/* empty css                 */
+//#region src/components/BPopconfirm/BPopconfirm.vue
+var t = e;
+//#endregion
+export { t as default };
+
+//# sourceMappingURL=design-system159.js.map