@expcat/tigercat-vue 1.3.4 → 1.5.0

package/dist/{chunk-X6FG4RPF.js → chunk-WF7KVMBY.js}

@@ -1,4 +1,8 @@
-"use strict";Object.defineProperty(exports, "__esModule", {value: true}); function _nullishCoalesce(lhs, rhsFn) { if (lhs != null) { return lhs; } else { return rhsFn(); } }// src/components/ImagePreview.ts
+"use strict";Object.defineProperty(exports, "__esModule", {value: true}); function _nullishCoalesce(lhs, rhsFn) { if (lhs != null) { return lhs; } else { return rhsFn(); } }
+
+var _chunkIXTYS3EKjs = require('./chunk-IXTYS3EK.js');
+
+// src/components/ImagePreview.ts
 
 
 
@@ -33,6 +37,8 @@ var _vue = require('vue');
 
 
 
+
+
 
 
 
@@ -66,10 +72,17 @@ var ImagePreview = _vue.defineComponent.call(void 0, {
     maskClosable: { type: Boolean, default: true },
     scaleStep: { type: Number, default: 0.5 },
     minScale: { type: Number, default: 0.25 },
-    maxScale: { type: Number, default: 5 }
+    maxScale: { type: Number, default: 5 },
+    locale: {
+      type: Object,
+      default: void 0
+    }
   },
   emits: ["update:open", "update:currentIndex", "scale-change"],
   setup(props, { emit }) {
+    const config = _chunkIXTYS3EKjs.useTigerConfig.call(void 0, );
+    const mergedLocale = _vue.computed.call(void 0, () => _tigercatcore.mergeTigerLocale.call(void 0, config.value.locale, props.locale));
+    const labels = _vue.computed.call(void 0, () => _tigercatcore.getImageViewerLabels.call(void 0, mergedLocale.value));
     const scale = _vue.ref.call(void 0, 1);
     const rotation = _vue.ref.call(void 0, 0);
     const offsetX = _vue.ref.call(void 0, 0);
@@ -262,7 +275,7 @@ var ImagePreview = _vue.defineComponent.call(void 0, {
         {
           class: _tigercatcore.imagePreviewCloseBtnClasses,
           onClick: handleClose,
-          "aria-label": "Close preview",
+          "aria-label": labels.value.closePreviewAriaLabel,
           type: "button"
         },
         [svgIcon(_tigercatcore.previewCloseIconPath)]
@@ -273,7 +286,7 @@ var ImagePreview = _vue.defineComponent.call(void 0, {
           {
             class: _tigercatcore.imagePreviewToolbarBtnClasses,
             onClick: handleZoomOut,
-            "aria-label": "Zoom out",
+            "aria-label": labels.value.zoomOutAriaLabel,
             type: "button"
           },
           [svgIcon(_tigercatcore.zoomOutIconPath)]
@@ -283,7 +296,7 @@ var ImagePreview = _vue.defineComponent.call(void 0, {
           {
             class: _tigercatcore.imagePreviewToolbarBtnClasses,
             onClick: handleReset,
-            "aria-label": "Reset",
+            "aria-label": labels.value.resetAriaLabel,
             type: "button"
           },
           [svgIcon(_tigercatcore.resetIconPath)]
@@ -293,7 +306,7 @@ var ImagePreview = _vue.defineComponent.call(void 0, {
           {
             class: _tigercatcore.imagePreviewToolbarBtnClasses,
             onClick: handleZoomIn,
-            "aria-label": "Zoom in",
+            "aria-label": labels.value.zoomInAriaLabel,
             type: "button"
           },
           [svgIcon(_tigercatcore.zoomInIconPath)]
@@ -303,7 +316,7 @@ var ImagePreview = _vue.defineComponent.call(void 0, {
           {
             class: _tigercatcore.imagePreviewToolbarBtnClasses,
             onClick: handleRotateLeft,
-            "aria-label": "Rotate left",
+            "aria-label": labels.value.rotateLeftAriaLabel,
             type: "button"
           },
           [svgIcon(_tigercatcore.imageViewerIcons.rotateLeft)]
@@ -313,7 +326,7 @@ var ImagePreview = _vue.defineComponent.call(void 0, {
           {
             class: _tigercatcore.imagePreviewToolbarBtnClasses,
             onClick: handleRotateRight,
-            "aria-label": "Rotate right",
+            "aria-label": labels.value.rotateRightAriaLabel,
             type: "button"
           },
           [svgIcon(_tigercatcore.imageViewerIcons.rotateRight)]
@@ -326,7 +339,7 @@ var ImagePreview = _vue.defineComponent.call(void 0, {
           class: _tigercatcore.classNames.call(void 0, _tigercatcore.imagePreviewNavBtnClasses, "left-4"),
           onClick: handlePrev,
           disabled: !navState.value.hasPrev,
-          "aria-label": "Previous image",
+          "aria-label": labels.value.previousImageAriaLabel,
           type: "button"
         },
         [svgIcon(_tigercatcore.prevIconPath)]
@@ -337,7 +350,7 @@ var ImagePreview = _vue.defineComponent.call(void 0, {
           class: _tigercatcore.classNames.call(void 0, _tigercatcore.imagePreviewNavBtnClasses, "right-4"),
           onClick: handleNext,
           disabled: !navState.value.hasNext,
-          "aria-label": "Next image",
+          "aria-label": labels.value.nextImageAriaLabel,
           type: "button"
         },
         [svgIcon(_tigercatcore.nextIconPath)]
@@ -349,7 +362,7 @@ var ImagePreview = _vue.defineComponent.call(void 0, {
           style: { zIndex: props.zIndex },
           role: "dialog",
           "aria-modal": "true",
-          "aria-label": "Image preview",
+          "aria-label": labels.value.previewDialogAriaLabel,
           onClick: handleMaskClick,
           onWheel: handleWheel
         },

package/dist/{chunk-WFISP42H.mjs → chunk-WLHOWOAY.mjs}

@@ -1,3 +1,7 @@
+import {
+  useTigerConfig
+} from "./chunk-R6WFL6NI.mjs";
+
 // src/components/Empty.ts
 import { defineComponent, computed, h } from "vue";
 import {
@@ -10,7 +14,8 @@ import {
   emptyActionsClasses,
   emptyIllustrationViewBox,
   emptyIllustrationPaths,
-  getEmptyDescription
+  getEmptyDescription,
+  mergeTigerLocale
 } from "@expcat/tigercat-core";
 var Empty = defineComponent({
   name: "TigerEmpty",
@@ -35,10 +40,18 @@ var Empty = defineComponent({
     style: {
       type: Object,
       default: void 0
+    },
+    locale: {
+      type: Object,
+      default: void 0
     }
   },
   setup(props, { slots, attrs }) {
-    const descText = computed(() => props.description ?? getEmptyDescription(props.preset));
+    const config = useTigerConfig();
+    const mergedLocale = computed(() => mergeTigerLocale(config.value.locale, props.locale));
+    const descText = computed(
+      () => props.description ?? getEmptyDescription(props.preset, mergedLocale.value)
+    );
     return () => {
       const attrsRecord = attrs;
       const children = [];

package/dist/{chunk-W6VKVYWZ.mjs → chunk-WSUCJHJX.mjs}

@@ -1,6 +1,6 @@
 import {
   ImagePreview
-} from "./chunk-KY3O3FWK.mjs";
+} from "./chunk-WWB7VKKH.mjs";
 import {
   useFloatingPopup
 } from "./chunk-M4EP4OVR.mjs";
@@ -166,7 +166,7 @@ var Image = defineComponent({
       if (ht) base.height = ht;
       return mergeStyleValues(attrs.style, props.style, base);
     });
-    const imgClasses = computed(() => getImageImgClasses(props.fit));
+    const imgClasses = computed(() => getImageImgClasses(props.fit ?? "cover"));
     return () => {
       const forwardedAttrs = Object.fromEntries(
         Object.entries(attrs).filter(([key]) => key !== "class" && key !== "style")

package/dist/{chunk-KY3O3FWK.mjs → chunk-WWB7VKKH.mjs}

@@ -1,3 +1,7 @@
+import {
+  useTigerConfig
+} from "./chunk-R6WFL6NI.mjs";
+
 // src/components/ImagePreview.ts
 import {
   defineComponent,
@@ -35,7 +39,9 @@ import {
   movePan,
   createPinchState,
   startPinch,
-  movePinch
+  movePinch,
+  getImageViewerLabels,
+  mergeTigerLocale
 } from "@expcat/tigercat-core";
 var svgIcon = (d, cls = "w-5 h-5") => h(
   "svg",
@@ -66,10 +72,17 @@ var ImagePreview = defineComponent({
     maskClosable: { type: Boolean, default: true },
     scaleStep: { type: Number, default: 0.5 },
     minScale: { type: Number, default: 0.25 },
-    maxScale: { type: Number, default: 5 }
+    maxScale: { type: Number, default: 5 },
+    locale: {
+      type: Object,
+      default: void 0
+    }
   },
   emits: ["update:open", "update:currentIndex", "scale-change"],
   setup(props, { emit }) {
+    const config = useTigerConfig();
+    const mergedLocale = computed(() => mergeTigerLocale(config.value.locale, props.locale));
+    const labels = computed(() => getImageViewerLabels(mergedLocale.value));
     const scale = ref(1);
     const rotation = ref(0);
     const offsetX = ref(0);
@@ -262,7 +275,7 @@ var ImagePreview = defineComponent({
         {
           class: imagePreviewCloseBtnClasses,
           onClick: handleClose,
-          "aria-label": "Close preview",
+          "aria-label": labels.value.closePreviewAriaLabel,
           type: "button"
         },
         [svgIcon(previewCloseIconPath)]
@@ -273,7 +286,7 @@ var ImagePreview = defineComponent({
           {
             class: imagePreviewToolbarBtnClasses,
             onClick: handleZoomOut,
-            "aria-label": "Zoom out",
+            "aria-label": labels.value.zoomOutAriaLabel,
             type: "button"
           },
           [svgIcon(zoomOutIconPath)]
@@ -283,7 +296,7 @@ var ImagePreview = defineComponent({
           {
             class: imagePreviewToolbarBtnClasses,
             onClick: handleReset,
-            "aria-label": "Reset",
+            "aria-label": labels.value.resetAriaLabel,
             type: "button"
           },
           [svgIcon(resetIconPath)]
@@ -293,7 +306,7 @@ var ImagePreview = defineComponent({
           {
             class: imagePreviewToolbarBtnClasses,
             onClick: handleZoomIn,
-            "aria-label": "Zoom in",
+            "aria-label": labels.value.zoomInAriaLabel,
             type: "button"
           },
           [svgIcon(zoomInIconPath)]
@@ -303,7 +316,7 @@ var ImagePreview = defineComponent({
           {
             class: imagePreviewToolbarBtnClasses,
             onClick: handleRotateLeft,
-            "aria-label": "Rotate left",
+            "aria-label": labels.value.rotateLeftAriaLabel,
             type: "button"
           },
           [svgIcon(imageViewerIcons.rotateLeft)]
@@ -313,7 +326,7 @@ var ImagePreview = defineComponent({
           {
             class: imagePreviewToolbarBtnClasses,
             onClick: handleRotateRight,
-            "aria-label": "Rotate right",
+            "aria-label": labels.value.rotateRightAriaLabel,
             type: "button"
           },
           [svgIcon(imageViewerIcons.rotateRight)]
@@ -326,7 +339,7 @@ var ImagePreview = defineComponent({
           class: classNames(imagePreviewNavBtnClasses, "left-4"),
           onClick: handlePrev,
           disabled: !navState.value.hasPrev,
-          "aria-label": "Previous image",
+          "aria-label": labels.value.previousImageAriaLabel,
           type: "button"
         },
         [svgIcon(prevIconPath)]
@@ -337,7 +350,7 @@ var ImagePreview = defineComponent({
           class: classNames(imagePreviewNavBtnClasses, "right-4"),
           onClick: handleNext,
           disabled: !navState.value.hasNext,
-          "aria-label": "Next image",
+          "aria-label": labels.value.nextImageAriaLabel,
           type: "button"
         },
         [svgIcon(nextIconPath)]
@@ -349,7 +362,7 @@ var ImagePreview = defineComponent({
           style: { zIndex: props.zIndex },
           role: "dialog",
           "aria-modal": "true",
-          "aria-label": "Image preview",
+          "aria-label": labels.value.previewDialogAriaLabel,
           onClick: handleMaskClick,
           onWheel: handleWheel
         },

package/dist/{chunk-GQAVLQEZ.mjs → chunk-X43QLJ5E.mjs}

@@ -1,6 +1,6 @@
 import {
   ImagePreview
-} from "./chunk-KY3O3FWK.mjs";
+} from "./chunk-WWB7VKKH.mjs";
 
 // src/components/ImageGroup.ts
 import { defineComponent, h, ref, provide, onBeforeUnmount } from "vue";

package/dist/{chunk-ULUH6UNV.js → chunk-X73BZFBH.js}

@@ -3,13 +3,13 @@
 var _chunk2VOZFFW6js = require('./chunk-2VOZFFW6.js');
 
 
-var _chunkACYYQJ6Mjs = require('./chunk-ACYYQJ6M.js');
+var _chunkKLOUOXNAjs = require('./chunk-KLOUOXNA.js');
 
 
 var _chunkHBFFINAIjs = require('./chunk-HBFFINAI.js');
 
 
-var _chunkZOUJFFG4js = require('./chunk-ZOUJFFG4.js');
+var _chunkAYQER5UDjs = require('./chunk-AYQER5UD.js');
 
 
 var _chunkUHVUKLHFjs = require('./chunk-UHVUKLHF.js');
@@ -204,7 +204,7 @@ var SunburstChart = _vue.defineComponent.call(void 0, {
           }
         }
       );
-      const tooltip = props.showTooltip && props.hoverable ? _vue.h.call(void 0, _chunkZOUJFFG4js.ChartTooltip, {
+      const tooltip = props.showTooltip && props.hoverable ? _vue.h.call(void 0, _chunkAYQER5UDjs.ChartTooltip, {
         content: tooltipContent.value,
         visible: resolvedHoveredIndex.value !== null && tooltipContent.value !== "",
         x: tooltipPosition.value.x,
@@ -215,7 +215,7 @@ var SunburstChart = _vue.defineComponent.call(void 0, {
       }
       return _vue.h.call(void 0, "div", { class: wrapperClasses.value }, [
         chart,
-        _vue.h.call(void 0, _chunkACYYQJ6Mjs.ChartLegend, {
+        _vue.h.call(void 0, _chunkKLOUOXNAjs.ChartLegend, {
           items: legendItems.value,
           position: props.legendPosition,
           markerSize: props.legendMarkerSize,

package/dist/{chunk-KA7DILCI.js → chunk-X7PQRYUS.js}

@@ -3,13 +3,13 @@
 var _chunk2VOZFFW6js = require('./chunk-2VOZFFW6.js');
 
 
-var _chunkACYYQJ6Mjs = require('./chunk-ACYYQJ6M.js');
+var _chunkKLOUOXNAjs = require('./chunk-KLOUOXNA.js');
 
 
 var _chunkHBFFINAIjs = require('./chunk-HBFFINAI.js');
 
 
-var _chunkZOUJFFG4js = require('./chunk-ZOUJFFG4.js');
+var _chunkAYQER5UDjs = require('./chunk-AYQER5UD.js');
 
 
 var _chunk5PXTMXXSjs = require('./chunk-5PXTMXXS.js');
@@ -249,12 +249,16 @@ var LineChart = _vue.defineComponent.call(void 0, {
     "point-hover"
   ],
   setup(props, { emit }) {
+    const instance = _vue.getCurrentInstance.call(void 0, );
     const hoveredPointInfo = _vue.ref.call(void 0, null);
     const tooltipPosition = _vue.ref.call(void 0, { x: 0, y: 0 });
     const gradientPrefix = _tigercatcore.getStableChartGradientPrefix.call(void 0, "line", _vue.useId.call(void 0, ));
     const innerRect = _vue.computed.call(void 0, () => _tigercatcore.getChartInnerRect.call(void 0, props.width, props.height, props.padding));
     const resolvedSeries = _vue.computed.call(void 0, 
-      () => _tigercatcore.resolveSeriesData.call(void 0, props.series, props.data)
+      () => _tigercatcore.resolveSeriesData.call(void 0, props.series, props.data, {
+        color: props.lineColor,
+        pointColor: props.pointColor
+      })
     );
     const {
       activeIndex,
@@ -376,12 +380,24 @@ var LineChart = _vue.defineComponent.call(void 0, {
       hoveredPointInfo.value = null;
       emit("point-hover", null, null, null);
     };
+    const showPointTooltipFromElement = (el, seriesIndex, pointIndex) => {
+      if (!props.hoverable) return;
+      const rect = el.getBoundingClientRect();
+      hoveredPointInfo.value = { seriesIndex, pointIndex };
+      tooltipPosition.value = { x: rect.left + rect.width / 2, y: rect.top + rect.height / 2 };
+      emit(
+        "point-hover",
+        seriesIndex,
+        pointIndex,
+        _optionalChain([resolvedSeries, 'access', _5 => _5.value, 'access', _6 => _6[seriesIndex], 'optionalAccess', _7 => _7.data, 'access', _8 => _8[pointIndex]])
+      );
+    };
     const handlePointClick = (seriesIndex, pointIndex) => {
       emit(
         "point-click",
         seriesIndex,
         pointIndex,
-        _optionalChain([resolvedSeries, 'access', _5 => _5.value, 'access', _6 => _6[seriesIndex], 'optionalAccess', _7 => _7.data, 'access', _8 => _8[pointIndex]])
+        _optionalChain([resolvedSeries, 'access', _9 => _9.value, 'access', _10 => _10[seriesIndex], 'optionalAccess', _11 => _11.data, 'access', _12 => _12[pointIndex]])
       );
       handleSeriesSelect(seriesIndex);
     };
@@ -392,6 +408,7 @@ var LineChart = _vue.defineComponent.call(void 0, {
       handleSeriesSelect(seriesIndex);
     };
     return () => {
+      const pointClickable = props.selectable || typeof _optionalChain([instance, 'optionalAccess', _13 => _13.vnode, 'access', _14 => _14.props, 'optionalAccess', _15 => _15.onPointClick]) === "function";
       const chart = _vue.h.call(void 0, 
         _chunkUHVUKLHFjs.ChartCanvas,
         {
@@ -585,8 +602,10 @@ var LineChart = _vue.defineComponent.call(void 0, {
                     }),
                     // Data points
                     sd.showPoints ? sd.points.map((point) => {
-                      const isHovered = _optionalChain([hoveredPointInfo, 'access', _9 => _9.value, 'optionalAccess', _10 => _10.seriesIndex]) === sd.seriesIndex && _optionalChain([hoveredPointInfo, 'access', _11 => _11.value, 'optionalAccess', _12 => _12.pointIndex]) === point.pointIndex;
+                      const isHovered = _optionalChain([hoveredPointInfo, 'access', _16 => _16.value, 'optionalAccess', _17 => _17.seriesIndex]) === sd.seriesIndex && _optionalChain([hoveredPointInfo, 'access', _18 => _18.value, 'optionalAccess', _19 => _19.pointIndex]) === point.pointIndex;
                       const hoverSize = sd.pointSize + 2;
+                      const datum = _optionalChain([resolvedSeries, 'access', _20 => _20.value, 'access', _21 => _21[sd.seriesIndex], 'optionalAccess', _22 => _22.data, 'optionalAccess', _23 => _23[point.pointIndex]]);
+                      const pointInteractive = props.hoverable || pointClickable;
                       return _vue.h.call(void 0, "circle", {
                         key: `point-${sd.seriesKey}-${point.pointIndex}`,
                         cx: point.x,
@@ -595,17 +614,46 @@ var LineChart = _vue.defineComponent.call(void 0, {
                         fill: sd.pointHollow ? "white" : props.pointGradient ? `url(#${gradientPrefix}-point-${sd.seriesKey})` : sd.pointColor,
                         stroke: sd.pointHollow ? sd.pointColor : "none",
                         "stroke-width": sd.pointHollow ? 2 : 0,
-                        class: _tigercatcore.linePointTransitionClasses,
+                        class: _tigercatcore.classNames.call(void 0, 
+                          _tigercatcore.linePointTransitionClasses,
+                          pointInteractive && "cursor-pointer"
+                        ),
                         style: isHovered ? `filter: drop-shadow(0 0 4px ${sd.color})` : void 0,
+                        role: pointInteractive ? "button" : "img",
+                        "aria-label": _nullishCoalesce(_optionalChain([datum, 'optionalAccess', _24 => _24.label]), () => ( String(_nullishCoalesce(_optionalChain([datum, 'optionalAccess', _25 => _25.y]), () => ( ""))))),
+                        tabindex: pointInteractive ? 0 : void 0,
                         "data-point-index": point.pointIndex,
                         "data-series-key": sd.seriesKey,
-                        onMouseenter: (e) => handlePointMouseEnter(sd.seriesIndex, point.pointIndex, e),
-                        onMousemove: handlePointMouseMove,
-                        onMouseleave: handlePointMouseLeave,
-                        onClick: (e) => {
+                        onMouseenter: props.hoverable ? (e) => handlePointMouseEnter(sd.seriesIndex, point.pointIndex, e) : void 0,
+                        onMousemove: props.hoverable ? handlePointMouseMove : void 0,
+                        onMouseleave: props.hoverable ? handlePointMouseLeave : void 0,
+                        onClick: pointClickable ? (e) => {
                           e.stopPropagation();
                           handlePointClick(sd.seriesIndex, point.pointIndex);
-                        }
+                        } : void 0,
+                        onFocus: props.hoverable ? (e) => showPointTooltipFromElement(
+                          e.currentTarget,
+                          sd.seriesIndex,
+                          point.pointIndex
+                        ) : void 0,
+                        onBlur: props.hoverable ? handlePointMouseLeave : void 0,
+                        onKeydown: pointInteractive ? (e) => {
+                          if (e.key === "Enter" || e.key === " ") {
+                            e.preventDefault();
+                            e.stopPropagation();
+                            if (pointClickable) {
+                              handlePointClick(sd.seriesIndex, point.pointIndex);
+                            } else {
+                              showPointTooltipFromElement(
+                                e.currentTarget,
+                                sd.seriesIndex,
+                                point.pointIndex
+                              );
+                            }
+                          } else if (e.key === "Escape" && props.hoverable) {
+                            handlePointMouseLeave();
+                          }
+                        } : void 0
                       });
                     }) : null
                   ]
@@ -615,7 +663,7 @@ var LineChart = _vue.defineComponent.call(void 0, {
           ].filter(Boolean)
         }
       );
-      const tooltip = props.showTooltip ? _vue.h.call(void 0, _chunkZOUJFFG4js.ChartTooltip, {
+      const tooltip = props.showTooltip ? _vue.h.call(void 0, _chunkAYQER5UDjs.ChartTooltip, {
         content: tooltipContent.value,
         visible: hoveredPointInfo.value !== null && tooltipContent.value !== "",
         x: tooltipPosition.value.x,
@@ -626,7 +674,7 @@ var LineChart = _vue.defineComponent.call(void 0, {
       }
       return _vue.h.call(void 0, "div", { class: wrapperClasses.value }, [
         chart,
-        _vue.h.call(void 0, _chunkACYYQJ6Mjs.ChartLegend, {
+        _vue.h.call(void 0, _chunkKLOUOXNAjs.ChartLegend, {
           items: legendItems.value,
           position: props.legendPosition,
           markerSize: props.legendMarkerSize,

package/dist/chunk-XFNHZ7SV.mjs

@@ -0,0 +1,142 @@
+// src/components/Segmented.ts
+import { defineComponent, h } from "vue";
+import {
+  getSegmentedContainerClasses,
+  getSegmentedContainerStyle,
+  getSegmentedIndicatorClasses,
+  getSegmentedIndicatorStyle,
+  getSegmentedOptionClasses,
+  classNames,
+  coerceClassValue,
+  mergeStyleValues
+} from "@expcat/tigercat-core";
+var Segmented = defineComponent({
+  name: "TigerSegmented",
+  inheritAttrs: false,
+  props: {
+    modelValue: {
+      type: [String, Number],
+      default: void 0
+    },
+    options: {
+      type: Array,
+      default: () => []
+    },
+    disabled: { type: Boolean, default: false },
+    size: { type: String, default: "md" },
+    block: { type: Boolean, default: false },
+    className: { type: String, default: void 0 }
+  },
+  emits: ["update:modelValue", "change"],
+  setup(props, { emit, attrs }) {
+    function handleSelect(option) {
+      if (option.disabled || props.disabled) return;
+      if (option.value === props.modelValue) return;
+      emit("update:modelValue", option.value);
+      emit("change", option.value);
+    }
+    function focusOption(container, index) {
+      const els = container?.querySelectorAll('[role="radio"]');
+      els?.[index]?.focus();
+    }
+    function handleKeydown(e, index) {
+      if (props.disabled) return;
+      const enabledIdxs = props.options.reduce((acc, opt, i) => {
+        if (!opt.disabled) acc.push(i);
+        return acc;
+      }, []);
+      if (enabledIdxs.length === 0) return;
+      if (e.key === "Enter" || e.key === " ") {
+        e.preventDefault();
+        handleSelect(props.options[index]);
+        return;
+      }
+      const pos = enabledIdxs.indexOf(index);
+      let target = null;
+      switch (e.key) {
+        case "ArrowRight":
+        case "ArrowDown":
+          target = enabledIdxs[(pos + 1 + enabledIdxs.length) % enabledIdxs.length];
+          break;
+        case "ArrowLeft":
+        case "ArrowUp":
+          target = enabledIdxs[(pos - 1 + enabledIdxs.length) % enabledIdxs.length];
+          break;
+        case "Home":
+          target = enabledIdxs[0];
+          break;
+        case "End":
+          target = enabledIdxs[enabledIdxs.length - 1];
+          break;
+        default:
+          return;
+      }
+      if (target == null) return;
+      e.preventDefault();
+      const container = e.currentTarget.closest('[role="radiogroup"]');
+      focusOption(container, target);
+      handleSelect(props.options[target]);
+    }
+    return () => {
+      const selectedIndex = props.options.findIndex((opt) => opt.value === props.modelValue);
+      const firstEnabledIndex = props.options.findIndex((opt) => !opt.disabled);
+      const rovingIndex = selectedIndex >= 0 ? selectedIndex : firstEnabledIndex;
+      return h(
+        "div",
+        {
+          ...attrs,
+          class: classNames(
+            getSegmentedContainerClasses(props.size, props.block),
+            props.className,
+            coerceClassValue(attrs.class)
+          ),
+          style: mergeStyleValues(
+            attrs.style,
+            getSegmentedContainerStyle(props.options.length)
+          ),
+          role: "radiogroup",
+          "aria-disabled": props.disabled || void 0
+        },
+        [
+          h("div", {
+            "data-tiger-segmented-indicator": "true",
+            "aria-hidden": "true",
+            class: getSegmentedIndicatorClasses(props.size),
+            style: getSegmentedIndicatorStyle(
+              props.options.findIndex((opt) => opt.value === props.modelValue),
+              props.options.length,
+              props.size
+            )
+          }),
+          ...props.options.map((opt, index) => {
+            const selected = opt.value === props.modelValue;
+            const isDisabled = !!opt.disabled || props.disabled;
+            return h(
+              "label",
+              {
+                key: opt.value,
+                class: classNames(
+                  getSegmentedOptionClasses(props.size, selected, isDisabled),
+                  props.block ? "flex-1 text-center" : ""
+                ),
+                role: "radio",
+                "aria-checked": selected,
+                "aria-disabled": isDisabled,
+                tabindex: isDisabled ? -1 : index === rovingIndex ? 0 : -1,
+                onClick: () => handleSelect(opt),
+                onKeydown: (e) => handleKeydown(e, index)
+              },
+              [h("span", null, opt.label)]
+            );
+          })
+        ]
+      );
+    };
+  }
+});
+var Segmented_default = Segmented;
+
+export {
+  Segmented,
+  Segmented_default
+};