@hunter-industries/hunter-components 0.0.99 → 0.0.101

package/dist/hunter-components.js

@@ -1,4 +1,4 @@
-import { openBlock, createElementBlock, createElementVNode, createStaticVNode, defineComponent, toRefs, computed, ref, createBlock, resolveDynamicComponent, mergeProps, createCommentVNode, normalizeClass, normalizeStyle, toDisplayString, renderSlot, unref, createVNode, createTextVNode, watchEffect, withDirectives, vShow, withCtx, vModelCheckbox, Fragment, renderList, watch, onBeforeUnmount, withModifiers, onMounted, vModelRadio, pushScopeId, popScopeId, vModelText, useCssVars } from "vue";
+import { createElementBlock, openBlock, createElementVNode, createStaticVNode, defineComponent, toRefs, computed, ref, createBlock, createCommentVNode, resolveDynamicComponent, mergeProps, normalizeStyle, normalizeClass, renderSlot, toDisplayString, unref, createVNode, createTextVNode, watchEffect, withDirectives, vShow, withCtx, vModelCheckbox, Fragment, renderList, watch, onBeforeUnmount, withModifiers, onMounted, vModelRadio, pushScopeId, popScopeId, vModelText, useCssVars } from "vue";
 const _hoisted_1$21 = {
   xmlns: "http://www.w3.org/2000/svg",
   fill: "currentColor",
@@ -1255,11 +1255,11 @@ const _hoisted_1$S = {
   fill: "none"
 };
 const _hoisted_2$O = /* @__PURE__ */ createStaticVNode('<circle cx="16" cy="16" r="15.625" fill="#fff" opacity=".8"></circle><path fill="#68aee0" d="M18.859 27.5v-23h6.64v23z"></path><path fill="#3A2F26" d="M20.756 27.501v-23h2.846v23z"></path><path fill="#68aee0" d="M20.76 19.91H2.5v-6.64h18.26z"></path><path fill="#3A2F26" d="M20.761 18.012H2.501v-2.846h18.26z"></path>', 5);
-const _hoisted_7$1 = [
+const _hoisted_7$2 = [
   _hoisted_2$O
 ];
 function render$C(_ctx, _cache) {
-  return openBlock(), createElementBlock("svg", _hoisted_1$S, [..._hoisted_7$1]);
+  return openBlock(), createElementBlock("svg", _hoisted_1$S, [..._hoisted_7$2]);
 }
 const __vite_glob_0_75 = { render: render$C };
 const _hoisted_1$R = {
@@ -1558,14 +1558,14 @@ const _hoisted_5$6 = /* @__PURE__ */ createElementVNode("path", {
   fill: "currentColor",
   d: "M31.108 20.67H41.4a3.16 3.16 0 0 0-1.54.643c-.47.367-.6.74-.792 1.297l-.011.031h-5.227c-.2-.573-.58-.952-1.06-1.324a3.14 3.14 0 0 0-1.66-.647"
 }, null, -1);
-const _hoisted_6$2 = [
+const _hoisted_6$3 = [
   _hoisted_2$z,
   _hoisted_3$w,
   _hoisted_4$a,
   _hoisted_5$6
 ];
 function render$n(_ctx, _cache) {
-  return openBlock(), createElementBlock("svg", _hoisted_1$D, [..._hoisted_6$2]);
+  return openBlock(), createElementBlock("svg", _hoisted_1$D, [..._hoisted_6$3]);
 }
 const __vite_glob_0_90 = { render: render$n };
 const _hoisted_1$C = {
@@ -2281,17 +2281,13 @@ const _sfc_main$m = /* @__PURE__ */ defineComponent({
     });
     const iconProps = computed(() => {
       const obj = {};
-      if (props.fill)
-        obj.fill = props.fill || "currentColor";
-      if (props.stroke)
-        obj.stroke = props.stroke;
-      if (props.strokeWidth)
-        obj.strokeWidth = props.strokeWidth.toString();
+      if (props.fill) obj.fill = props.fill || "currentColor";
+      if (props.stroke) obj.stroke = props.stroke;
+      if (props.strokeWidth) obj.strokeWidth = props.strokeWidth.toString();
       return obj;
     });
     const appendPxIfNeeded = (value) => {
-      if (value == null)
-        return void 0;
+      if (value == null) return void 0;
       const str = String(value);
       return /\d+(px|em|rem|%|vh|vw|ch|ex|cm|mm|in|pt|pc)$/i.test(str) ? str : `${str}px`;
     };
@@ -2301,8 +2297,7 @@ const _sfc_main$m = /* @__PURE__ */ defineComponent({
     const icon = computed(() => icons[props.name]);
     const iconClasses = computed(() => {
       const classes = [props.className].flat();
-      if (flipIcon.value)
-        classes.push(`hcl-flip-icon ${flipIcon.value}`);
+      if (flipIcon.value) classes.push(`hcl-flip-icon ${flipIcon.value}`);
       return classes;
     });
     __expose({ hunterIcon });
@@ -2332,18 +2327,15 @@ const unitRegex = /(ch|em|rem|ex|px|cm|mm|in|pt|pc|vh|vw|vmin|vmax|svh|lvh|dvh|s
 const keywordOrFuncRegex = /^(auto|min-content|max-content|fit-content\(.+\)|calc\(.+\)|clamp\(.+\)|min\(.+\)|max\(.+\)|var\(--[^)]+\))$/i;
 const convertValueToCssSizeProperty = (value) => {
   const w = value;
-  if (w == null || w === "")
-    return void 0;
+  if (w == null || w === "") return void 0;
   if (typeof w === "number" && Number.isFinite(w)) {
     return `${w}px`;
   }
   if (typeof w === "string") {
     const s = w.trim();
-    if (keywordOrFuncRegex.test(s) || unitRegex.test(s))
-      return s;
+    if (keywordOrFuncRegex.test(s) || unitRegex.test(s)) return s;
     const n = Number(s);
-    if (Number.isFinite(n))
-      return `${n}px`;
+    if (Number.isFinite(n)) return `${n}px`;
   }
   return void 0;
 };
@@ -2353,15 +2345,13 @@ const filterValuesContain = ({
   key,
   max
 }) => {
-  if (!query)
-    return;
+  if (!query) return;
   query = query == null ? void 0 : query.toLowerCase();
   let count = 0;
   return options.filter((match) => {
     const matchValue = match[key].toLowerCase();
     if (matchValue.includes(query)) {
-      if (!max)
-        return match;
+      if (!max) return match;
       else if (max && count <= max - 1) {
         count++;
         return match;
@@ -2635,9 +2625,9 @@ const _hoisted_3$8 = {
 };
 const _hoisted_4$7 = ["src", "alt"];
 const _hoisted_5$4 = { class: "hc__card__text" };
-const _hoisted_6$1 = { class: "hc__card__text__description" };
-const _hoisted_7 = { class: "card-description-body-wrapper" };
-const _hoisted_8 = { class: "description" };
+const _hoisted_6$2 = { class: "hc__card__text__description" };
+const _hoisted_7$1 = { class: "card-description-body-wrapper" };
+const _hoisted_8$1 = { class: "description" };
 const _hoisted_9 = {
   key: 0,
   class: "hc__card__buttons float2"
@@ -2702,12 +2692,12 @@ const _sfc_main$i = /* @__PURE__ */ defineComponent({
           }, null, 8, _hoisted_4$7))
         ]),
         createElementVNode("div", _hoisted_5$4, [
-          createElementVNode("div", _hoisted_6$1, [
+          createElementVNode("div", _hoisted_6$2, [
             createElementVNode("div", {
               class: normalizeClass(["hc__card__text__title", "uppercase"])
             }, toDisplayString(_ctx.title), 1),
-            createElementVNode("div", _hoisted_7, [
-              createElementVNode("div", _hoisted_8, [
+            createElementVNode("div", _hoisted_7$1, [
+              createElementVNode("div", _hoisted_8$1, [
                 !_ctx.hideToggleButton ? (openBlock(), createElementBlock("div", _hoisted_9, [
                   withDirectives(createVNode(unref(_sfc_main$l), {
                     variant: "icon-primary",
@@ -2772,8 +2762,7 @@ const _sfc_main$h = /* @__PURE__ */ defineComponent({
       return isActive.value;
     });
     const handleSetActive = () => {
-      if (props.keepActive === true)
-        return;
+      if (props.keepActive === true) return;
       isActive.value = !isActive.value;
       emit("updateIsActive", isActive.value, cardId.value);
     };
@@ -2911,8 +2900,7 @@ const _sfc_main$e = /* @__PURE__ */ defineComponent({
     );
     const resolvedMaxHeight = computed(() => props.listMaxHeight ?? 244);
     const scrollStyle = computed(() => {
-      if (!isScrollable.value)
-        return void 0;
+      if (!isScrollable.value) return void 0;
       return {
         maxHeight: `${resolvedMaxHeight.value}px`,
         overflowY: "auto"
@@ -2997,8 +2985,7 @@ const _sfc_main$d = /* @__PURE__ */ defineComponent({
           if (visibleOptions.value.length === 0) {
             isCollapsed.value = true;
             return isCollapsed.value;
-          } else
-            isCollapsed.value = false;
+          } else isCollapsed.value = false;
           return;
         } else {
           isCollapsed.value = true;
@@ -3496,7 +3483,7 @@ const _hoisted_5$2 = /* @__PURE__ */ _withScopeId(() => /* @__PURE__ */ createEl
   for: "metric",
   class: "unit-label"
 }, "Metric", -1));
-const _hoisted_6 = { class: "hunter-form-buttons" };
+const _hoisted_6$1 = { class: "hunter-form-buttons" };
 const _sfc_main$5 = /* @__PURE__ */ defineComponent({
   __name: "index",
   props: {
@@ -3695,7 +3682,7 @@ const _sfc_main$5 = /* @__PURE__ */ defineComponent({
             _hoisted_5$2
           ])
         ]),
-        createElementVNode("div", _hoisted_6, [
+        createElementVNode("div", _hoisted_6$1, [
           createVNode(_sfc_main$l, mergeProps(unref(cancelButtonProps), {
             variant: "tertiary",
             className: "form-button",
@@ -3761,8 +3748,7 @@ const _sfc_main$3 = /* @__PURE__ */ defineComponent({
     );
     const currentRoute = computed(() => props.activeLink);
     onMounted(() => {
-      if (!nuxtLinkContainer.value)
-        return;
+      if (!nuxtLinkContainer.value) return;
       nuxtLinks.value = nuxtLinkContainer == null ? void 0 : nuxtLinkContainer.value.querySelectorAll("a");
       nuxtLinks.value.forEach((el) => {
         var _a;
@@ -3771,8 +3757,7 @@ const _sfc_main$3 = /* @__PURE__ */ defineComponent({
       });
     });
     watch(currentRoute, () => {
-      if (!nuxtLinkContainer.value)
-        return;
+      if (!nuxtLinkContainer.value) return;
       nuxtLinks.value && nuxtLinks.value.forEach((el) => {
         var _a;
         const { pathname } = new URL(el.href);
@@ -4048,14 +4033,20 @@ const _sfc_main$1 = /* @__PURE__ */ defineComponent({
   }
 });
 const SearchInput = /* @__PURE__ */ _export_sfc(_sfc_main$1, [["__scopeId", "data-v-603385ac"]]);
-const _hoisted_1 = { class: "slider-container" };
-const _hoisted_2 = {
+const _hoisted_1 = { class: "slider-and-single-unit-container" };
+const _hoisted_2 = { class: "slider-with-descriptions" };
+const _hoisted_3 = { class: "slider-container" };
+const _hoisted_4 = {
   class: "ticks",
   "aria-hidden": "true"
 };
-const _hoisted_3 = { class: "flex flex-row justify-between items-center text-blue-900" };
-const _hoisted_4 = { class: "flex flex-col items-center" };
-const _hoisted_5 = { class: "font-medium" };
+const _hoisted_5 = { class: "text-under-slider" };
+const _hoisted_6 = { class: "text" };
+const _hoisted_7 = { class: "title" };
+const _hoisted_8 = {
+  key: 0,
+  class: "unit-text"
+};
 const _sfc_main = /* @__PURE__ */ defineComponent({
   __name: "Slider",
   props: {
@@ -4067,15 +4058,17 @@ const _sfc_main = /* @__PURE__ */ defineComponent({
     thumbColor: { default: "#00658a" },
     thumbSize: { default: "25px" },
     text: {},
-    tickEvery: { default: 2 }
+    tickEvery: { default: 2 },
+    showSelection: { type: Boolean, default: true },
+    unit: { default: '"' }
   },
   emits: ["change", "input"],
   setup(__props, { emit: __emit }) {
     useCssVars((_ctx) => ({
-      "0c14eab4": primaryColor,
-      "330a9dc2": secondaryColor,
-      "36b9fc20": thumbColor,
-      "756807a4": thumbSize
+      "32a6fe14": primaryColor,
+      "05354dbc": secondaryColor,
+      "e10d3100": thumbColor,
+      "49449f78": thumbSize
     }));
     const {
       min,
@@ -4085,7 +4078,9 @@ const _sfc_main = /* @__PURE__ */ defineComponent({
       secondaryColor,
       thumbColor,
       thumbSize,
-      tickEvery
+      tickEvery,
+      showSelection,
+      unit
     } = __props;
     const emit = __emit;
     const minN = computed(() => Number(min));
@@ -4098,8 +4093,7 @@ const _sfc_main = /* @__PURE__ */ defineComponent({
     );
     function calcValue(val) {
       const el = slider.value;
-      if (!el)
-        return;
+      if (!el) return;
       const hi = Number(el.max || maxN.value);
       const lo = Number(el.min || minN.value);
       const pct = (val - lo) / (hi - lo) * 100;
@@ -4107,57 +4101,59 @@ const _sfc_main = /* @__PURE__ */ defineComponent({
       emit("input", val);
     }
     onMounted(() => {
-      console.log("initial value", sliderValue.value);
       calcValue(sliderValue.value);
     });
     return (_ctx, _cache) => {
-      return openBlock(), createElementBlock(Fragment, null, [
-        createElementVNode("div", _hoisted_1, [
-          withDirectives(createElementVNode("input", {
-            type: "range",
-            min,
-            max,
-            "onUpdate:modelValue": _cache[0] || (_cache[0] = ($event) => sliderValue.value = $event),
-            class: "slider",
-            id: "range",
-            ref_key: "slider",
-            ref: slider,
-            onInput: _cache[1] || (_cache[1] = ($event) => calcValue(sliderValue.value)),
-            onChange: _cache[2] || (_cache[2] = ($event) => _ctx.$emit("change", sliderValue.value))
-          }, null, 544), [
-            [
-              vModelText,
-              sliderValue.value,
-              void 0,
-              { number: true }
-            ]
+      return openBlock(), createElementBlock("div", _hoisted_1, [
+        createElementVNode("div", _hoisted_2, [
+          createElementVNode("div", _hoisted_3, [
+            withDirectives(createElementVNode("input", {
+              type: "range",
+              min,
+              max,
+              "onUpdate:modelValue": _cache[0] || (_cache[0] = ($event) => sliderValue.value = $event),
+              class: "slider block w-full",
+              id: "range",
+              ref_key: "slider",
+              ref: slider,
+              onInput: _cache[1] || (_cache[1] = ($event) => calcValue(sliderValue.value)),
+              onChange: _cache[2] || (_cache[2] = ($event) => _ctx.$emit("change", sliderValue.value))
+            }, null, 544), [
+              [
+                vModelText,
+                sliderValue.value,
+                void 0,
+                { number: true }
+              ]
+            ]),
+            createElementVNode("div", _hoisted_4, [
+              (openBlock(true), createElementBlock(Fragment, null, renderList(tickCount.value, (i) => {
+                return openBlock(), createElementBlock("span", {
+                  key: i,
+                  class: normalizeClass(["tick", {
+                    hide: (i - 1) % tickEvery !== 0,
+                    passed: +min + (i - 1) < +sliderValue.value,
+                    active: +min + (i - 1) === +sliderValue.value
+                  }])
+                }, null, 2);
+              }), 128))
+            ])
           ]),
-          createElementVNode("div", _hoisted_2, [
-            (openBlock(true), createElementBlock(Fragment, null, renderList(tickCount.value, (i) => {
-              return openBlock(), createElementBlock("span", {
-                key: i,
-                class: normalizeClass(["tick", {
-                  hide: (i - 1) % tickEvery !== 0,
-                  passed: +min + (i - 1) < +sliderValue.value,
-                  active: +min + (i - 1) === +sliderValue.value
-                }])
-              }, null, 2);
-            }), 128))
+          createElementVNode("div", _hoisted_5, [
+            (openBlock(true), createElementBlock(Fragment, null, renderList(_ctx.text, (item, _) => {
+              return openBlock(), createElementBlock("div", _hoisted_6, [
+                createElementVNode("div", _hoisted_7, toDisplayString(item.title), 1),
+                createElementVNode("div", null, toDisplayString(item == null ? void 0 : item.description), 1)
+              ]);
+            }), 256))
           ])
         ]),
-        createElementVNode("div", _hoisted_3, [
-          (openBlock(true), createElementBlock(Fragment, null, renderList(_ctx.text, (item, _) => {
-            return openBlock(), createElementBlock("div", _hoisted_4, [
-              createElementVNode("div", _hoisted_5, toDisplayString(item.title), 1),
-              createElementVNode("div", null, toDisplayString(item == null ? void 0 : item.description), 1)
-            ]);
-          }), 256))
-        ])
-      ], 64);
+        showSelection ? (openBlock(), createElementBlock("div", _hoisted_8, toDisplayString(`${sliderValue.value}${unit}`), 1)) : createCommentVNode("", true)
+      ]);
     };
   }
 });
-const Slider = /* @__PURE__ */ _export_sfc(_sfc_main, [["__scopeId", "data-v-2707400e"]]);
+const Slider = /* @__PURE__ */ _export_sfc(_sfc_main, [["__scopeId", "data-v-b87d7551"]]);
 export {
   _sfc_main$l as HunterButton,
   ButtonIcon as HunterButtonIcon,