@expcat/tigercat-vue 1.1.0 → 1.2.0

package/dist/chunk-XH4ZZ6KJ.js

@@ -1,10 +1,38 @@
-'use strict';
+"use strict";Object.defineProperty(exports, "__esModule", {value: true}); function _nullishCoalesce(lhs, rhsFn) { if (lhs != null) { return lhs; } else { return rhsFn(); } } function _optionalChain(ops) { let lastAccessLHS = undefined; let value = ops[0]; let i = 1; while (i < ops.length) { const op = ops[i]; const fn = ops[i + 1]; i += 2; if ((op === 'optionalAccess' || op === 'optionalCall') && value == null) { return undefined; } if (op === 'access' || op === 'optionalAccess') { lastAccessLHS = value; value = fn(value); } else if (op === 'call' || op === 'optionalCall') { value = fn((...args) => value.call(lastAccessLHS, ...args)); lastAccessLHS = undefined; } } return value; }// src/components/Carousel.ts
 
-var vue = require('vue');
-var tigercatCore = require('@expcat/tigercat-core');
 
-// src/components/Carousel.ts
-var Carousel = vue.defineComponent({
+
+
+
+
+
+
+
+
+var _vue = require('vue');
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+var _tigercatcore = require('@expcat/tigercat-core');
+var Carousel = _vue.defineComponent.call(void 0, {
   name: "TigerCarousel",
   props: {
     /**
@@ -112,26 +140,26 @@ var Carousel = vue.defineComponent({
   },
   emits: ["change", "before-change"],
   setup(props, { slots, emit, attrs, expose }) {
-    const currentIndex = vue.ref(props.initialSlide);
-    const isPaused = vue.ref(false);
-    const slideCount = vue.ref(0);
-    const containerRef = vue.ref(null);
+    const currentIndex = _vue.ref.call(void 0, props.initialSlide);
+    const isPaused = _vue.ref.call(void 0, false);
+    const slideCount = _vue.ref.call(void 0, 0);
+    const containerRef = _vue.ref.call(void 0, null);
     let autoplayController = null;
     let touchStartPoint = null;
     let touchCurrentPoint = null;
-    const containerClasses = vue.computed(() => {
-      return tigercatCore.classNames(tigercatCore.getCarouselContainerClasses(props.className), tigercatCore.coerceClassValue(attrs.class));
+    const containerClasses = _vue.computed.call(void 0, () => {
+      return _tigercatcore.classNames.call(void 0, _tigercatcore.getCarouselContainerClasses.call(void 0, props.className), _tigercatcore.coerceClassValue.call(void 0, attrs.class));
     });
-    const trackClasses = vue.computed(() => {
+    const trackClasses = _vue.computed.call(void 0, () => {
       if (props.effect === "fade") {
-        return tigercatCore.carouselTrackFadeClasses;
+        return _tigercatcore.carouselTrackFadeClasses;
       }
-      return tigercatCore.carouselTrackScrollClasses;
+      return _tigercatcore.carouselTrackScrollClasses;
     });
-    const trackStyle = vue.computed(() => {
+    const trackStyle = _vue.computed.call(void 0, () => {
       if (props.effect === "scroll") {
         return {
-          transform: tigercatCore.getScrollTransform(currentIndex.value),
+          transform: _tigercatcore.getScrollTransform.call(void 0, currentIndex.value),
           transitionDuration: `${props.speed}ms`
         };
       }
@@ -141,34 +169,34 @@ var Carousel = vue.defineComponent({
       const isActive = index === currentIndex.value;
       if (props.effect === "fade") {
         const positionClass = index === 0 ? "relative" : "absolute inset-0";
-        return tigercatCore.classNames(
+        return _tigercatcore.classNames.call(void 0, 
           positionClass,
           "w-full transition-opacity ease-in-out",
           isActive ? "opacity-100 z-10" : "opacity-0 z-0"
         );
       }
-      return tigercatCore.carouselSlideBaseClasses;
+      return _tigercatcore.carouselSlideBaseClasses;
     };
-    const slideStyle = vue.computed(() => ({
+    const slideStyle = _vue.computed.call(void 0, () => ({
       transitionDuration: `${props.speed}ms`
     }));
-    const dotsClasses = vue.computed(() => {
-      return tigercatCore.getCarouselDotsClasses(props.dotPosition);
+    const dotsClasses = _vue.computed.call(void 0, () => {
+      return _tigercatcore.getCarouselDotsClasses.call(void 0, props.dotPosition);
     });
     const next = () => {
-      const nextIdx = tigercatCore.getNextSlideIndex(currentIndex.value, slideCount.value, props.infinite);
+      const nextIdx = _tigercatcore.getNextSlideIndex.call(void 0, currentIndex.value, slideCount.value, props.infinite);
       if (nextIdx !== currentIndex.value) {
         goTo(nextIdx);
       }
     };
     const prev = () => {
-      const prevIdx = tigercatCore.getPrevSlideIndex(currentIndex.value, slideCount.value, props.infinite);
+      const prevIdx = _tigercatcore.getPrevSlideIndex.call(void 0, currentIndex.value, slideCount.value, props.infinite);
       if (prevIdx !== currentIndex.value) {
         goTo(prevIdx);
       }
     };
     const goTo = (index) => {
-      const clampedIndex = tigercatCore.clampSlideIndex(index, slideCount.value);
+      const clampedIndex = _tigercatcore.clampSlideIndex.call(void 0, index, slideCount.value);
       if (clampedIndex === currentIndex.value) {
         return;
       }
@@ -179,14 +207,14 @@ var Carousel = vue.defineComponent({
     };
     const startAutoplay = () => {
       if (!props.autoplay || isPaused.value || autoplayController) return;
-      autoplayController = tigercatCore.createCarouselAutoplayController({
+      autoplayController = _tigercatcore.createCarouselAutoplayController.call(void 0, {
         interval: props.autoplaySpeed,
         onAdvance: next
       });
       autoplayController.start();
     };
     const stopAutoplay = () => {
-      autoplayController?.stop();
+      _optionalChain([autoplayController, 'optionalAccess', _2 => _2.stop, 'call', _3 => _3()]);
       autoplayController = null;
     };
     const syncAutoplay = () => {
@@ -198,21 +226,21 @@ var Carousel = vue.defineComponent({
       touchCurrentPoint = null;
     };
     const handleTouchStart = (event) => {
-      const point = tigercatCore.getCarouselTouchPoint(event.touches);
+      const point = _tigercatcore.getCarouselTouchPoint.call(void 0, event.touches);
       touchStartPoint = point;
       touchCurrentPoint = point;
     };
     const handleTouchMove = (event) => {
       if (!touchStartPoint) return;
-      const point = tigercatCore.getCarouselTouchPoint(event.touches);
+      const point = _tigercatcore.getCarouselTouchPoint.call(void 0, event.touches);
       if (point) {
         touchCurrentPoint = point;
       }
     };
     const handleTouchEnd = (event) => {
-      const direction = tigercatCore.resolveCarouselSwipeDirection(
+      const direction = _tigercatcore.resolveCarouselSwipeDirection.call(void 0, 
         touchStartPoint,
-        tigercatCore.getCarouselTouchPoint(event.changedTouches) ?? touchCurrentPoint
+        _nullishCoalesce(_tigercatcore.getCarouselTouchPoint.call(void 0, event.changedTouches), () => ( touchCurrentPoint))
       );
       resetTouchGesture();
       if (direction === "next") {
@@ -244,29 +272,29 @@ var Carousel = vue.defineComponent({
         isPaused.value = false;
       }
     };
-    const isPrevArrowDisabled = vue.computed(
-      () => tigercatCore.isPrevDisabled(currentIndex.value, slideCount.value, props.infinite)
+    const isPrevArrowDisabled = _vue.computed.call(void 0, 
+      () => _tigercatcore.isPrevDisabled.call(void 0, currentIndex.value, slideCount.value, props.infinite)
     );
-    const isNextArrowDisabled = vue.computed(
-      () => tigercatCore.isNextDisabled(currentIndex.value, slideCount.value, props.infinite)
+    const isNextArrowDisabled = _vue.computed.call(void 0, 
+      () => _tigercatcore.isNextDisabled.call(void 0, currentIndex.value, slideCount.value, props.infinite)
     );
-    vue.watch([() => props.autoplay, () => props.autoplaySpeed, isPaused], syncAutoplay);
-    vue.onMounted(() => {
+    _vue.watch.call(void 0, [() => props.autoplay, () => props.autoplaySpeed, isPaused], syncAutoplay);
+    _vue.onMounted.call(void 0, () => {
       if (props.autoplay) {
         startAutoplay();
       }
-      containerRef.value?.addEventListener("touchstart", handleTouchStart, { passive: true });
-      containerRef.value?.addEventListener("touchmove", handleTouchMove, { passive: true });
-      containerRef.value?.addEventListener("touchend", handleTouchEnd, { passive: true });
-      containerRef.value?.addEventListener("touchcancel", handleTouchCancel, { passive: true });
+      _optionalChain([containerRef, 'access', _4 => _4.value, 'optionalAccess', _5 => _5.addEventListener, 'call', _6 => _6("touchstart", handleTouchStart, { passive: true })]);
+      _optionalChain([containerRef, 'access', _7 => _7.value, 'optionalAccess', _8 => _8.addEventListener, 'call', _9 => _9("touchmove", handleTouchMove, { passive: true })]);
+      _optionalChain([containerRef, 'access', _10 => _10.value, 'optionalAccess', _11 => _11.addEventListener, 'call', _12 => _12("touchend", handleTouchEnd, { passive: true })]);
+      _optionalChain([containerRef, 'access', _13 => _13.value, 'optionalAccess', _14 => _14.addEventListener, 'call', _15 => _15("touchcancel", handleTouchCancel, { passive: true })]);
     });
-    vue.onUnmounted(() => {
+    _vue.onUnmounted.call(void 0, () => {
       stopAutoplay();
       resetTouchGesture();
-      containerRef.value?.removeEventListener("touchstart", handleTouchStart);
-      containerRef.value?.removeEventListener("touchmove", handleTouchMove);
-      containerRef.value?.removeEventListener("touchend", handleTouchEnd);
-      containerRef.value?.removeEventListener("touchcancel", handleTouchCancel);
+      _optionalChain([containerRef, 'access', _16 => _16.value, 'optionalAccess', _17 => _17.removeEventListener, 'call', _18 => _18("touchstart", handleTouchStart)]);
+      _optionalChain([containerRef, 'access', _19 => _19.value, 'optionalAccess', _20 => _20.removeEventListener, 'call', _21 => _21("touchmove", handleTouchMove)]);
+      _optionalChain([containerRef, 'access', _22 => _22.value, 'optionalAccess', _23 => _23.removeEventListener, 'call', _24 => _24("touchend", handleTouchEnd)]);
+      _optionalChain([containerRef, 'access', _25 => _25.value, 'optionalAccess', _26 => _26.removeEventListener, 'call', _27 => _27("touchcancel", handleTouchCancel)]);
     });
     expose({
       next,
@@ -274,27 +302,27 @@ var Carousel = vue.defineComponent({
       goTo
     });
     return () => {
-      const defaultSlot = slots.default?.() || [];
+      const defaultSlot = _optionalChain([slots, 'access', _28 => _28.default, 'optionalCall', _29 => _29()]) || [];
       const flattenSlots = (nodes) => {
         return nodes.flatMap((node) => {
-          if (node.type === vue.Fragment && Array.isArray(node.children)) {
+          if (node.type === _vue.Fragment && Array.isArray(node.children)) {
             return flattenSlots(node.children);
           }
           return node;
         });
       };
-      const slides = flattenSlots(defaultSlot).filter((child) => child.type !== vue.Comment);
+      const slides = flattenSlots(defaultSlot).filter((child) => child.type !== _vue.Comment);
       slideCount.value = slides.length;
-      const renderArrowButton = (type, disabled, onClick, path) => vue.h(
+      const renderArrowButton = (type, disabled, onClick, path) => _vue.h.call(void 0, 
         "button",
         {
           type: "button",
-          class: tigercatCore.getCarouselArrowClasses(type, disabled),
+          class: _tigercatcore.getCarouselArrowClasses.call(void 0, type, disabled),
           onClick,
           disabled,
           "aria-label": type === "prev" ? "Previous slide" : "Next slide"
         },
-        vue.h(
+        _vue.h.call(void 0, 
           "svg",
           {
             xmlns: "http://www.w3.org/2000/svg",
@@ -306,29 +334,29 @@ var Carousel = vue.defineComponent({
             "stroke-linejoin": "round",
             class: "w-6 h-6"
           },
-          vue.h("path", { d: path })
+          _vue.h.call(void 0, "path", { d: path })
         )
       );
       const renderArrows = () => {
         if (!props.arrows) return null;
         return [
-          renderArrowButton("prev", isPrevArrowDisabled.value, prev, tigercatCore.carouselPrevArrowPath),
-          renderArrowButton("next", isNextArrowDisabled.value, next, tigercatCore.carouselNextArrowPath)
+          renderArrowButton("prev", isPrevArrowDisabled.value, prev, _tigercatcore.carouselPrevArrowPath),
+          renderArrowButton("next", isNextArrowDisabled.value, next, _tigercatcore.carouselNextArrowPath)
         ];
       };
       const renderDots = () => {
         if (!props.dots || slides.length <= 1) return null;
         const dots = slides.map(
-          (_, index) => vue.h("button", {
+          (_, index) => _vue.h.call(void 0, "button", {
             type: "button",
             key: index,
-            class: tigercatCore.getCarouselDotClasses(index === currentIndex.value),
+            class: _tigercatcore.getCarouselDotClasses.call(void 0, index === currentIndex.value),
             onClick: () => goTo(index),
             "aria-label": `Go to slide ${index + 1}`,
             "aria-current": index === currentIndex.value ? "true" : "false"
           })
         );
-        return vue.h(
+        return _vue.h.call(void 0, 
           "div",
           {
             class: dotsClasses.value,
@@ -340,7 +368,7 @@ var Carousel = vue.defineComponent({
       };
       const renderSlides = () => {
         const slideElements = slides.map(
-          (slide, index) => vue.h(
+          (slide, index) => _vue.h.call(void 0, 
             "div",
             {
               key: index,
@@ -355,15 +383,15 @@ var Carousel = vue.defineComponent({
           )
         );
         if (props.effect === "fade") {
-          return vue.h(
+          return _vue.h.call(void 0, 
             "div",
             {
-              class: tigercatCore.classNames(trackClasses.value, "h-full")
+              class: _tigercatcore.classNames.call(void 0, trackClasses.value, "h-full")
             },
             slideElements
           );
         }
-        return vue.h(
+        return _vue.h.call(void 0, 
           "div",
           {
             class: trackClasses.value,
@@ -372,7 +400,7 @@ var Carousel = vue.defineComponent({
           slideElements
         );
       };
-      return vue.h(
+      return _vue.h.call(void 0, 
         "div",
         {
           ref: containerRef,
@@ -393,5 +421,7 @@ var Carousel = vue.defineComponent({
 });
 var Carousel_default = Carousel;
 
-exports.Carousel = Carousel;
-exports.Carousel_default = Carousel_default;
+
+
+
+exports.Carousel = Carousel; exports.Carousel_default = Carousel_default;

package/dist/chunk-XJXGVNNF.js

@@ -1,10 +1,16 @@
-'use strict';
+"use strict";Object.defineProperty(exports, "__esModule", {value: true}); function _nullishCoalesce(lhs, rhsFn) { if (lhs != null) { return lhs; } else { return rhsFn(); } } function _optionalChain(ops) { let lastAccessLHS = undefined; let value = ops[0]; let i = 1; while (i < ops.length) { const op = ops[i]; const fn = ops[i + 1]; i += 2; if ((op === 'optionalAccess' || op === 'optionalCall') && value == null) { return undefined; } if (op === 'access' || op === 'optionalAccess') { lastAccessLHS = value; value = fn(value); } else if (op === 'call' || op === 'optionalCall') { value = fn((...args) => value.call(lastAccessLHS, ...args)); lastAccessLHS = undefined; } } return value; }// src/components/InfiniteScroll.ts
+var _vue = require('vue');
 
-var vue = require('vue');
-var tigercatCore = require('@expcat/tigercat-core');
 
-// src/components/InfiniteScroll.ts
-var InfiniteScroll = vue.defineComponent({
+
+
+
+
+
+
+
+var _tigercatcore = require('@expcat/tigercat-core');
+var InfiniteScroll = _vue.defineComponent.call(void 0, {
   name: "TigerInfiniteScroll",
   inheritAttrs: false,
   props: {
@@ -23,13 +29,14 @@ var InfiniteScroll = vue.defineComponent({
   },
   emits: ["load-more"],
   setup(props, { emit, slots, attrs }) {
-    const containerRef = vue.ref(null);
-    const sentinelRef = vue.ref(null);
+    const containerRef = _vue.ref.call(void 0, null);
+    const sentinelRef = _vue.ref.call(void 0, null);
     let cleanupObserver = null;
-    const containerClasses = vue.computed(
-      () => tigercatCore.classNames(
-        tigercatCore.getInfiniteScrollContainerClasses(props.direction, props.className),
-        tigercatCore.coerceClassValue(attrs.class)
+    let _usingFallback = false;
+    const containerClasses = _vue.computed.call(void 0, 
+      () => _tigercatcore.classNames.call(void 0, 
+        _tigercatcore.getInfiniteScrollContainerClasses.call(void 0, props.direction, props.className),
+        _tigercatcore.coerceClassValue.call(void 0, attrs.class)
       )
     );
     function handleLoadMore() {
@@ -40,17 +47,18 @@ var InfiniteScroll = vue.defineComponent({
       if (props.disabled || props.loading || !props.hasMore) return;
       const el = containerRef.value;
       if (!el) return;
-      if (tigercatCore.shouldLoadMore(el, props.threshold, props.direction, props.inverse)) {
+      if (_tigercatcore.shouldLoadMore.call(void 0, el, props.threshold, props.direction, props.inverse)) {
         emit("load-more");
       }
     }
     function setupObserver() {
-      cleanupObserver?.();
+      _optionalChain([cleanupObserver, 'optionalCall', _ => _()]);
       cleanupObserver = null;
+      _usingFallback = false;
       if (props.disabled || !props.hasMore) return;
       const sentinel = sentinelRef.value;
       if (!sentinel) return;
-      const teardown = tigercatCore.createInfiniteScrollObserver(sentinel, {
+      const teardown = _tigercatcore.createInfiniteScrollObserver.call(void 0, sentinel, {
         threshold: props.threshold,
         direction: props.direction,
         root: containerRef.value,
@@ -59,40 +67,41 @@ var InfiniteScroll = vue.defineComponent({
       if (teardown) {
         cleanupObserver = teardown;
       } else {
-        containerRef.value?.addEventListener("scroll", checkScroll, { passive: true });
+        _usingFallback = true;
+        _optionalChain([containerRef, 'access', _2 => _2.value, 'optionalAccess', _3 => _3.addEventListener, 'call', _4 => _4("scroll", checkScroll, { passive: true })]);
         cleanupObserver = () => {
-          containerRef.value?.removeEventListener("scroll", checkScroll);
+          _optionalChain([containerRef, 'access', _5 => _5.value, 'optionalAccess', _6 => _6.removeEventListener, 'call', _7 => _7("scroll", checkScroll)]);
         };
       }
     }
-    vue.onMounted(setupObserver);
-    vue.watch(
+    _vue.onMounted.call(void 0, setupObserver);
+    _vue.watch.call(void 0, 
       () => [props.hasMore, props.disabled, props.threshold, props.direction, props.inverse],
       setupObserver
     );
-    vue.onBeforeUnmount(() => {
-      cleanupObserver?.();
+    _vue.onBeforeUnmount.call(void 0, () => {
+      _optionalChain([cleanupObserver, 'optionalCall', _8 => _8()]);
     });
     return () => {
-      const content = slots.default?.();
-      const sentinel = props.hasMore ? vue.h("div", {
+      const content = _optionalChain([slots, 'access', _9 => _9.default, 'optionalCall', _10 => _10()]);
+      const sentinel = props.hasMore ? _vue.h.call(void 0, "div", {
         ref: sentinelRef,
-        class: tigercatCore.infiniteScrollSentinelClasses,
+        class: _tigercatcore.infiniteScrollSentinelClasses,
         "aria-hidden": "true",
         style: "height:0;overflow:hidden"
       }) : null;
-      const loader = props.loading ? vue.h(
+      const loader = props.loading ? _vue.h.call(void 0, 
         "div",
         {
-          class: tigercatCore.infiniteScrollLoaderClasses,
+          class: _tigercatcore.infiniteScrollLoaderClasses,
           role: "status",
           "aria-live": "polite"
         },
-        slots.loader?.() ?? props.loadingText
+        _nullishCoalesce(_optionalChain([slots, 'access', _11 => _11.loader, 'optionalCall', _12 => _12()]), () => ( props.loadingText))
       ) : null;
-      const end = !props.hasMore && !props.loading ? vue.h("div", { class: tigercatCore.infiniteScrollEndClasses }, slots.end?.() ?? props.endText) : null;
+      const end = !props.hasMore && !props.loading ? _vue.h.call(void 0, "div", { class: _tigercatcore.infiniteScrollEndClasses }, _nullishCoalesce(_optionalChain([slots, 'access', _13 => _13.end, 'optionalCall', _14 => _14()]), () => ( props.endText))) : null;
       const children = props.inverse ? [sentinel, loader, content, end] : [content, sentinel, loader, end];
-      return vue.h(
+      return _vue.h.call(void 0, 
         "div",
         {
           ref: containerRef,
@@ -105,5 +114,7 @@ var InfiniteScroll = vue.defineComponent({
 });
 var InfiniteScroll_default = InfiniteScroll;
 
-exports.InfiniteScroll = InfiniteScroll;
-exports.InfiniteScroll_default = InfiniteScroll_default;
+
+
+
+exports.InfiniteScroll = InfiniteScroll; exports.InfiniteScroll_default = InfiniteScroll_default;

package/dist/chunk-XSMDZOBF.js

@@ -0,0 +1,154 @@
+"use strict";Object.defineProperty(exports, "__esModule", {value: true}); function _nullishCoalesce(lhs, rhsFn) { if (lhs != null) { return lhs; } else { return rhsFn(); } } function _optionalChain(ops) { let lastAccessLHS = undefined; let value = ops[0]; let i = 1; while (i < ops.length) { const op = ops[i]; const fn = ops[i + 1]; i += 2; if ((op === 'optionalAccess' || op === 'optionalCall') && value == null) { return undefined; } if (op === 'access' || op === 'optionalAccess') { lastAccessLHS = value; value = fn(value); } else if (op === 'call' || op === 'optionalCall') { value = fn((...args) => value.call(lastAccessLHS, ...args)); lastAccessLHS = undefined; } } return value; }// src/components/ColorSwatch.ts
+var _vue = require('vue');
+
+
+
+
+
+
+
+
+
+
+
+
+
+var _tigercatcore = require('@expcat/tigercat-core');
+var checkPathD = "M5 10.5 8 13.5 15 6.5";
+var ColorSwatch = _vue.defineComponent.call(void 0, {
+  name: "TigerColorSwatch",
+  props: {
+    modelValue: { type: String, default: void 0 },
+    disabled: { type: Boolean, default: false },
+    size: { type: String, default: "md" },
+    colors: { type: Array, default: void 0 },
+    groups: { type: Array, default: void 0 },
+    columns: { type: Number, default: 6 },
+    ariaLabel: { type: String, default: "Color swatches" }
+  },
+  emits: ["update:modelValue", "change"],
+  setup(props, { attrs, emit }) {
+    const focusIndex = _vue.ref.call(void 0, -1);
+    const optionRefs = _vue.ref.call(void 0, []);
+    const normalizedGroups = _vue.computed.call(void 0, () => _tigercatcore.normalizeColorSwatchGroups.call(void 0, props.groups, props.colors));
+    const options = _vue.computed.call(void 0, () => _tigercatcore.flattenColorSwatchGroups.call(void 0, normalizedGroups.value));
+    const selectedIndex = _vue.computed.call(void 0, 
+      () => options.value.findIndex((option) => _tigercatcore.isColorSwatchSelected.call(void 0, option.value, props.modelValue))
+    );
+    const firstEnabledIndex = _vue.computed.call(void 0, () => options.value.findIndex((option) => !option.disabled));
+    const activeIndex = _vue.computed.call(void 0, 
+      () => selectedIndex.value >= 0 ? selectedIndex.value : firstEnabledIndex.value
+    );
+    function handleSelect(option) {
+      if (props.disabled || option.disabled) return;
+      emit("update:modelValue", option.value);
+      emit("change", option.value, option);
+    }
+    function handleKeydown(optionIndex, event) {
+      if (props.disabled) return;
+      if (event.key === "Enter" || event.key === " ") {
+        event.preventDefault();
+        const option = options.value[optionIndex];
+        if (option) handleSelect(option);
+        return;
+      }
+      const nextIndex = _tigercatcore.getNextColorSwatchIndex.call(void 0, 
+        options.value,
+        optionIndex,
+        event.key,
+        props.columns
+      );
+      if (nextIndex === -1 || nextIndex === optionIndex) return;
+      event.preventDefault();
+      focusIndex.value = nextIndex;
+      _vue.nextTick.call(void 0, () => _optionalChain([optionRefs, 'access', _ => _.value, 'access', _2 => _2[nextIndex], 'optionalAccess', _3 => _3.focus, 'call', _4 => _4()]));
+    }
+    return () => {
+      let flatIndex = 0;
+      optionRefs.value = [];
+      return _vue.h.call(void 0, 
+        "div",
+        {
+          class: _tigercatcore.classNames.call(void 0, _tigercatcore.colorSwatchBaseClasses, _tigercatcore.coerceClassValue.call(void 0, attrs.class)),
+          role: "radiogroup",
+          "aria-label": props.ariaLabel,
+          "aria-disabled": props.disabled || void 0
+        },
+        normalizedGroups.value.map(
+          (group, groupIndex) => _vue.h.call(void 0, 
+            "div",
+            { key: `${groupIndex}-${_nullishCoalesce(group.label, () => ( "group"))}`, class: _tigercatcore.colorSwatchGroupClasses },
+            [
+              group.label ? _vue.h.call(void 0, "div", { class: _tigercatcore.colorSwatchGroupLabelClasses }, group.label) : null,
+              _vue.h.call(void 0, 
+                "div",
+                {
+                  class: _tigercatcore.colorSwatchGridClasses,
+                  style: { gridTemplateColumns: `repeat(${props.columns}, minmax(0, 1fr))` }
+                },
+                group.colors.map((option) => {
+                  const optionIndex = flatIndex;
+                  flatIndex += 1;
+                  const selected = _tigercatcore.isColorSwatchSelected.call(void 0, option.value, props.modelValue);
+                  const optionDisabled = props.disabled || !!option.disabled;
+                  const tabIndex = !optionDisabled && optionIndex === (focusIndex.value >= 0 ? focusIndex.value : activeIndex.value) ? 0 : -1;
+                  return _vue.h.call(void 0, 
+                    "button",
+                    {
+                      key: `${option.groupIndex}-${option.index}-${option.value}`,
+                      ref: ((el) => {
+                        if (el instanceof HTMLElement) optionRefs.value[optionIndex] = el;
+                      }),
+                      type: "button",
+                      class: _tigercatcore.getColorSwatchButtonClasses.call(void 0, props.size, selected, optionDisabled),
+                      style: { backgroundColor: option.value },
+                      role: "radio",
+                      "aria-checked": selected,
+                      "aria-label": option.label,
+                      "aria-disabled": optionDisabled || void 0,
+                      tabindex: tabIndex,
+                      onFocus: () => {
+                        focusIndex.value = optionIndex;
+                      },
+                      onClick: () => handleSelect(option),
+                      onKeydown: (event) => handleKeydown(optionIndex, event)
+                    },
+                    selected ? _vue.h.call(void 0, 
+                      "span",
+                      { class: _tigercatcore.getColorSwatchCheckClasses.call(void 0, props.size), "aria-hidden": "true" },
+                      [
+                        _vue.h.call(void 0, 
+                          "svg",
+                          {
+                            viewBox: "0 0 20 20",
+                            fill: "none",
+                            stroke: "currentColor",
+                            strokeWidth: "2.5",
+                            class: "h-full w-full"
+                          },
+                          [
+                            _vue.h.call(void 0, "path", {
+                              d: checkPathD,
+                              strokeLinecap: "round",
+                              strokeLinejoin: "round"
+                            })
+                          ]
+                        )
+                      ]
+                    ) : void 0
+                  );
+                })
+              )
+            ]
+          )
+        )
+      );
+    };
+  }
+});
+var ColorSwatch_default = ColorSwatch;
+
+
+
+
+exports.ColorSwatch = ColorSwatch; exports.ColorSwatch_default = ColorSwatch_default;