@expcat/tigercat-vue 2.1.2 → 2.1.3

package/dist/{chunk-UXJRH72H.mjs → chunk-LMVNBPQP.mjs}

@@ -1,7 +1,7 @@
 import {
   renderVueOverlayTeleport,
   useVueAnchoredOverlay
-} from "./chunk-Q7Y22OFX.mjs";
+} from "./chunk-Y63TRXZO.mjs";
 
 // src/components/NavigationMenu.ts
 import {
@@ -13,13 +13,18 @@ import {
   h,
   onBeforeUnmount,
   onMounted,
-  onUpdated,
-  nextTick
+  nextTick,
+  useId,
+  Fragment,
+  isVNode
 } from "vue";
 import {
+  applyNavigationMenuPanelKey,
   classNames,
   coerceClassValue,
   mergeStyleValues,
+  createNavigationMenuHoverSession,
+  getNavigationMenuBarItems,
   getNavigationMenuClasses,
   getNavigationMenuListClasses,
   getNavigationMenuItemClasses,
@@ -27,40 +32,36 @@ import {
   getNavigationMenuChevronClasses,
   getNavigationMenuContentClasses,
   getNavigationMenuLinkClasses,
+  getNavigationMenuItemValue,
+  getNavigationMenuRovingTabIndex,
+  getNavigationMenuTabExitTarget,
   injectNavigationMenuStyles,
   NAVIGATION_MENU_ENTER_CLASS,
   NAVIGATION_MENU_CHEVRON_PATH,
   NAVIGATION_MENU_BAR_ITEM_ATTR,
+  NAVIGATION_MENU_ITEM_VALUE_ATTR,
   NAVIGATION_MENU_DEFAULT_DELAY_DURATION,
   NAVIGATION_MENU_DEFAULT_SKIP_DELAY_DURATION,
   NAVIGATION_MENU_DEFAULT_OFFSET,
   isNavigationMenuValueOpen,
   isNavigationMenuOpen,
   resolveNavigationMenuOpenValue,
-  shouldSkipNavigationMenuOpenDelay,
+  resolveNavigationMenuTabStopValue,
+  resolveElementDir,
   isNavigationMenuTriggerOpenKey,
   handleMenubarNavigation,
-  handleMenuNavigation,
-  initNavigationMenuRovingTabIndex,
-  focusFirstMenuItem,
+  focusFirstMenuItemWhenVisible,
   captureActiveElement,
   restoreFocus,
-  getSecureRel
+  getSecureRel,
+  isFocusInsideNavigationMenu,
+  warnNavigationMenuOpenWithoutValue
 } from "@expcat/tigercat-core";
-var navigationMenuItemIdCounter = 0;
-var createNavigationMenuItemId = () => `tiger-navigation-menu-item-${++navigationMenuItemIdCounter}`;
 var NavigationMenuContextKey = /* @__PURE__ */ Symbol("NavigationMenuContext");
 var NavigationMenuItemContextKey = /* @__PURE__ */ Symbol("NavigationMenuItemContext");
 var NavigationMenuContentContextKey = /* @__PURE__ */ Symbol("NavigationMenuContentContext");
-function containsFocusTarget(container, target) {
-  return Boolean(container && target instanceof Node && container.contains(target));
-}
-function getOpenPanelFromMenubar(menubar) {
-  if (!menubar) return null;
-  const trigger = menubar.querySelector('[aria-expanded="true"][aria-controls]');
-  const contentId = trigger?.getAttribute("aria-controls");
-  if (!contentId) return null;
-  return menubar.ownerDocument.getElementById(contentId);
+function useNavigationMenuContext() {
+  return inject(NavigationMenuContextKey, null);
 }
 function splitClassStyleAttrs(attrs) {
   const {
@@ -70,6 +71,24 @@ function splitClassStyleAttrs(attrs) {
   } = attrs;
   return { restAttrs, attrsClass, attrsStyle };
 }
+function nodesHaveList(nodes) {
+  for (const node of nodes) {
+    if (!isVNode(node)) continue;
+    if (node.type === NavigationMenuList) return true;
+    if (node.type === Fragment && Array.isArray(node.children)) {
+      if (nodesHaveList(node.children)) return true;
+    }
+  }
+  return false;
+}
+function commitMenubarKey(root, event) {
+  if (!root?.menubarRef.value) return false;
+  const next = handleMenubarNavigation(root.menubarRef.value, event);
+  if (!next) return false;
+  const value = getNavigationMenuItemValue(next);
+  if (value != null) root.setTabStopValue(value);
+  return true;
+}
 var NavigationMenuLink = defineComponent({
   name: "TigerNavigationMenuLink",
   inheritAttrs: false,
@@ -113,7 +132,9 @@ var NavigationMenuLink = defineComponent({
       null
     );
     const inPanel = Boolean(content);
-    const disabled = computed(() => props.disabled || Boolean(item?.disabled));
+    const disabled = computed(
+      () => props.disabled || Boolean(item?.disabled) || Boolean(!inPanel && root?.disabled)
+    );
     const handleClick = (event) => {
       if (disabled.value) {
         event.preventDefault();
@@ -128,12 +149,11 @@ var NavigationMenuLink = defineComponent({
       if (!item || !item.hasPanel.value) {
         root?.setValue(null, { restoreFocus: false });
       }
+      if (item) root?.setTabStopValue(item.value);
     };
     const handleKeyDown = (event) => {
       if (inPanel) return;
-      if (root?.menubarRef.value) {
-        handleMenubarNavigation(root.menubarRef.value, event);
-      }
+      commitMenubarKey(root, event);
     };
     const linkClasses = computed(
       () => classNames(
@@ -147,27 +167,31 @@ var NavigationMenuLink = defineComponent({
     );
     return () => {
       const { restAttrs } = splitClassStyleAttrs(attrsRecord);
-      const isAnchor = Boolean(props.href);
+      const isDisabled = disabled.value;
+      const isAnchor = Boolean(props.href) && !isDisabled;
       const rel = isAnchor ? getSecureRel(
         props.target,
         props.rel
       ) : void 0;
+      const tabIndex = inPanel ? -1 : getNavigationMenuRovingTabIndex(item?.value ?? "", root?.tabStopValue.value);
+      const tag = isAnchor ? "a" : props.href ? "span" : "button";
       return h(
-        isAnchor ? "a" : "button",
+        tag,
         {
           ...restAttrs,
           href: isAnchor ? props.href : void 0,
           target: isAnchor ? props.target : void 0,
           rel,
-          type: isAnchor ? void 0 : "button",
+          type: tag === "button" ? "button" : void 0,
           class: linkClasses.value,
           style: mergedStyle.value,
           role: "menuitem",
-          tabindex: inPanel ? -1 : -1,
-          [NAVIGATION_MENU_BAR_ITEM_ATTR]: inPanel ? void 0 : "",
-          "aria-disabled": disabled.value || void 0,
+          tabindex: tabIndex,
+          [NAVIGATION_MENU_BAR_ITEM_ATTR]: inPanel || isDisabled ? void 0 : "",
+          [NAVIGATION_MENU_ITEM_VALUE_ATTR]: inPanel ? void 0 : String(item?.value ?? ""),
+          "aria-disabled": isDisabled || void 0,
           "aria-current": props.active ? "page" : void 0,
-          disabled: isAnchor ? void 0 : disabled.value,
+          disabled: tag === "button" ? isDisabled : void 0,
           "data-tiger-navigation-menu-link": "",
           "data-active": props.active ? "true" : void 0,
           onClick: handleClick,
@@ -211,28 +235,24 @@ var NavigationMenuTrigger = defineComponent({
       () => props.showArrow !== void 0 ? props.showArrow : item?.showArrow ?? true
     );
     const handleMouseEnter = () => {
-      if (disabled.value) return;
+      if (disabled.value || !root?.openOnHover) return;
       item?.scheduleOpen();
     };
     const handleMouseLeave = () => {
+      if (!root?.openOnHover) return;
       item?.scheduleClose();
     };
-    const handleFocus = () => {
-      if (disabled.value || root?.suppressFocusOpen.value) return;
-      item?.open();
-    };
     const handleClick = (event) => {
       if (disabled.value) {
         event.preventDefault();
         return;
       }
-      item?.open();
+      if (item?.isOpen.value) item.close({ restoreFocus: false });
+      else item?.open();
     };
     const handleKeyDown = (event) => {
       if (disabled.value || !item) return;
-      if (root?.menubarRef.value && handleMenubarNavigation(root.menubarRef.value, event)) {
-        return;
-      }
+      if (commitMenubarKey(root, event)) return;
       if (isNavigationMenuTriggerOpenKey(event.key) && item.hasPanel.value) {
         event.preventDefault();
         item.open(true);
@@ -280,18 +300,19 @@ var NavigationMenuTrigger = defineComponent({
           class: triggerClasses.value,
           style: mergedStyle.value,
           role: "menuitem",
-          tabindex: -1,
-          [NAVIGATION_MENU_BAR_ITEM_ATTR]: "",
+          tabindex: getNavigationMenuRovingTabIndex(item.value, root?.tabStopValue.value),
+          [NAVIGATION_MENU_BAR_ITEM_ATTR]: disabled.value ? void 0 : "",
+          [NAVIGATION_MENU_ITEM_VALUE_ATTR]: String(item.value),
           "aria-haspopup": "menu",
           "aria-expanded": item.isOpen.value,
-          "aria-controls": item.isOpen.value ? item.contentId : void 0,
+          "aria-controls": item.contentId,
           "aria-disabled": disabled.value || void 0,
           disabled: disabled.value,
           "data-state": item.isOpen.value ? "open" : "closed",
           "data-tiger-navigation-menu-trigger": "",
           onMouseenter: handleMouseEnter,
           onMouseleave: handleMouseLeave,
-          onFocus: handleFocus,
+          onFocus: () => root?.setTabStopValue(item.value),
           onClick: handleClick,
           onKeydown: handleKeyDown
         },
@@ -331,40 +352,49 @@ var NavigationMenuContent = defineComponent({
       referenceRef: item?.triggerRef ?? ref(null),
       floatingRef: item?.contentRef ?? ref(null),
       enabled: overlayEnabled,
-      placement: root?.placement ?? "bottom-start",
-      offset: root?.offset ?? NAVIGATION_MENU_DEFAULT_OFFSET,
+      placement: () => root?.placement ?? "bottom-start",
+      offset: () => root?.offset ?? NAVIGATION_MENU_DEFAULT_OFFSET,
       portal: portalEnabled,
       dismissOnOutside: true,
       dismissOnEscape: true,
-      onDismiss: () => item?.close()
-    });
-    if (item) item.hasPanel.value = true;
-    onBeforeUnmount(() => {
-      if (item) item.hasPanel.value = false;
+      onDismiss: () => item?.close({ restoreFocus: false })
     });
     const handleMouseEnter = () => {
       item?.cancelClose();
     };
     const handleMouseLeave = () => {
+      if (!root?.openOnHover) return;
       item?.scheduleClose();
     };
     const handleFocusOut = (event) => {
       root?.handleFocusLeave(event);
     };
     const handleKeyDown = (event) => {
-      if (item?.contentRef.value) {
-        handleMenuNavigation(item.contentRef.value, event);
+      const panel = item?.contentRef.value;
+      if (!panel || !item || !root) return;
+      if (!panel.contains(event.target)) return;
+      const dir = resolveElementDir(root.rootRef.value ?? root.menubarRef.value);
+      const action = applyNavigationMenuPanelKey({ event, panel, dir });
+      if (!action || action === "menu-nav") return;
+      event.stopPropagation();
+      if (action === "close-to-trigger") {
+        item.close();
+        item.triggerRef.value?.focus();
+        return;
       }
-      if (event.key === "Escape" || event.key === "ArrowLeft") {
-        event.preventDefault();
-        event.stopPropagation();
-        item?.close();
-        item?.triggerRef.value?.focus();
+      if (action === "move-menubar-next" && root.menubarRef.value) {
+        item.close({ restoreFocus: false });
+        item.triggerRef.value?.focus();
+        const next = handleMenubarNavigation(root.menubarRef.value, event);
+        const value = getNavigationMenuItemValue(next);
+        if (value != null) root.setTabStopValue(value);
         return;
       }
-      if ((event.key === "ArrowRight" || event.key === "ArrowLeft") && root?.menubarRef.value && item?.triggerRef.value) {
-        item.triggerRef.value.focus();
-        handleMenubarNavigation(root.menubarRef.value, event);
+      if (action === "tab-exit" || action === "shift-tab-exit") {
+        const nav = root.rootRef.value;
+        const target = nav ? getNavigationMenuTabExitTarget(nav, panel, action === "shift-tab-exit") : null;
+        item.close({ restoreFocus: false });
+        target?.focus();
       }
     };
     const panelClasses = computed(
@@ -378,7 +408,10 @@ var NavigationMenuContent = defineComponent({
       )
     );
     const mergedStyle = computed(
-      () => mergeStyleValues(attrsRecord.style, props.style)
+      () => mergeStyleValues(
+        attrsRecord.style,
+        props.mega ? { minWidth: "28rem", ...props.style } : props.style
+      )
     );
     return () => {
       if (!item || !root) return null;
@@ -406,7 +439,7 @@ var NavigationMenuContent = defineComponent({
               id: item.contentId,
               class: innerClasses.value,
               style: mergedStyle.value,
-              role: props.mega ? "group" : "menu"
+              role: "menu"
             },
             slots.default?.()
           )
@@ -440,7 +473,7 @@ var NavigationMenuItem = defineComponent({
   setup(props, { slots, attrs }) {
     const attrsRecord = attrs;
     const root = inject(NavigationMenuContextKey, null);
-    const autoValue = createNavigationMenuItemId();
+    const autoValue = `tiger-navigation-menu-item-${useId()}`;
     const itemValue = computed(() => props.value ?? autoValue);
     const triggerRef = ref(null);
     const contentRef = ref(null);
@@ -453,17 +486,16 @@ var NavigationMenuItem = defineComponent({
       if (props.disabled || !root) return;
       root.cancelClose();
       root.setValue(itemValue.value);
+      root.setTabStopValue(itemValue.value);
       if (!focusPanel) return;
       nextTick(() => {
-        requestAnimationFrame(() => {
-          const panel = contentRef.value ?? document.getElementById(contentId);
-          if (panel) focusFirstMenuItem(panel);
-        });
+        const panel = contentRef.value ?? document.getElementById(contentId);
+        if (panel) focusFirstMenuItemWhenVisible(panel);
       });
     };
-    const close = () => {
+    const close = (options) => {
       if (!root) return;
-      if (isOpen.value) root.setValue(null);
+      if (isOpen.value) root.setValue(null, options);
     };
     const scheduleOpen = () => {
       if (props.disabled || !root) return;
@@ -509,6 +541,8 @@ var NavigationMenuItem = defineComponent({
       () => mergeStyleValues(attrsRecord.style, props.style)
     );
     return () => {
+      const children = slots.default?.() ?? [];
+      hasPanel.value = children.some((node) => node.type === NavigationMenuContent);
       const { restAttrs } = splitClassStyleAttrs(attrsRecord);
       return h(
         "li",
@@ -520,7 +554,7 @@ var NavigationMenuItem = defineComponent({
           "data-tiger-navigation-menu-item": "",
           "data-state": isOpen.value ? "open" : "closed"
         },
-        slots.default?.()
+        children
       );
     };
   }
@@ -542,12 +576,18 @@ var NavigationMenuList = defineComponent({
     const attrsRecord = attrs;
     const root = inject(NavigationMenuContextKey, null);
     const listRef = ref(null);
-    const syncRoving = () => {
+    const syncTabStop = () => {
       if (root) root.menubarRef.value = listRef.value;
-      if (listRef.value) initNavigationMenuRovingTabIndex(listRef.value);
+      if (!listRef.value || !root) return;
+      const next = resolveNavigationMenuTabStopValue({
+        items: getNavigationMenuBarItems(listRef.value),
+        tabStopValue: root.tabStopValue.value
+      });
+      if (next != null && next !== String(root.tabStopValue.value ?? "")) {
+        root.setTabStopValue(next);
+      }
     };
-    onMounted(syncRoving);
-    onUpdated(syncRoving);
+    onMounted(syncTabStop);
     const listClasses = computed(
       () => classNames(
         getNavigationMenuListClasses(),
@@ -559,6 +599,7 @@ var NavigationMenuList = defineComponent({
       () => mergeStyleValues(attrsRecord.style, props.style)
     );
     return () => {
+      nextTick(syncTabStop);
       const { restAttrs } = splitClassStyleAttrs(attrsRecord);
       return h(
         "ul",
@@ -595,6 +636,10 @@ var NavigationMenu = defineComponent({
       type: Boolean,
       default: false
     },
+    openOnHover: {
+      type: Boolean,
+      default: false
+    },
     disabled: {
       type: Boolean,
       default: false
@@ -643,7 +688,7 @@ var NavigationMenu = defineComponent({
     const previousActiveElement = ref(null);
     const rootRef = ref(null);
     const menubarRef = ref(null);
-    const suppressFocusOpen = ref(false);
+    const tabStopValue = ref(null);
     const initialValue = props.defaultValue ?? (props.defaultOpen ? props.value ?? null : null);
     const internalValue = ref(
       isNavigationMenuOpen(initialValue) ? initialValue : null
@@ -656,22 +701,9 @@ var NavigationMenu = defineComponent({
       })
     );
     const currentOpen = computed(() => isNavigationMenuOpen(currentValue.value));
-    let openTimer = null;
-    let closeTimer = null;
-    let lastOpenAt = 0;
-    const clearTimers = () => {
-      if (openTimer) {
-        clearTimeout(openTimer);
-        openTimer = null;
-      }
-      if (closeTimer) {
-        clearTimeout(closeTimer);
-        closeTimer = null;
-      }
-    };
     const setValue = (next, options) => {
       if (props.disabled && next != null) return;
-      clearTimers();
+      hover.clear();
       const resolvedNext = isNavigationMenuOpen(next) ? next : null;
       const wasOpen = isNavigationMenuOpen(currentValue.value);
       const willOpen = resolvedNext != null;
@@ -686,87 +718,54 @@ var NavigationMenu = defineComponent({
       }
       emit("update:value", resolvedNext);
       emit("value-change", resolvedNext);
-      const open = willOpen;
-      emit("update:open", open);
-      emit("open-change", open);
-      if (!willOpen) {
-        suppressFocusOpen.value = true;
-        if (options?.restoreFocus !== false) {
-          restoreFocus(previousActiveElement.value);
-        }
+      emit("update:open", willOpen);
+      emit("open-change", willOpen);
+      if (!willOpen && options?.restoreFocus !== false) {
+        restoreFocus(previousActiveElement.value);
         previousActiveElement.value = null;
-        nextTick(() => {
-          suppressFocusOpen.value = false;
-        });
-      }
-    };
-    const scheduleOpen = (itemValue) => {
-      if (props.disabled) return;
-      if (closeTimer) {
-        clearTimeout(closeTimer);
-        closeTimer = null;
-      }
-      const skip = shouldSkipNavigationMenuOpenDelay(
-        lastOpenAt,
-        Date.now(),
-        props.skipDelayDuration
-      );
-      const delay = skip ? 0 : props.delayDuration;
-      const apply = () => {
-        lastOpenAt = Date.now();
-        setValue(itemValue);
-        openTimer = null;
-      };
-      if (delay <= 0) {
-        apply();
-        return;
-      }
-      if (openTimer) clearTimeout(openTimer);
-      openTimer = setTimeout(apply, delay);
-    };
-    const scheduleClose = (itemValue) => {
-      if (openTimer) {
-        clearTimeout(openTimer);
-        openTimer = null;
-      }
-      const close = () => {
-        if (currentValue.value === itemValue) setValue(null);
-        closeTimer = null;
-      };
-      if (props.skipDelayDuration <= 0) {
-        close();
-        return;
-      }
-      if (closeTimer) clearTimeout(closeTimer);
-      closeTimer = setTimeout(close, props.skipDelayDuration);
-    };
-    const cancelClose = () => {
-      if (closeTimer) {
-        clearTimeout(closeTimer);
-        closeTimer = null;
       }
     };
+    const hover = createNavigationMenuHoverSession({
+      getDelayDuration: () => props.delayDuration,
+      getSkipDelayDuration: () => props.skipDelayDuration,
+      getValue: () => currentValue.value,
+      setValue,
+      isDisabled: () => props.disabled
+    });
     const handleItemClick = () => {
-      if (props.closeOnClick) setValue(null);
+      if (props.closeOnClick) setValue(null, { restoreFocus: false });
     };
     const handleFocusLeave = (event) => {
-      const next = event.relatedTarget;
-      if (containsFocusTarget(rootRef.value, next)) return;
-      if (containsFocusTarget(getOpenPanelFromMenubar(menubarRef.value), next)) return;
+      if (isFocusInsideNavigationMenu(rootRef.value, menubarRef.value, event.relatedTarget)) {
+        return;
+      }
       if (!isNavigationMenuOpen(currentValue.value)) return;
       setValue(null, { restoreFocus: false });
     };
-    onBeforeUnmount(clearTimers);
+    onBeforeUnmount(hover.clear);
+    onMounted(() => {
+      warnNavigationMenuOpenWithoutValue(
+        props.open,
+        isNavigationMenuOpen(props.value ?? props.defaultValue ?? internalValue.value)
+      );
+    });
     const portalEnabled = computed(() => props.portal);
     const navigationMenuContext = {
       value: currentValue,
+      tabStopValue,
+      setTabStopValue: (next) => {
+        tabStopValue.value = next;
+      },
       setValue,
-      scheduleOpen,
-      scheduleClose,
-      cancelClose,
+      scheduleOpen: hover.scheduleOpen,
+      scheduleClose: hover.scheduleClose,
+      cancelClose: hover.cancelClose,
       get closeOnClick() {
         return props.closeOnClick;
       },
+      get openOnHover() {
+        return props.openOnHover;
+      },
       handleItemClick,
       handleFocusLeave,
       portal: portalEnabled,
@@ -782,8 +781,8 @@ var NavigationMenu = defineComponent({
       get showArrow() {
         return props.showArrow;
       },
-      menubarRef,
-      suppressFocusOpen
+      rootRef,
+      menubarRef
     };
     provide(NavigationMenuContextKey, navigationMenuContext);
     const containerClasses = computed(
@@ -798,7 +797,7 @@ var NavigationMenu = defineComponent({
     );
     return () => {
       const defaultSlot = slots.default?.() ?? [];
-      const hasList = defaultSlot.some((node) => node.type === NavigationMenuList);
+      const hasList = nodesHaveList(defaultSlot);
       const children = hasList ? defaultSlot : [h(NavigationMenuList, null, { default: () => defaultSlot })];
       const { restAttrs } = splitClassStyleAttrs(attrsRecord);
       return h(
@@ -808,7 +807,6 @@ var NavigationMenu = defineComponent({
           ref: rootRef,
           class: containerClasses.value,
           style: mergedStyle.value,
-          "aria-label": restAttrs["aria-label"] ?? "Main",
           "data-tiger-navigation-menu": "",
           "data-state": currentOpen.value ? "open" : "closed",
           onFocusout: handleFocusLeave
@@ -824,6 +822,7 @@ export {
   NavigationMenuContextKey,
   NavigationMenuItemContextKey,
   NavigationMenuContentContextKey,
+  useNavigationMenuContext,
   NavigationMenuLink,
   NavigationMenuTrigger,
   NavigationMenuContent,

package/dist/chunk-LNKOYOX2.mjs

@@ -0,0 +1,80 @@
+// src/components/Divider.ts
+import { defineComponent, h } from "vue";
+import {
+  classNames,
+  coerceClassValue,
+  mergeStyleValues,
+  getDividerClasses,
+  getDividerLineClasses,
+  getDividerStyle,
+  hasDividerLabel
+} from "@expcat/tigercat-core";
+var Divider = defineComponent({
+  name: "TigerDivider",
+  inheritAttrs: false,
+  props: {
+    orientation: {
+      type: String,
+      default: "horizontal"
+    },
+    lineStyle: {
+      type: String,
+      default: "solid"
+    },
+    spacing: {
+      type: String,
+      default: "md"
+    },
+    color: String,
+    thickness: String,
+    className: {
+      type: String,
+      default: void 0
+    },
+    style: {
+      type: Object,
+      default: void 0
+    }
+  },
+  setup(props, { attrs, slots }) {
+    return () => {
+      const attrsRecord = attrs;
+      const children = slots.default?.();
+      const labeled = hasDividerLabel(children);
+      const lineStyleObj = getDividerStyle(
+        props.orientation,
+        props.color,
+        props.thickness,
+        props.lineStyle
+      );
+      const classes = classNames(
+        getDividerClasses(props.orientation, props.lineStyle, props.spacing, labeled),
+        props.className,
+        coerceClassValue(attrsRecord.class)
+      );
+      const lineClass = getDividerLineClasses(props.orientation, props.lineStyle, true);
+      return h(
+        "div",
+        {
+          ...attrs,
+          class: classes,
+          style: labeled ? mergeStyleValues(attrsRecord.style, props.style) : mergeStyleValues(lineStyleObj, attrsRecord.style, props.style),
+          role: "separator",
+          "aria-orientation": props.orientation,
+          "data-tiger-divider": ""
+        },
+        labeled ? [
+          h("span", { "aria-hidden": "true", class: lineClass, style: lineStyleObj }),
+          h("span", children),
+          h("span", { "aria-hidden": "true", class: lineClass, style: lineStyleObj })
+        ] : void 0
+      );
+    };
+  }
+});
+var Divider_default = Divider;
+
+export {
+  Divider,
+  Divider_default
+};