@expcat/tigercat-vue 2.1.2 → 2.1.4

package/dist/{chunk-6GR5U4UB.mjs → chunk-56QJDQQF.mjs}

@@ -1,12 +1,15 @@
+import {
+  Link
+} from "./chunk-2HP6DX7Q.mjs";
 import {
   Button
-} from "./chunk-YZBQ6IR7.mjs";
+} from "./chunk-4KIZXFFG.mjs";
 import {
-  Link
-} from "./chunk-3MO7A4GU.mjs";
+  useTigerConfig
+} from "./chunk-4GOTWNOO.mjs";
 
 // src/components/PageHeader.ts
-import { defineComponent, getCurrentInstance, h } from "vue";
+import { computed, defineComponent, getCurrentInstance, h, useId } from "vue";
 import {
   chevronLeftSolidIcon20PathD,
   coerceClassValue,
@@ -14,6 +17,10 @@ import {
   getPageHeaderBackButtonClasses,
   getPageHeaderRootClasses,
   hasPageHeaderHeadingContent,
+  hasPageHeaderNode,
+  resolvePageHeaderHeadingTag,
+  mergeTigerLocale,
+  getPageHeaderLabels,
   icon20ViewBox,
   mergeStyleValues,
   pageHeaderActionsClasses,
@@ -95,6 +102,18 @@ var PageHeader = defineComponent({
       type: String,
       default: void 0
     },
+    headingLevel: {
+      type: Number,
+      default: 1
+    },
+    locale: {
+      type: Object,
+      default: void 0
+    },
+    labels: {
+      type: Object,
+      default: void 0
+    },
     /**
      * Additional CSS classes
      */
@@ -118,6 +137,10 @@ var PageHeader = defineComponent({
   },
   setup(props, { slots, emit, attrs }) {
     const instance = getCurrentInstance();
+    const config = useTigerConfig();
+    const titleId = `tiger-page-header-title-${useId().replace(/[^a-zA-Z0-9_-]/g, "")}`;
+    const mergedLocale = computed(() => mergeTigerLocale(config.value.locale, props.locale));
+    const headerLabels = computed(() => getPageHeaderLabels(mergedLocale.value, props.labels));
     const handleBack = (event) => {
       emit("back", event);
     };
@@ -134,7 +157,7 @@ var PageHeader = defineComponent({
       const hasTitleSlot = hasSlotContent(titleSlot);
       const hasSubTitleSlot = hasSlotContent(subTitleSlot);
       const hasActions = hasSlotContent(actions);
-      const hasBackOverride = hasSlotContent(backOverride);
+      const hasBackOverride = hasPageHeaderNode(backOverride) && hasSlotContent(backOverride);
       const hasBody = hasSlotContent(body);
       const titleContent = hasTitleSlot ? titleSlot : props.title;
       const subTitleContent = hasSubTitleSlot ? subTitleSlot : props.subTitle;
@@ -142,7 +165,7 @@ var PageHeader = defineComponent({
       const hasSubtitle = hasSubTitleSlot || Boolean(props.subTitle);
       const showBack = resolvePageHeaderBackVisibility({
         showBack: props.showBack,
-        hasHandler: Boolean(vnodeProps && "onBack" in vnodeProps),
+        hasHandler: typeof vnodeProps?.onBack === "function",
         hasBackHref: Boolean(props.backHref),
         hasBackOverride
       });
@@ -153,7 +176,11 @@ var PageHeader = defineComponent({
         hasSubtitle,
         hasActions
       });
-      const backAriaLabel = resolvePageHeaderBackAriaLabel(props.backAriaLabel);
+      const backAriaLabel = resolvePageHeaderBackAriaLabel(
+        props.backAriaLabel,
+        headerLabels.value.backAriaLabel
+      );
+      const TitleTag = resolvePageHeaderHeadingTag(props.headingLevel);
       const backControl = showBack ? h("div", { class: pageHeaderBackWrapClasses, "data-page-header-back": "" }, [
         hasBackOverride ? backOverride : props.backHref ? h(
           Link,
@@ -182,8 +209,12 @@ var PageHeader = defineComponent({
         hasBreadcrumb ? breadcrumb : null,
         hasTitle || hasSubtitle ? h("div", { class: pageHeaderTitleRowClasses }, [
           hasTitle ? h(
-            "div",
-            { class: pageHeaderTitleClasses, "data-page-header-title": "" },
+            TitleTag,
+            {
+              id: titleId,
+              class: pageHeaderTitleClasses,
+              "data-page-header-title": ""
+            },
             titleContent
           ) : null,
           hasSubtitle ? h(
@@ -210,7 +241,8 @@ var PageHeader = defineComponent({
             coerceClassValue(attrsRecord.class)
           ),
           style: mergeStyleValues(attrsRecord.style, props.style),
-          "data-page-header": ""
+          "data-page-header": "",
+          "aria-labelledby": hasTitle ? titleId : void 0
         },
         [heading, hasBody ? h("div", { class: pageHeaderContentClasses }, body) : null]
       );