@leaflink/stash 49.5.0 → 50.0.0

package/dist/Accordion.js

@@ -1,10 +1,7 @@
-import { defineComponent as v, useSlots as x, useCssModule as y, ref as E, watch as b, openBlock as c, createElementBlock as i, createElementVNode as s, normalizeClass as m, unref as l, withKeys as h, withModifiers as k, renderSlot as w, Fragment as C, createVNode as r, toDisplayString as M, withDirectives as S, vShow as $, withCtx as z } from "vue";
-import { _ as B } from "./Expand.vue_vue_type_script_setup_true_lang-0f236267.js";
-import _ from "./Icon.js";
-import { _ as K } from "./_plugin-vue_export-helper-dad06003.js";
-import "lodash-es/uniqueId";
-import "./index-9e1095ef.js";
-import "./Icon.vue_used_vue_type_style_index_0_lang.module-eb359559.js";
+import { defineComponent as v, useSlots as x, useCssModule as y, ref as E, watch as b, openBlock as c, createElementBlock as i, createElementVNode as o, normalizeClass as h, unref as l, withKeys as w, withModifiers as k, renderSlot as _, Fragment as C, createVNode as d, toDisplayString as M, withDirectives as S, vShow as $, withCtx as z } from "vue";
+import { _ as B } from "./Expand.vue_vue_type_script_setup_true_lang-D0fSAtHr.js";
+import m from "./Icon.js";
+import { _ as K } from "./_plugin-vue_export-helper-CHgC5LLL.js";
 const A = {
   class: "stash-accordion tw-rounded tw-border tw-border-ice-500 tw-bg-white",
   "data-test": "stash-accordion"
@@ -20,14 +17,14 @@ const A = {
   },
   emits: ["toggle", "open", "close"],
   setup(g, { emit: f }) {
-    const t = g, d = x(), n = f, p = y();
-    if (!t.title && !d.header)
+    const t = g, r = x(), n = f, p = y();
+    if (!t.title && !r.header)
       throw new Error("Either a title prop or header slot must be provided");
     const e = E(t.isExpanded);
     b(
       () => t.isExpanded,
-      (o) => {
-        e.value = o, u();
+      (s) => {
+        e.value = s, u();
       }
     );
     const a = () => {
@@ -36,42 +33,42 @@ const A = {
     function u() {
       n("toggle", { isExpanded: e.value }), e.value ? n("open") : n("close");
     }
-    return (o, J) => (c(), i("div", A, [
-      s("div", {
+    return (s, J) => (c(), i("div", A, [
+      o("div", {
         tabindex: "0",
         "data-test": "stash-accordion|toggle",
-        class: m(["stash-accordion__toggle tw-flex tw-items-center", [l(p).toggle, e.value && l(p)["toggle--open"]]]),
+        class: h(["stash-accordion__toggle tw-flex tw-items-center", [l(p).toggle, e.value && l(p)["toggle--open"]]]),
         onClick: a,
         onKeypress: [
-          h(a, ["enter"]),
-          h(k(a, ["prevent"]), ["space"])
+          w(a, ["enter"]),
+          w(k(a, ["prevent"]), ["space"])
         ]
       }, [
-        l(d).header ? (c(), i("div", I, [
-          w(o.$slots, "header")
+        l(r).header ? (c(), i("div", I, [
+          _(s.$slots, "header")
         ])) : (c(), i(C, { key: 1 }, [
-          r(_, {
+          d(m, {
             class: "tw-text-blue-500",
             size: "dense",
             name: t.icon,
             "data-test": "stash-accordion|toggle-icon"
           }, null, 8, ["name"]),
-          s("div", N, M(t.title), 1)
+          o("div", N, M(t.title), 1)
         ], 64)),
-        r(_, {
-          class: m(["tw-ml-auto tw-justify-center tw-text-ice-900 tw-transition-transform tw-duration-300", { "tw-rotate-180": e.value }]),
+        d(m, {
+          class: h(["tw-ml-auto tw-justify-center tw-text-ice-900 tw-transition-transform tw-duration-300", { "tw-rotate-180": e.value }]),
           size: "dense",
           name: "chevron-down",
           "data-test": "stash-accordion|toggle-chevron"
         }, null, 8, ["class"])
       ], 42, D),
-      S(s("hr", V, null, 512), [
+      S(o("hr", V, null, 512), [
         [$, e.value]
       ]),
-      r(B, { "is-expanded": e.value }, {
+      d(B, { "is-expanded": e.value }, {
         default: z(() => [
-          s("div", j, [
-            w(o.$slots, "default")
+          o("div", j, [
+            _(s.$slots, "default")
           ])
         ]),
         _: 3
@@ -82,8 +79,8 @@ const A = {
   toggle: q
 }, H = {
   $style: G
-}, W = /* @__PURE__ */ K(F, [["__cssModules", H]]);
+}, R = /* @__PURE__ */ K(F, [["__cssModules", H]]);
 export {
-  W as default
+  R as default
 };
 //# sourceMappingURL=Accordion.js.map

package/dist/Accordion.js.map

@@ -1 +1 @@
-{"version":3,"file":"Accordion.js","sources":["../src/components/Accordion/Accordion.vue"],"sourcesContent":["<script setup lang=\"ts\">\n  import { ref, useCssModule, useSlots, watch } from 'vue';\n\n  import Expand from '../Expand/Expand.vue';\n  import { IconName } from '../Icon/Icon.types';\n  import Icon from '../Icon/Icon.vue';\n\n  export interface AccordionProps {\n    /**\n     * The filename of the icon that will be displayed on the left side of the header\n     */\n    icon?: IconName;\n\n    /**\n     * Title of the Accordion, displayed in the header\n     */\n    title?: string;\n\n    /**\n     * Whether the Accordion is expanded or not\n     */\n    isExpanded?: boolean;\n  }\n\n  type ToggleState = {\n    isExpanded: boolean;\n  };\n\n  const props = withDefaults(defineProps<AccordionProps>(), {\n    icon: 'circle-info',\n    title: undefined,\n    isExpanded: false,\n  });\n  const slots = useSlots();\n\n  const emits = defineEmits<{\n    (e: 'toggle', state: ToggleState): void;\n    (e: 'open'): void;\n    (e: 'close'): void;\n  }>();\n\n  const classes = useCssModule();\n\n  if (!props.title && !slots.header) {\n    throw new Error('Either a title prop or header slot must be provided');\n  }\n\n  const localIsExpanded = ref(props.isExpanded);\n\n  watch(\n    () => props.isExpanded,\n    (newVal) => {\n      localIsExpanded.value = newVal;\n      emitEvents();\n    },\n  );\n\n  const toggle = () => {\n    localIsExpanded.value = !localIsExpanded.value;\n    emitEvents();\n  };\n\n  function emitEvents() {\n    emits('toggle', { isExpanded: localIsExpanded.value });\n    localIsExpanded.value ? emits('open') : emits('close');\n  }\n</script>\n\n<template>\n  <div class=\"stash-accordion tw-rounded tw-border tw-border-ice-500 tw-bg-white\" data-test=\"stash-accordion\">\n    <div\n      tabindex=\"0\"\n      data-test=\"stash-accordion|toggle\"\n      class=\"stash-accordion__toggle tw-flex tw-items-center\"\n      :class=\"[classes.toggle, localIsExpanded && classes['toggle--open']]\"\n      @click=\"toggle\"\n      @keypress.enter=\"toggle\"\n      @keypress.space.prevent=\"toggle\"\n    >\n      <div v-if=\"slots.header\">\n        <!-- @slot Accordion header -->\n        <slot name=\"header\"> </slot>\n      </div>\n      <template v-else>\n        <Icon class=\"tw-text-blue-500\" size=\"dense\" :name=\"props.icon\" data-test=\"stash-accordion|toggle-icon\" />\n        <div class=\"tw-flex-1 tw-select-none tw-font-medium tw-leading-5 tw-text-ice-900\">\n          {{ props.title }}\n        </div>\n      </template>\n\n      <Icon\n        class=\"tw-ml-auto tw-justify-center tw-text-ice-900 tw-transition-transform tw-duration-300\"\n        size=\"dense\"\n        name=\"chevron-down\"\n        data-test=\"stash-accordion|toggle-chevron\"\n        :class=\"{ 'tw-rotate-180': localIsExpanded }\"\n      />\n    </div>\n    <hr v-show=\"localIsExpanded\" class=\"tw-mx-[18px] tw-h-px tw-bg-ice-200\" />\n    <Expand :is-expanded=\"localIsExpanded\">\n      <div class=\"stash-accordion__content tw-p-[18px]\" data-test=\"stash-accordion|content\">\n        <!-- @slot Accordion content -->\n        <slot></slot>\n      </div>\n    </Expand>\n  </div>\n</template>\n\n<style module>\n  .toggle {\n    @apply tw-outline-none tw-ring-blue-500 tw-ring-opacity-15;\n\n    display: flex;\n    cursor: pointer;\n    gap: theme('gap[1.5]');\n    padding: 17px;\n    outline: none;\n    border-radius: theme('borderRadius.DEFAULT');\n\n    &:focus-visible {\n      @apply tw-ring-4;\n      border-color: var(--color-ice-900);\n      padding: 15px;\n      border-width: 2px;\n    }\n\n    &--open {\n      border-bottom-right-radius: 0;\n      border-bottom-left-radius: 0;\n    }\n\n    @media (hover: hover) {\n      &:hover {\n        background-color: var(--color-ice-100);\n      }\n    }\n\n    &:active {\n      background-color: var(--color-ice-200);\n    }\n\n    &:active + hr,\n    &:hover + hr {\n      opacity: 0;\n    }\n  }\n</style>\n"],"names":["props","__props","slots","useSlots","emits","__emit","classes","useCssModule","localIsExpanded","ref","watch","newVal","emitEvents","toggle"],"mappings":";;;;;;;;;;;;;;;;;;;;;;AA4BE,UAAMA,IAAQC,GAKRC,IAAQC,KAERC,IAAQC,GAMRC,IAAUC;AAEhB,QAAI,CAACP,EAAM,SAAS,CAACE,EAAM;AACnB,YAAA,IAAI,MAAM,qDAAqD;AAGjE,UAAAM,IAAkBC,EAAIT,EAAM,UAAU;AAE5C,IAAAU;AAAA,MACE,MAAMV,EAAM;AAAA,MACZ,CAACW,MAAW;AACV,QAAAH,EAAgB,QAAQG,GACbC;MACb;AAAA,IAAA;AAGF,UAAMC,IAAS,MAAM;AACH,MAAAL,EAAA,QAAQ,CAACA,EAAgB,OAC9BI;IAAA;AAGb,aAASA,IAAa;AACpB,MAAAR,EAAM,UAAU,EAAE,YAAYI,EAAgB,MAAO,CAAA,GACrDA,EAAgB,QAAQJ,EAAM,MAAM,IAAIA,EAAM,OAAO;AAAA,IACvD;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;"}
+{"version":3,"file":"Accordion.js","sources":["../src/components/Accordion/Accordion.vue"],"sourcesContent":["<script setup lang=\"ts\">\n  import { ref, useCssModule, useSlots, watch } from 'vue';\n\n  import Expand from '../Expand/Expand.vue';\n  import { IconName } from '../Icon/Icon.types';\n  import Icon from '../Icon/Icon.vue';\n\n  export interface AccordionProps {\n    /**\n     * The filename of the icon that will be displayed on the left side of the header\n     */\n    icon?: IconName;\n\n    /**\n     * Title of the Accordion, displayed in the header\n     */\n    title?: string;\n\n    /**\n     * Whether the Accordion is expanded or not\n     */\n    isExpanded?: boolean;\n  }\n\n  type ToggleState = {\n    isExpanded: boolean;\n  };\n\n  const props = withDefaults(defineProps<AccordionProps>(), {\n    icon: 'circle-info',\n    title: undefined,\n    isExpanded: false,\n  });\n  const slots = useSlots();\n\n  const emits = defineEmits<{\n    (e: 'toggle', state: ToggleState): void;\n    (e: 'open'): void;\n    (e: 'close'): void;\n  }>();\n\n  const classes = useCssModule();\n\n  if (!props.title && !slots.header) {\n    throw new Error('Either a title prop or header slot must be provided');\n  }\n\n  const localIsExpanded = ref(props.isExpanded);\n\n  watch(\n    () => props.isExpanded,\n    (newVal) => {\n      localIsExpanded.value = newVal;\n      emitEvents();\n    },\n  );\n\n  const toggle = () => {\n    localIsExpanded.value = !localIsExpanded.value;\n    emitEvents();\n  };\n\n  function emitEvents() {\n    emits('toggle', { isExpanded: localIsExpanded.value });\n    localIsExpanded.value ? emits('open') : emits('close');\n  }\n</script>\n\n<template>\n  <div class=\"stash-accordion tw-rounded tw-border tw-border-ice-500 tw-bg-white\" data-test=\"stash-accordion\">\n    <div\n      tabindex=\"0\"\n      data-test=\"stash-accordion|toggle\"\n      class=\"stash-accordion__toggle tw-flex tw-items-center\"\n      :class=\"[classes.toggle, localIsExpanded && classes['toggle--open']]\"\n      @click=\"toggle\"\n      @keypress.enter=\"toggle\"\n      @keypress.space.prevent=\"toggle\"\n    >\n      <div v-if=\"slots.header\">\n        <!-- @slot Accordion header -->\n        <slot name=\"header\"> </slot>\n      </div>\n      <template v-else>\n        <Icon class=\"tw-text-blue-500\" size=\"dense\" :name=\"props.icon\" data-test=\"stash-accordion|toggle-icon\" />\n        <div class=\"tw-flex-1 tw-select-none tw-font-medium tw-leading-5 tw-text-ice-900\">\n          {{ props.title }}\n        </div>\n      </template>\n\n      <Icon\n        class=\"tw-ml-auto tw-justify-center tw-text-ice-900 tw-transition-transform tw-duration-300\"\n        size=\"dense\"\n        name=\"chevron-down\"\n        data-test=\"stash-accordion|toggle-chevron\"\n        :class=\"{ 'tw-rotate-180': localIsExpanded }\"\n      />\n    </div>\n    <hr v-show=\"localIsExpanded\" class=\"tw-mx-[18px] tw-h-px tw-bg-ice-200\" />\n    <Expand :is-expanded=\"localIsExpanded\">\n      <div class=\"stash-accordion__content tw-p-[18px]\" data-test=\"stash-accordion|content\">\n        <!-- @slot Accordion content -->\n        <slot></slot>\n      </div>\n    </Expand>\n  </div>\n</template>\n\n<style module>\n  .toggle {\n    @apply tw-outline-none tw-ring-blue-500 tw-ring-opacity-15;\n\n    display: flex;\n    cursor: pointer;\n    gap: theme('gap[1.5]');\n    padding: 17px;\n    outline: none;\n    border-radius: theme('borderRadius.DEFAULT');\n\n    &:focus-visible {\n      @apply tw-ring-4;\n      border-color: var(--color-ice-900);\n      padding: 15px;\n      border-width: 2px;\n    }\n\n    &--open {\n      border-bottom-right-radius: 0;\n      border-bottom-left-radius: 0;\n    }\n\n    @media (hover: hover) {\n      &:hover {\n        background-color: var(--color-ice-100);\n      }\n    }\n\n    &:active {\n      background-color: var(--color-ice-200);\n    }\n\n    &:active + hr,\n    &:hover + hr {\n      opacity: 0;\n    }\n  }\n</style>\n"],"names":["props","__props","slots","useSlots","emits","__emit","classes","useCssModule","localIsExpanded","ref","watch","newVal","emitEvents","toggle"],"mappings":";;;;;;;;;;;;;;;;;;;AA4BE,UAAMA,IAAQC,GAKRC,IAAQC,KAERC,IAAQC,GAMRC,IAAUC;AAEhB,QAAI,CAACP,EAAM,SAAS,CAACE,EAAM;AACnB,YAAA,IAAI,MAAM,qDAAqD;AAGjE,UAAAM,IAAkBC,EAAIT,EAAM,UAAU;AAE5C,IAAAU;AAAA,MACE,MAAMV,EAAM;AAAA,MACZ,CAACW,MAAW;AACV,QAAAH,EAAgB,QAAQG,GACbC;MACb;AAAA,IAAA;AAGF,UAAMC,IAAS,MAAM;AACH,MAAAL,EAAA,QAAQ,CAACA,EAAgB,OAC9BI;IAAA;AAGb,aAASA,IAAa;AACpB,MAAAR,EAAM,UAAU,EAAE,YAAYI,EAAgB,MAAO,CAAA,GACrDA,EAAgB,QAAQJ,EAAM,MAAM,IAAIA,EAAM,OAAO;AAAA,IACvD;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;"}

package/dist/Accordion.vue.d.ts

@@ -48,25 +48,25 @@ export declare interface AccordionProps {
 }
 
 declare const _default: __VLS_WithTemplateSlots<DefineComponent<ExtractPropTypes<__VLS_WithDefaults<__VLS_TypePropsToRuntimeProps<AccordionProps>, {
-    icon: string;
-    title: undefined;
-    isExpanded: boolean;
+icon: string;
+title: undefined;
+isExpanded: boolean;
 }>>, {}, {}, {}, {}, ComponentOptionsMixin, ComponentOptionsMixin, {
-    toggle: (state: ToggleState) => void;
-    open: () => void;
-    close: () => void;
+toggle: (state: ToggleState) => void;
+open: () => void;
+close: () => void;
 }, string, PublicProps, Readonly<ExtractPropTypes<__VLS_WithDefaults<__VLS_TypePropsToRuntimeProps<AccordionProps>, {
-    icon: string;
-    title: undefined;
-    isExpanded: boolean;
+icon: string;
+title: undefined;
+isExpanded: boolean;
 }>>> & Readonly<{
-    onClose?: (() => any) | undefined;
-    onToggle?: ((state: ToggleState) => any) | undefined;
-    onOpen?: (() => any) | undefined;
+onClose?: (() => any) | undefined;
+onToggle?: ((state: ToggleState) => any) | undefined;
+onOpen?: (() => any) | undefined;
 }>, {
-    isExpanded: boolean;
-    title: string;
-    icon: "close" | "copy" | "submit" | "sort" | "search" | "split" | "link" | "tag" | "menu" | "image" | "action-dots" | "activity" | "alert-bell" | "archive" | "arrow-down" | "arrow-left" | "arrow-right" | "arrow-up" | "badge-discount" | "badge-seller-elite" | "badge-seller-power" | "badge-seller-verified" | "book-customer" | "building-office" | "bulk-add" | "calendar-reschedule" | "calendar" | "caret-down" | "caret-up" | "change-log" | "check" | "chevron-down" | "chevron-left" | "chevron-right" | "chevron-up" | "circle-check" | "circle-close" | "circle-dollar" | "circle-info" | "circle-partial" | "circle-percent" | "circle-question-mark" | "circle-status" | "circle-warning" | "clipboard-checkmark" | "clipboard-inventory" | "combine" | "compass" | "contact" | "contract" | "credit-card" | "credit-profile" | "dashboard" | "document-accept" | "document-invoice" | "document-recieved" | "document-sent" | "document-view" | "document" | "dolly" | "download" | "edit" | "ellipsis" | "envelope-open" | "envelope" | "equals" | "export" | "figma" | "file-csv" | "file" | "filter-funnel" | "filter-line" | "flag" | "folder" | "folder-bar-graph" | "folder-orders" | "font-bold" | "font-clear-format" | "font-italic" | "font-underline" | "gear" | "github" | "globe" | "graph-bar-chart" | "graph-line-chart" | "graph-pie-chart" | "hazard" | "hazard-outline" | "headset-agent" | "headset-mic" | "heart-filled" | "heart-outline" | "help-question-mark" | "hide" | "history" | "keyboard-return" | "license-approved" | "license-certificate" | "lightbulb" | "link-add" | "link-unlink" | "list-bulleted" | "list-items" | "list-numbered" | "loading-big" | "loading-empty" | "loading-small" | "location" | "lock-unlock" | "lock" | "logo-facebook" | "logo-instagram" | "logo-linkedin" | "logo-ll" | "logo-metrc" | "logo-plaid" | "logo-x" | "logo-youtube" | "logout" | "medical" | "megaphone-sound" | "megaphone" | "message-dispute" | "message-reply" | "message" | "minus" | "mj-leaf" | "money" | "note-add" | "note" | "open-in-new" | "paperclip" | "paper-plane" | "performance" | "phone" | "plus" | "preview" | "print" | "product-menu-manage" | "product-menu-search" | "product-menu" | "queue-add" | "queue" | "recent" | "refresh" | "register" | "reply" | "report-download" | "sample" | "save" | "scale-law" | "scale-weight" | "seed-cycle" | "share" | "shop-bag-browse" | "shop-bag-reorder" | "shop-bag" | "shop-basket" | "shop-cart-add" | "shop-cart" | "show" | "sign-dollar" | "sign-percent" | "star-filled" | "star-outline" | "storefront" | "swap-horizontal" | "swap-vertical" | "tag-star" | "test-results" | "ticket-star" | "ticket" | "tool-dropper" | "tool-wrench" | "transfer" | "trashcan" | "truck" | "upload" | "user-add" | "user-admin" | "user-check" | "user" | "view-card" | "view-detailed" | "view-list" | "warehouse" | "working";
+isExpanded: boolean;
+title: string;
+icon: "close" | "copy" | "submit" | "sort" | "search" | "split" | "link" | "tag" | "menu" | "image" | "action-dots" | "activity" | "alert-bell" | "archive" | "arrow-down" | "arrow-left" | "arrow-right" | "arrow-up" | "badge-discount" | "badge-seller-elite" | "badge-seller-power" | "badge-seller-verified" | "book-customer" | "building-office" | "bulk-add" | "calendar-reschedule" | "calendar" | "caret-down" | "caret-up" | "change-log" | "check" | "chevron-down" | "chevron-left" | "chevron-right" | "chevron-up" | "circle-check" | "circle-close" | "circle-dollar" | "circle-info" | "circle-partial" | "circle-percent" | "circle-question-mark" | "circle-status" | "circle-warning" | "clipboard-checkmark" | "clipboard-inventory" | "combine" | "compass" | "contact" | "contract" | "credit-card" | "credit-profile" | "dashboard" | "document-accept" | "document-invoice" | "document-recieved" | "document-sent" | "document-view" | "document" | "dolly" | "download" | "edit" | "ellipsis" | "envelope-open" | "envelope" | "equals" | "export" | "figma" | "file-csv" | "file" | "filter-funnel" | "filter-line" | "flag" | "folder" | "folder-bar-graph" | "folder-orders" | "font-bold" | "font-clear-format" | "font-italic" | "font-underline" | "gear" | "github" | "globe" | "graph-bar-chart" | "graph-line-chart" | "graph-pie-chart" | "hazard" | "hazard-outline" | "headset-agent" | "headset-mic" | "heart-filled" | "heart-outline" | "help-question-mark" | "hide" | "history" | "import" | "keyboard-return" | "license-approved" | "license-certificate" | "lightbulb" | "link-add" | "link-unlink" | "list-bulleted" | "list-items" | "list-numbered" | "loading-big" | "loading-empty" | "loading-small" | "location" | "lock-unlock" | "lock" | "logo-facebook" | "logo-instagram" | "logo-linkedin" | "logo-ll" | "logo-metrc" | "logo-plaid" | "logo-x" | "logo-youtube" | "logout" | "medical" | "megaphone-sound" | "megaphone" | "message-dispute" | "message-reply" | "message" | "minus" | "mj-leaf" | "money" | "note-add" | "note" | "open-in-new" | "paperclip" | "paper-plane" | "performance" | "phone" | "plus" | "preview" | "print" | "product-menu-manage" | "product-menu-search" | "product-menu" | "queue-add" | "queue" | "recent" | "refresh" | "register" | "reply" | "report-download" | "sample" | "save" | "scale-law" | "scale-weight" | "seed-cycle" | "share" | "shop-bag-browse" | "shop-bag-reorder" | "shop-bag" | "shop-basket" | "shop-cart-add" | "shop-cart" | "show" | "sign-dollar" | "sign-percent" | "star-filled" | "star-outline" | "storefront" | "swap-horizontal" | "swap-vertical" | "tag-star" | "test-results" | "ticket-star" | "ticket" | "tool-dropper" | "tool-wrench" | "transfer" | "trashcan" | "truck" | "upload" | "user-add" | "user-admin" | "user-check" | "user" | "view-card" | "view-detailed" | "view-list" | "warehouse" | "working";
 }, {}, {}, {}, string, ComponentProvideOptions, true, {}, any>, {
     header?(_: {}): any;
     default?(_: {}): any;
@@ -75,7 +75,7 @@ export default _default;
 
 declare type IconName = (typeof iconNames)[number];
 
-declare const iconNames: readonly ["action-dots", "activity", "alert-bell", "archive", "arrow-down", "arrow-left", "arrow-right", "arrow-up", "badge-discount", "badge-seller-elite", "badge-seller-power", "badge-seller-verified", "book-customer", "building-office", "bulk-add", "calendar-reschedule", "calendar", "caret-down", "caret-up", "change-log", "check", "chevron-down", "chevron-left", "chevron-right", "chevron-up", "circle-check", "circle-close", "circle-dollar", "circle-info", "circle-partial", "circle-percent", "circle-question-mark", "circle-status", "circle-warning", "clipboard-checkmark", "clipboard-inventory", "close", "combine", "compass", "contact", "contract", "copy", "credit-card", "credit-profile", "dashboard", "document-accept", "document-invoice", "document-recieved", "document-sent", "document-view", "document", "dolly", "download", "edit", "ellipsis", "envelope-open", "envelope", "equals", "export", "figma", "file-csv", "file", "filter-funnel", "filter-line", "flag", "folder", "folder-bar-graph", "folder-orders", "font-bold", "font-clear-format", "font-italic", "font-underline", "gear", "github", "globe", "graph-bar-chart", "graph-line-chart", "graph-pie-chart", "hazard", "hazard-outline", "headset-agent", "headset-mic", "heart-filled", "heart-outline", "help-question-mark", "hide", "history", "image", "keyboard-return", "license-approved", "license-certificate", "lightbulb", "link-add", "link-unlink", "link", "list-bulleted", "list-items", "list-numbered", "loading-big", "loading-empty", "loading-small", "location", "lock-unlock", "lock", "logo-facebook", "logo-instagram", "logo-linkedin", "logo-ll", "logo-metrc", "logo-plaid", "logo-x", "logo-youtube", "logout", "medical", "megaphone-sound", "megaphone", "menu", "message-dispute", "message-reply", "message", "minus", "mj-leaf", "money", "note-add", "note", "open-in-new", "paperclip", "paper-plane", "performance", "phone", "plus", "preview", "print", "product-menu-manage", "product-menu-search", "product-menu", "queue-add", "queue", "recent", "refresh", "register", "reply", "report-download", "sample", "save", "scale-law", "scale-weight", "search", "seed-cycle", "share", "shop-bag-browse", "shop-bag-reorder", "shop-bag", "shop-basket", "shop-cart-add", "shop-cart", "show", "sign-dollar", "sign-percent", "sort", "split", "star-filled", "star-outline", "storefront", "submit", "swap-horizontal", "swap-vertical", "tag-star", "tag", "test-results", "ticket-star", "ticket", "tool-dropper", "tool-wrench", "transfer", "trashcan", "truck", "upload", "user-add", "user-admin", "user-check", "user", "view-card", "view-detailed", "view-list", "warehouse", "working"];
+declare const iconNames: readonly ["action-dots", "activity", "alert-bell", "archive", "arrow-down", "arrow-left", "arrow-right", "arrow-up", "badge-discount", "badge-seller-elite", "badge-seller-power", "badge-seller-verified", "book-customer", "building-office", "bulk-add", "calendar-reschedule", "calendar", "caret-down", "caret-up", "change-log", "check", "chevron-down", "chevron-left", "chevron-right", "chevron-up", "circle-check", "circle-close", "circle-dollar", "circle-info", "circle-partial", "circle-percent", "circle-question-mark", "circle-status", "circle-warning", "clipboard-checkmark", "clipboard-inventory", "close", "combine", "compass", "contact", "contract", "copy", "credit-card", "credit-profile", "dashboard", "document-accept", "document-invoice", "document-recieved", "document-sent", "document-view", "document", "dolly", "download", "edit", "ellipsis", "envelope-open", "envelope", "equals", "export", "figma", "file-csv", "file", "filter-funnel", "filter-line", "flag", "folder", "folder-bar-graph", "folder-orders", "font-bold", "font-clear-format", "font-italic", "font-underline", "gear", "github", "globe", "graph-bar-chart", "graph-line-chart", "graph-pie-chart", "hazard", "hazard-outline", "headset-agent", "headset-mic", "heart-filled", "heart-outline", "help-question-mark", "hide", "history", "image", "import", "keyboard-return", "license-approved", "license-certificate", "lightbulb", "link-add", "link-unlink", "link", "list-bulleted", "list-items", "list-numbered", "loading-big", "loading-empty", "loading-small", "location", "lock-unlock", "lock", "logo-facebook", "logo-instagram", "logo-linkedin", "logo-ll", "logo-metrc", "logo-plaid", "logo-x", "logo-youtube", "logout", "medical", "megaphone-sound", "megaphone", "menu", "message-dispute", "message-reply", "message", "minus", "mj-leaf", "money", "note-add", "note", "open-in-new", "paperclip", "paper-plane", "performance", "phone", "plus", "preview", "print", "product-menu-manage", "product-menu-search", "product-menu", "queue-add", "queue", "recent", "refresh", "register", "reply", "report-download", "sample", "save", "scale-law", "scale-weight", "search", "seed-cycle", "share", "shop-bag-browse", "shop-bag-reorder", "shop-bag", "shop-basket", "shop-cart-add", "shop-cart", "show", "sign-dollar", "sign-percent", "sort", "split", "star-filled", "star-outline", "storefront", "submit", "swap-horizontal", "swap-vertical", "tag-star", "tag", "test-results", "ticket-star", "ticket", "tool-dropper", "tool-wrench", "transfer", "trashcan", "truck", "upload", "user-add", "user-admin", "user-check", "user", "view-card", "view-detailed", "view-list", "warehouse", "working"];
 
 declare type ToggleState = {
     isExpanded: boolean;

package/dist/ActionsDropdown.js

@@ -1,22 +1,10 @@
-import { defineComponent as c, useCssModule as p, openBlock as m, createBlock as u, unref as n, normalizeClass as s, createSlots as f, withCtx as e, createVNode as a, createTextVNode as w, toDisplayString as _, renderSlot as b } from "vue";
+import { defineComponent as i, useCssModule as p, openBlock as u, createBlock as f, unref as n, normalizeClass as s, createSlots as w, withCtx as e, createVNode as a, createTextVNode as _, toDisplayString as m, renderSlot as b } from "vue";
 import { t as C } from "./locale.js";
 import x from "./Button.js";
 import g from "./Dropdown.js";
 import B from "./Icon.js";
-import { _ as D } from "./_plugin-vue_export-helper-dad06003.js";
-import "lodash-es/get";
-import "./Button.vue_used_vue_type_style_index_0_lang.module-4dabc2a9.js";
-import "lodash-es/uniqueId";
-import "./index-9e1095ef.js";
-import "./Icon.vue_used_vue_type_style_index_0_lang.module-eb359559.js";
-import "./constants.js";
-import "./directives/clickoutside.js";
-import "./utils/calculateElementOverflow.js";
-import "./utils/helpers.js";
-import "lodash-es/camelCase";
-import "lodash-es/isFinite";
-import "lodash-es/isPlainObject";
-const y = /* @__PURE__ */ c({
+import { _ as D } from "./_plugin-vue_export-helper-CHgC5LLL.js";
+const y = /* @__PURE__ */ i({
   name: "ll-actions-dropdown",
   __name: "ActionsDropdown",
   props: {
@@ -25,23 +13,23 @@ const y = /* @__PURE__ */ c({
     contentClass: { default: "" },
     buttonText: { default: () => C("ll.actions") }
   },
-  setup(r) {
-    const t = r, o = p();
-    return (d, N) => (m(), u(g, {
+  setup(d) {
+    const t = d, o = p();
+    return (l, N) => (u(), f(g, {
       align: t.align,
       "content-class": [n(o).dropdownContent, t.contentClass],
       class: s(n(o).actionsDropdown)
-    }, f({
-      toggle: e(({ isActive: l, toggle: i }) => [
+    }, w({
+      toggle: e(({ isActive: r, toggle: c }) => [
         a(x, {
           class: s(["button tw-flex tw-w-full tw-items-center tw-justify-between tw-border tw-border-blue-500 tw-text-blue-500", [n(o).actionButton, { [n(o).disabled]: t.disabled }]]),
           secondary: "",
-          "aria-expanded": l.toString(),
+          "aria-expanded": r.toString(),
           disabled: t.disabled,
-          onClick: i
+          onClick: c
         }, {
           default: e(() => [
-            w(_(t.buttonText) + " ", 1),
+            _(m(t.buttonText) + " ", 1),
             a(B, {
               class: "tw-ml-1.5",
               name: "caret-down"
@@ -55,7 +43,7 @@ const y = /* @__PURE__ */ c({
       t.disabled ? void 0 : {
         name: "default",
         fn: e(() => [
-          b(d.$slots, "default")
+          b(l.$slots, "default")
         ]),
         key: "0"
       }
@@ -68,8 +56,8 @@ const y = /* @__PURE__ */ c({
   actionsDropdown: T
 }, A = {
   $style: h
-}, U = /* @__PURE__ */ D(y, [["__cssModules", A]]);
+}, q = /* @__PURE__ */ D(y, [["__cssModules", A]]);
 export {
-  U as default
+  q as default
 };
 //# sourceMappingURL=ActionsDropdown.js.map

package/dist/ActionsDropdown.js.map

@@ -1 +1 @@
-{"version":3,"file":"ActionsDropdown.js","sources":["../src/components/ActionsDropdown/ActionsDropdown.vue"],"sourcesContent":["<script lang=\"ts\" setup>\n  import { useCssModule } from 'vue';\n\n  import { t } from '../../locale';\n  import Button from '../Button/Button.vue';\n  import Dropdown from '../Dropdown/Dropdown.vue';\n  import Icon from '../Icon/Icon.vue';\n\n  defineOptions({\n    name: 'll-actions-dropdown',\n  });\n\n  export interface ActionsDropdownProps {\n    /**\n     * Used to position the dropdown relative to target\n     * Options: left, right\n     */\n    align?: 'left' | 'right';\n    /**\n     * Indicates whether the trigger button is disabled or not\n     */\n    disabled?: boolean;\n    /**\n     * Class to be applied to the dropdown content\n     */\n    contentClass?: string;\n    /**\n     * Text to be displayed on the trigger button\n     */\n    buttonText?: string;\n  }\n\n  const props = withDefaults(defineProps<ActionsDropdownProps>(), {\n    align: 'left',\n    disabled: false,\n    contentClass: '',\n    buttonText: () => t('ll.actions'),\n  });\n\n  const classes = useCssModule();\n</script>\n\n<template>\n  <Dropdown\n    :align=\"props.align\"\n    :content-class=\"[classes.dropdownContent, props.contentClass]\"\n    :class=\"classes.actionsDropdown\"\n  >\n    <template #toggle=\"{ isActive, toggle }\">\n      <Button\n        class=\"button tw-flex tw-w-full tw-items-center tw-justify-between tw-border tw-border-blue-500 tw-text-blue-500\"\n        secondary\n        :aria-expanded=\"isActive.toString()\"\n        :class=\"[classes.actionButton, { [classes.disabled]: props.disabled }]\"\n        :disabled=\"props.disabled\"\n        @click=\"toggle\"\n      >\n        {{ props.buttonText }} <Icon class=\"tw-ml-1.5\" name=\"caret-down\" />\n      </Button>\n    </template>\n\n    <template v-if=\"!props.disabled\" #default>\n      <!-- @slot Dropdown content -->\n      <slot></slot>\n    </template>\n  </Dropdown>\n</template>\n\n<style module>\n  .actionButton {\n    min-width: 156px;\n    white-space: normal;\n  }\n\n  .actionButton:hover {\n    background-color: var(--color-blue-100);\n    border-color: var(--color-blue-500) !important;\n  }\n\n  .disabled {\n    background-color: var(--color-ice-100) !important;\n    border-color: var(--color-ice-500) !important;\n    color: var(--color-ice-500) !important;\n  }\n\n  .dropdownContent {\n    margin-top: 4px;\n  }\n\n  .dropdownContent:global(.dropdown__content) {\n    margin-left: 0;\n    margin-right: 0;\n    max-width: 90vw;\n  }\n\n  .dropdownContent:global(.dropdown__content)::after {\n    display: none;\n  }\n\n  @media screen('md') {\n    .actionsDropdown {\n      min-width: 156px;\n    }\n\n    .dropdownContent:global(.dropdown__content) {\n      min-width: 156px;\n    }\n  }\n</style>\n"],"names":["props","__props","classes","useCssModule"],"mappings":";;;;;;;;;;;;;;;;;;;;;;;;;;;;AAgCE,UAAMA,IAAQC,GAORC,IAAUC;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;"}
+{"version":3,"file":"ActionsDropdown.js","sources":["../src/components/ActionsDropdown/ActionsDropdown.vue"],"sourcesContent":["<script lang=\"ts\" setup>\n  import { useCssModule } from 'vue';\n\n  import { t } from '../../locale';\n  import Button from '../Button/Button.vue';\n  import Dropdown from '../Dropdown/Dropdown.vue';\n  import Icon from '../Icon/Icon.vue';\n\n  defineOptions({\n    name: 'll-actions-dropdown',\n  });\n\n  export interface ActionsDropdownProps {\n    /**\n     * Used to position the dropdown relative to target\n     * Options: left, right\n     */\n    align?: 'left' | 'right';\n    /**\n     * Indicates whether the trigger button is disabled or not\n     */\n    disabled?: boolean;\n    /**\n     * Class to be applied to the dropdown content\n     */\n    contentClass?: string;\n    /**\n     * Text to be displayed on the trigger button\n     */\n    buttonText?: string;\n  }\n\n  const props = withDefaults(defineProps<ActionsDropdownProps>(), {\n    align: 'left',\n    disabled: false,\n    contentClass: '',\n    buttonText: () => t('ll.actions'),\n  });\n\n  const classes = useCssModule();\n</script>\n\n<template>\n  <Dropdown\n    :align=\"props.align\"\n    :content-class=\"[classes.dropdownContent, props.contentClass]\"\n    :class=\"classes.actionsDropdown\"\n  >\n    <template #toggle=\"{ isActive, toggle }\">\n      <Button\n        class=\"button tw-flex tw-w-full tw-items-center tw-justify-between tw-border tw-border-blue-500 tw-text-blue-500\"\n        secondary\n        :aria-expanded=\"isActive.toString()\"\n        :class=\"[classes.actionButton, { [classes.disabled]: props.disabled }]\"\n        :disabled=\"props.disabled\"\n        @click=\"toggle\"\n      >\n        {{ props.buttonText }} <Icon class=\"tw-ml-1.5\" name=\"caret-down\" />\n      </Button>\n    </template>\n\n    <template v-if=\"!props.disabled\" #default>\n      <!-- @slot Dropdown content -->\n      <slot></slot>\n    </template>\n  </Dropdown>\n</template>\n\n<style module>\n  .actionButton {\n    min-width: 156px;\n    white-space: normal;\n  }\n\n  .actionButton:hover {\n    background-color: var(--color-blue-100);\n    border-color: var(--color-blue-500) !important;\n  }\n\n  .disabled {\n    background-color: var(--color-ice-100) !important;\n    border-color: var(--color-ice-500) !important;\n    color: var(--color-ice-500) !important;\n  }\n\n  .dropdownContent {\n    margin-top: 4px;\n  }\n\n  .dropdownContent:global(.dropdown__content) {\n    margin-left: 0;\n    margin-right: 0;\n    max-width: 90vw;\n  }\n\n  .dropdownContent:global(.dropdown__content)::after {\n    display: none;\n  }\n\n  @media screen('md') {\n    .actionsDropdown {\n      min-width: 156px;\n    }\n\n    .dropdownContent:global(.dropdown__content) {\n      min-width: 156px;\n    }\n  }\n</style>\n"],"names":["props","__props","classes","useCssModule"],"mappings":";;;;;;;;;;;;;;;;AAgCE,UAAMA,IAAQC,GAORC,IAAUC;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;"}

package/dist/ActionsDropdown.vue.d.ts

@@ -53,20 +53,20 @@ export declare interface ActionsDropdownProps {
 }
 
 declare const _default: __VLS_WithTemplateSlots<DefineComponent<ExtractPropTypes<__VLS_WithDefaults<__VLS_TypePropsToRuntimeProps<ActionsDropdownProps>, {
-    align: string;
-    disabled: boolean;
-    contentClass: string;
-    buttonText: () => any;
+align: string;
+disabled: boolean;
+contentClass: string;
+buttonText: () => any;
 }>>, {}, {}, {}, {}, ComponentOptionsMixin, ComponentOptionsMixin, {}, string, PublicProps, Readonly<ExtractPropTypes<__VLS_WithDefaults<__VLS_TypePropsToRuntimeProps<ActionsDropdownProps>, {
-    align: string;
-    disabled: boolean;
-    contentClass: string;
-    buttonText: () => any;
+align: string;
+disabled: boolean;
+contentClass: string;
+buttonText: () => any;
 }>>> & Readonly<{}>, {
-    disabled: boolean;
-    align: "left" | "right";
-    contentClass: string;
-    buttonText: string;
+disabled: boolean;
+align: "left" | "right";
+contentClass: string;
+buttonText: string;
 }, {}, {}, {}, string, ComponentProvideOptions, true, {}, any>, {
     default?(_: {}): any;
 }>;

package/dist/AddressSelect.js

@@ -4,31 +4,7 @@ import C from "lodash-es/uniqueId";
 import U from "./useGoogleMaps.js";
 import { DEBOUNCE as q } from "./constants.js";
 import F from "./Select.js";
-import "lodash-es/keyBy";
-import "./floating-ui.vue-8d7f7932.js";
-import "@leaflink/snitch";
-import "lodash-es/isEmpty";
-import "lodash-es/isEqual";
-import "lodash-es/isPlainObject";
-import "./useSearch.js";
-import "lodash-es/get";
-import "./searchFuzzy-9b74ec4e.js";
-import "./_commonjsHelpers-10dfc225.js";
-import "./utils/helpers.js";
-import "lodash-es/camelCase";
-import "lodash-es/isFinite";
-import "./directives/clickoutside.js";
-import "./MenusPlugin-9288029a.js";
-import "./Chip.js";
-import "./utils/colorScheme.js";
-import "./Icon.js";
-import "./index-9e1095ef.js";
-import "./Icon.vue_used_vue_type_style_index_0_lang.module-eb359559.js";
-import "./_plugin-vue_export-helper-dad06003.js";
-import "./Field.vue_vue_type_script_setup_true_lang-fded4f75.js";
-import "./Label.vue_vue_type_script_setup_true_lang-b6ba2f02.js";
-import "./locale.js";
-const _ = "address-select-", ye = /* @__PURE__ */ S({
+const _ = "address-select-", $ = /* @__PURE__ */ S({
   __name: "AddressSelect",
   props: {
     apiKey: { default: void 0 },
@@ -50,15 +26,15 @@ const _ = "address-select-", ye = /* @__PURE__ */ S({
   },
   emits: ["update:modelValue", "error"],
   setup(g, { emit: V }) {
-    const t = g, r = V, b = A(), d = T("stashOptions"), u = h(() => t.apiKey || (d == null ? void 0 : d.googleMapsApiKey));
+    const t = g, l = V, b = A(), s = T("stashOptions"), u = h(() => t.apiKey || (s == null ? void 0 : s.googleMapsApiKey));
     if (!u.value)
       throw new Error("Google Maps API key is required");
-    const { getPlaceDetails: x, getPlacePredictions: E } = U(u.value), i = n(!1), a = n(), l = n(), w = K(B, t.debounceTime), s = h(() => {
-      var e, m, p, c, f, v;
+    const { getPlaceDetails: x, getPlacePredictions: E } = U(u.value), r = n(!1), a = n(), d = n(), w = K(B, t.debounceTime), i = h(() => {
+      var e, c, m, p, f, v;
       return [
-        [(e = t.modelValue) == null ? void 0 : e.street_address, (m = t.modelValue) == null ? void 0 : m.extended_address].filter(Boolean).join(" "),
-        (p = t.modelValue) == null ? void 0 : p.city,
-        [(c = t.modelValue) == null ? void 0 : c.state, (f = t.modelValue) == null ? void 0 : f.postal_code].filter(Boolean).join(" "),
+        [(e = t.modelValue) == null ? void 0 : e.street_address, (c = t.modelValue) == null ? void 0 : c.extended_address].filter(Boolean).join(" "),
+        (m = t.modelValue) == null ? void 0 : m.city,
+        [(p = t.modelValue) == null ? void 0 : p.state, (f = t.modelValue) == null ? void 0 : f.postal_code].filter(Boolean).join(" "),
         (v = t.modelValue) == null ? void 0 : v.country
       ].filter(Boolean).join(", ");
     });
@@ -66,34 +42,33 @@ const _ = "address-select-", ye = /* @__PURE__ */ S({
       () => t.modelValue,
       () => {
         var o;
-        if (s.value && !((o = a.value) != null && o.length)) {
+        if (i.value && !((o = a.value) != null && o.length)) {
           const e = {
             id: t.modelValue.place_id || C(_),
-            name: s.value,
+            name: i.value,
             address: t.modelValue
           };
-          a.value = [e], l.value = e;
-        } else
-          s.value || (l.value = void 0, a.value = []);
+          a.value = [e], d.value = e;
+        } else i.value || (d.value = void 0, a.value = []);
       },
       { immediate: !0 }
     );
     async function B(o) {
-      i.value = !0;
+      r.value = !0;
       try {
         a.value = await E(o);
       } catch (e) {
         if (a.value = [], e != null && e.isGoogleMapsError)
-          r("error", e);
+          l("error", e);
         else
           throw e;
       } finally {
-        i.value = !1;
+        r.value = !1;
       }
     }
     async function M(o) {
-      if (l.value = o, !o) {
-        r("update:modelValue", {
+      if (d.value = o, !o) {
+        l("update:modelValue", {
           street_address: void 0,
           extended_address: void 0,
           city: void 0,
@@ -104,15 +79,15 @@ const _ = "address-select-", ye = /* @__PURE__ */ S({
         return;
       }
       if (o.id.startsWith(_) && o.address) {
-        r("update:modelValue", o.address);
+        l("update:modelValue", o.address);
         return;
       }
       try {
         const e = await x(o.id);
-        r("update:modelValue", e);
+        l("update:modelValue", e);
       } catch (e) {
         if (e != null && e.isGoogleMapsError)
-          r("error", e);
+          l("error", e);
         else
           throw e;
       }
@@ -121,13 +96,13 @@ const _ = "address-select-", ye = /* @__PURE__ */ S({
       single: "",
       "data-test": "select|address",
       disabled: t.disabled,
-      loading: i.value,
+      loading: r.value,
       options: a.value,
       placeholder: t.placeholder,
       label: t.label,
       "hint-text": t.hintText,
       error: t.errorText,
-      "model-value": l.value,
+      "model-value": d.value,
       "prevent-empty": t.preventEmpty,
       "disable-filtering": "",
       onSearch: y(w),
@@ -144,6 +119,6 @@ const _ = "address-select-", ye = /* @__PURE__ */ S({
   }
 });
 export {
-  ye as default
+  $ as default
 };
 //# sourceMappingURL=AddressSelect.js.map

package/dist/AddressSelect.js.map

@@ -1 +1 @@
-{"version":3,"file":"AddressSelect.js","sources":["../src/components/AddressSelect/AddressSelect.vue"],"sourcesContent":["<script setup lang=\"ts\">\n  import debounce from 'lodash-es/debounce';\n  import uniqueId from 'lodash-es/uniqueId';\n  import { computed, inject, ref, useSlots, watch } from 'vue';\n\n  import { StashProvideState } from '../../../types/misc';\n  import useGoogleMaps, { type Address, type AddressOption } from '../../composables/useGoogleMaps/useGoogleMaps';\n  import { DEBOUNCE } from '../../constants';\n  import Select from '../Select/Select.vue';\n\n  export interface AddressSelectProps {\n    /**\n     * Google Maps API Key. This takes precedence over the key defined in stashOptions\n     */\n    apiKey?: string;\n    /**\n     * Wether the Select is disabled or not\n     */\n    disabled?: boolean;\n    /**\n     * Select placeholder\n     */\n    placeholder?: string;\n    /**\n     * Debounce time in milliseconds to perform API requests on search\n     */\n    debounceTime?: number;\n    /**\n     * Model value address\n     */\n    modelValue: Address;\n    /**\n     * Hint text to be passed down to Select component\n     */\n    hintText?: string;\n    /**\n     * Error text to be passed down to Select component\n     */\n    errorText?: string;\n    /**\n     * Label text to be passed down to Select component\n     */\n    label?: string;\n    /**\n     * Disallows values from being de-selected\n     */\n    preventEmpty?: boolean;\n  }\n\n  const props = withDefaults(defineProps<AddressSelectProps>(), {\n    disabled: false,\n    placeholder: 'Type an address',\n    debounceTime: DEBOUNCE.MEDIUM,\n    modelValue: () => ({\n      street_address: undefined,\n      extended_address: undefined,\n      city: undefined,\n      state: undefined,\n      postal_code: undefined,\n      country: undefined,\n    }),\n    hintText: undefined,\n    errorText: undefined,\n    label: undefined,\n    preventEmpty: false,\n    apiKey: undefined,\n  });\n\n  const emit = defineEmits<{\n    /**\n     * Emitted when the model value changes\n     */\n    (e: 'update:modelValue', value: Address): void;\n    /**\n     * Emitted when an error occurs while reaching out to Google's API\n     */\n    (e: 'error', value: unknown): void;\n  }>();\n\n  const slots = useSlots();\n  const stashOptions = inject<StashProvideState>('stashOptions');\n\n  const googleMapsApiKey = computed(() => props.apiKey || stashOptions?.googleMapsApiKey);\n\n  if (!googleMapsApiKey.value) {\n    throw new Error('Google Maps API key is required');\n  }\n\n  const { getPlaceDetails, getPlacePredictions } = useGoogleMaps(googleMapsApiKey.value);\n\n  const ID_PREFIX = 'address-select-';\n\n  const isLoading = ref(false);\n  const options = ref<Array<AddressOption>>();\n  const internalValue = ref<AddressOption>();\n\n  const debouncedSearch = debounce(search, props.debounceTime);\n\n  const formattedAddress = computed(() => {\n    const formattedAddress = [\n      [props.modelValue?.street_address, props.modelValue?.extended_address].filter(Boolean).join(' '),\n      props.modelValue?.city,\n      [props.modelValue?.state, props.modelValue?.postal_code].filter(Boolean).join(' '),\n      props.modelValue?.country,\n    ]\n      .filter(Boolean)\n      .join(', ');\n\n    return formattedAddress;\n  });\n\n  // When we don't have options just yet, we need to create them on our own\n  watch(\n    () => props.modelValue,\n    () => {\n      if (formattedAddress.value && !options.value?.length) {\n        const option = {\n          id: props.modelValue.place_id || uniqueId(ID_PREFIX),\n          name: formattedAddress.value,\n          address: props.modelValue,\n        };\n\n        options.value = [option];\n        internalValue.value = option;\n      } else if (!formattedAddress.value) {\n        internalValue.value = undefined;\n        options.value = [];\n      }\n    },\n    { immediate: true },\n  );\n\n  async function search(query: string) {\n    isLoading.value = true;\n\n    try {\n      options.value = await getPlacePredictions(query);\n      // eslint-disable-next-line @typescript-eslint/no-explicit-any\n    } catch (error: any) {\n      options.value = [];\n      if (error?.isGoogleMapsError) {\n        emit('error', error);\n      } else {\n        throw error;\n      }\n    } finally {\n      isLoading.value = false;\n    }\n  }\n\n  async function select(option: AddressOption) {\n    internalValue.value = option;\n\n    // When an option is de-selected, the option will be undefined\n    if (!option) {\n      emit('update:modelValue', {\n        street_address: undefined,\n        extended_address: undefined,\n        city: undefined,\n        state: undefined,\n        postal_code: undefined,\n        country: undefined,\n      });\n      return;\n    }\n\n    // When an option does not have a google place id, we don't want to fetch it's details\n    if (option.id.startsWith(ID_PREFIX) && option.address) {\n      emit('update:modelValue', option.address);\n      return;\n    }\n\n    try {\n      const address = await getPlaceDetails(option.id);\n      emit('update:modelValue', address);\n      // eslint-disable-next-line @typescript-eslint/no-explicit-any\n    } catch (error: any) {\n      if (error?.isGoogleMapsError) {\n        emit('error', error);\n      } else {\n        throw error;\n      }\n    }\n  }\n</script>\n\n<template>\n  <Select\n    single\n    data-test=\"select|address\"\n    :disabled=\"props.disabled\"\n    :loading=\"isLoading\"\n    :options=\"options\"\n    :placeholder=\"props.placeholder\"\n    :label=\"props.label\"\n    :hint-text=\"props.hintText\"\n    :error=\"props.errorText\"\n    :model-value=\"internalValue\"\n    :prevent-empty=\"props.preventEmpty\"\n    disable-filtering\n    @search=\"debouncedSearch\"\n    @update:model-value=\"select\"\n  >\n    <template v-if=\"slots.hint\" #hint>\n      <slot name=\"hint\"></slot>\n    </template>\n  </Select>\n</template>\n"],"names":["ID_PREFIX","props","__props","emit","__emit","slots","useSlots","stashOptions","inject","googleMapsApiKey","computed","getPlaceDetails","getPlacePredictions","useGoogleMaps","isLoading","ref","options","internalValue","debouncedSearch","debounce","search","formattedAddress","_a","_b","_c","_d","_e","_f","watch","option","uniqueId","query","error","select","address"],"mappings":";;;;;;;;;;;;;;;;;;;;;;;;;;;;;;AA0FE,MAAMA,IAAY;;;;;;;;;;;;;;;;;;;;;;AAzClB,UAAMC,IAAQC,GAmBRC,IAAOC,GAWPC,IAAQC,KACRC,IAAeC,EAA0B,cAAc,GAEvDC,IAAmBC,EAAS,MAAMT,EAAM,WAAUM,KAAA,gBAAAA,EAAc,iBAAgB;AAElF,QAAA,CAACE,EAAiB;AACd,YAAA,IAAI,MAAM,iCAAiC;AAGnD,UAAM,EAAE,iBAAAE,GAAiB,qBAAAC,EAAA,IAAwBC,EAAcJ,EAAiB,KAAK,GAI/EK,IAAYC,EAAI,EAAK,GACrBC,IAAUD,KACVE,IAAgBF,KAEhBG,IAAkBC,EAASC,GAAQnB,EAAM,YAAY,GAErDoB,IAAmBX,EAAS,MAAM;;AAU/BW,aATkB;AAAA,QACvB,EAACC,IAAArB,EAAM,eAAN,gBAAAqB,EAAkB,iBAAgBC,IAAAtB,EAAM,eAAN,gBAAAsB,EAAkB,gBAAgB,EAAE,OAAO,OAAO,EAAE,KAAK,GAAG;AAAA,SAC/FC,IAAAvB,EAAM,eAAN,gBAAAuB,EAAkB;AAAA,QAClB,EAACC,IAAAxB,EAAM,eAAN,gBAAAwB,EAAkB,QAAOC,IAAAzB,EAAM,eAAN,gBAAAyB,EAAkB,WAAW,EAAE,OAAO,OAAO,EAAE,KAAK,GAAG;AAAA,SACjFC,IAAA1B,EAAM,eAAN,gBAAA0B,EAAkB;AAAA,MAEjB,EAAA,OAAO,OAAO,EACd,KAAK,IAAI;AAAA,IAEL,CACR;AAGD,IAAAC;AAAA,MACE,MAAM3B,EAAM;AAAA,MACZ,MAAM;;AACJ,YAAIoB,EAAiB,SAAS,GAACC,IAAAN,EAAQ,UAAR,QAAAM,EAAe,SAAQ;AACpD,gBAAMO,IAAS;AAAA,YACb,IAAI5B,EAAM,WAAW,YAAY6B,EAAS9B,CAAS;AAAA,YACnD,MAAMqB,EAAiB;AAAA,YACvB,SAASpB,EAAM;AAAA,UAAA;AAGT,UAAAe,EAAA,QAAQ,CAACa,CAAM,GACvBZ,EAAc,QAAQY;AAAA;AACxB,UAAYR,EAAiB,UAC3BJ,EAAc,QAAQ,QACtBD,EAAQ,QAAQ;MAEpB;AAAA,MACA,EAAE,WAAW,GAAK;AAAA,IAAA;AAGpB,mBAAeI,EAAOW,GAAe;AACnC,MAAAjB,EAAU,QAAQ;AAEd,UAAA;AACM,QAAAE,EAAA,QAAQ,MAAMJ,EAAoBmB,CAAK;AAAA,eAExCC;AAEP,YADAhB,EAAQ,QAAQ,IACZgB,KAAA,QAAAA,EAAO;AACT,UAAA7B,EAAK,SAAS6B,CAAK;AAAA;AAEb,gBAAAA;AAAA,MACR,UACA;AACA,QAAAlB,EAAU,QAAQ;AAAA,MACpB;AAAA,IACF;AAEA,mBAAemB,EAAOJ,GAAuB;AAI3C,UAHAZ,EAAc,QAAQY,GAGlB,CAACA,GAAQ;AACX,QAAA1B,EAAK,qBAAqB;AAAA,UACxB,gBAAgB;AAAA,UAChB,kBAAkB;AAAA,UAClB,MAAM;AAAA,UACN,OAAO;AAAA,UACP,aAAa;AAAA,UACb,SAAS;AAAA,QAAA,CACV;AACD;AAAA;AAIF,UAAI0B,EAAO,GAAG,WAAW7B,CAAS,KAAK6B,EAAO,SAAS;AAChD,QAAA1B,EAAA,qBAAqB0B,EAAO,OAAO;AACxC;AAAA;AAGE,UAAA;AACF,cAAMK,IAAU,MAAMvB,EAAgBkB,EAAO,EAAE;AAC/C,QAAA1B,EAAK,qBAAqB+B,CAAO;AAAA,eAE1BF;AACP,YAAIA,KAAA,QAAAA,EAAO;AACT,UAAA7B,EAAK,SAAS6B,CAAK;AAAA;AAEb,gBAAAA;AAAA,MAEV;AAAA,IACF;;;;;;;;;;;;;;;;;;;;;;;;;;;"}
+{"version":3,"file":"AddressSelect.js","sources":["../src/components/AddressSelect/AddressSelect.vue"],"sourcesContent":["<script setup lang=\"ts\">\n  import debounce from 'lodash-es/debounce';\n  import uniqueId from 'lodash-es/uniqueId';\n  import { computed, inject, ref, useSlots, watch } from 'vue';\n\n  import { StashProvideState } from '../../../types/misc';\n  import useGoogleMaps, { type Address, type AddressOption } from '../../composables/useGoogleMaps/useGoogleMaps';\n  import { DEBOUNCE } from '../../constants';\n  import Select from '../Select/Select.vue';\n\n  export interface AddressSelectProps {\n    /**\n     * Google Maps API Key. This takes precedence over the key defined in stashOptions\n     */\n    apiKey?: string;\n    /**\n     * Wether the Select is disabled or not\n     */\n    disabled?: boolean;\n    /**\n     * Select placeholder\n     */\n    placeholder?: string;\n    /**\n     * Debounce time in milliseconds to perform API requests on search\n     */\n    debounceTime?: number;\n    /**\n     * Model value address\n     */\n    modelValue: Address;\n    /**\n     * Hint text to be passed down to Select component\n     */\n    hintText?: string;\n    /**\n     * Error text to be passed down to Select component\n     */\n    errorText?: string;\n    /**\n     * Label text to be passed down to Select component\n     */\n    label?: string;\n    /**\n     * Disallows values from being de-selected\n     */\n    preventEmpty?: boolean;\n  }\n\n  const props = withDefaults(defineProps<AddressSelectProps>(), {\n    disabled: false,\n    placeholder: 'Type an address',\n    debounceTime: DEBOUNCE.MEDIUM,\n    modelValue: () => ({\n      street_address: undefined,\n      extended_address: undefined,\n      city: undefined,\n      state: undefined,\n      postal_code: undefined,\n      country: undefined,\n    }),\n    hintText: undefined,\n    errorText: undefined,\n    label: undefined,\n    preventEmpty: false,\n    apiKey: undefined,\n  });\n\n  const emit = defineEmits<{\n    /**\n     * Emitted when the model value changes\n     */\n    (e: 'update:modelValue', value: Address): void;\n    /**\n     * Emitted when an error occurs while reaching out to Google's API\n     */\n    (e: 'error', value: unknown): void;\n  }>();\n\n  const slots = useSlots();\n  const stashOptions = inject<StashProvideState>('stashOptions');\n\n  const googleMapsApiKey = computed(() => props.apiKey || stashOptions?.googleMapsApiKey);\n\n  if (!googleMapsApiKey.value) {\n    throw new Error('Google Maps API key is required');\n  }\n\n  const { getPlaceDetails, getPlacePredictions } = useGoogleMaps(googleMapsApiKey.value);\n\n  const ID_PREFIX = 'address-select-';\n\n  const isLoading = ref(false);\n  const options = ref<Array<AddressOption>>();\n  const internalValue = ref<AddressOption>();\n\n  const debouncedSearch = debounce(search, props.debounceTime);\n\n  const formattedAddress = computed(() => {\n    const formattedAddress = [\n      [props.modelValue?.street_address, props.modelValue?.extended_address].filter(Boolean).join(' '),\n      props.modelValue?.city,\n      [props.modelValue?.state, props.modelValue?.postal_code].filter(Boolean).join(' '),\n      props.modelValue?.country,\n    ]\n      .filter(Boolean)\n      .join(', ');\n\n    return formattedAddress;\n  });\n\n  // When we don't have options just yet, we need to create them on our own\n  watch(\n    () => props.modelValue,\n    () => {\n      if (formattedAddress.value && !options.value?.length) {\n        const option = {\n          id: props.modelValue.place_id || uniqueId(ID_PREFIX),\n          name: formattedAddress.value,\n          address: props.modelValue,\n        };\n\n        options.value = [option];\n        internalValue.value = option;\n      } else if (!formattedAddress.value) {\n        internalValue.value = undefined;\n        options.value = [];\n      }\n    },\n    { immediate: true },\n  );\n\n  async function search(query: string) {\n    isLoading.value = true;\n\n    try {\n      options.value = await getPlacePredictions(query);\n      // eslint-disable-next-line @typescript-eslint/no-explicit-any\n    } catch (error: any) {\n      options.value = [];\n      if (error?.isGoogleMapsError) {\n        emit('error', error);\n      } else {\n        throw error;\n      }\n    } finally {\n      isLoading.value = false;\n    }\n  }\n\n  async function select(option: AddressOption) {\n    internalValue.value = option;\n\n    // When an option is de-selected, the option will be undefined\n    if (!option) {\n      emit('update:modelValue', {\n        street_address: undefined,\n        extended_address: undefined,\n        city: undefined,\n        state: undefined,\n        postal_code: undefined,\n        country: undefined,\n      });\n      return;\n    }\n\n    // When an option does not have a google place id, we don't want to fetch it's details\n    if (option.id.startsWith(ID_PREFIX) && option.address) {\n      emit('update:modelValue', option.address);\n      return;\n    }\n\n    try {\n      const address = await getPlaceDetails(option.id);\n      emit('update:modelValue', address);\n      // eslint-disable-next-line @typescript-eslint/no-explicit-any\n    } catch (error: any) {\n      if (error?.isGoogleMapsError) {\n        emit('error', error);\n      } else {\n        throw error;\n      }\n    }\n  }\n</script>\n\n<template>\n  <Select\n    single\n    data-test=\"select|address\"\n    :disabled=\"props.disabled\"\n    :loading=\"isLoading\"\n    :options=\"options\"\n    :placeholder=\"props.placeholder\"\n    :label=\"props.label\"\n    :hint-text=\"props.hintText\"\n    :error=\"props.errorText\"\n    :model-value=\"internalValue\"\n    :prevent-empty=\"props.preventEmpty\"\n    disable-filtering\n    @search=\"debouncedSearch\"\n    @update:model-value=\"select\"\n  >\n    <template v-if=\"slots.hint\" #hint>\n      <slot name=\"hint\"></slot>\n    </template>\n  </Select>\n</template>\n"],"names":["ID_PREFIX","props","__props","emit","__emit","slots","useSlots","stashOptions","inject","googleMapsApiKey","computed","getPlaceDetails","getPlacePredictions","useGoogleMaps","isLoading","ref","options","internalValue","debouncedSearch","debounce","search","formattedAddress","_a","_b","_c","_d","_e","_f","watch","option","uniqueId","query","error","select","address"],"mappings":";;;;;;AA0FE,MAAMA,IAAY;;;;;;;;;;;;;;;;;;;;;;AAzClB,UAAMC,IAAQC,GAmBRC,IAAOC,GAWPC,IAAQC,KACRC,IAAeC,EAA0B,cAAc,GAEvDC,IAAmBC,EAAS,MAAMT,EAAM,WAAUM,KAAA,gBAAAA,EAAc,iBAAgB;AAElF,QAAA,CAACE,EAAiB;AACd,YAAA,IAAI,MAAM,iCAAiC;AAGnD,UAAM,EAAE,iBAAAE,GAAiB,qBAAAC,EAAA,IAAwBC,EAAcJ,EAAiB,KAAK,GAI/EK,IAAYC,EAAI,EAAK,GACrBC,IAAUD,KACVE,IAAgBF,KAEhBG,IAAkBC,EAASC,GAAQnB,EAAM,YAAY,GAErDoB,IAAmBX,EAAS,MAAM;;AAU/BW,aATkB;AAAA,QACvB,EAACC,IAAArB,EAAM,eAAN,gBAAAqB,EAAkB,iBAAgBC,IAAAtB,EAAM,eAAN,gBAAAsB,EAAkB,gBAAgB,EAAE,OAAO,OAAO,EAAE,KAAK,GAAG;AAAA,SAC/FC,IAAAvB,EAAM,eAAN,gBAAAuB,EAAkB;AAAA,QAClB,EAACC,IAAAxB,EAAM,eAAN,gBAAAwB,EAAkB,QAAOC,IAAAzB,EAAM,eAAN,gBAAAyB,EAAkB,WAAW,EAAE,OAAO,OAAO,EAAE,KAAK,GAAG;AAAA,SACjFC,IAAA1B,EAAM,eAAN,gBAAA0B,EAAkB;AAAA,MAEjB,EAAA,OAAO,OAAO,EACd,KAAK,IAAI;AAAA,IAEL,CACR;AAGD,IAAAC;AAAA,MACE,MAAM3B,EAAM;AAAA,MACZ,MAAM;;AACJ,YAAIoB,EAAiB,SAAS,GAACC,IAAAN,EAAQ,UAAR,QAAAM,EAAe,SAAQ;AACpD,gBAAMO,IAAS;AAAA,YACb,IAAI5B,EAAM,WAAW,YAAY6B,EAAS9B,CAAS;AAAA,YACnD,MAAMqB,EAAiB;AAAA,YACvB,SAASpB,EAAM;AAAA,UAAA;AAGT,UAAAe,EAAA,QAAQ,CAACa,CAAM,GACvBZ,EAAc,QAAQY;AAAA,QAAA,MACxB,CAAYR,EAAiB,UAC3BJ,EAAc,QAAQ,QACtBD,EAAQ,QAAQ;MAEpB;AAAA,MACA,EAAE,WAAW,GAAK;AAAA,IAAA;AAGpB,mBAAeI,EAAOW,GAAe;AACnC,MAAAjB,EAAU,QAAQ;AAEd,UAAA;AACM,QAAAE,EAAA,QAAQ,MAAMJ,EAAoBmB,CAAK;AAAA,eAExCC,GAAY;AAEnB,YADAhB,EAAQ,QAAQ,IACZgB,KAAA,QAAAA,EAAO;AACT,UAAA7B,EAAK,SAAS6B,CAAK;AAAA;AAEb,gBAAAA;AAAA,MACR,UACA;AACA,QAAAlB,EAAU,QAAQ;AAAA,MACpB;AAAA,IACF;AAEA,mBAAemB,EAAOJ,GAAuB;AAI3C,UAHAZ,EAAc,QAAQY,GAGlB,CAACA,GAAQ;AACX,QAAA1B,EAAK,qBAAqB;AAAA,UACxB,gBAAgB;AAAA,UAChB,kBAAkB;AAAA,UAClB,MAAM;AAAA,UACN,OAAO;AAAA,UACP,aAAa;AAAA,UACb,SAAS;AAAA,QAAA,CACV;AACD;AAAA,MACF;AAGA,UAAI0B,EAAO,GAAG,WAAW7B,CAAS,KAAK6B,EAAO,SAAS;AAChD,QAAA1B,EAAA,qBAAqB0B,EAAO,OAAO;AACxC;AAAA,MACF;AAEI,UAAA;AACF,cAAMK,IAAU,MAAMvB,EAAgBkB,EAAO,EAAE;AAC/C,QAAA1B,EAAK,qBAAqB+B,CAAO;AAAA,eAE1BF,GAAY;AACnB,YAAIA,KAAA,QAAAA,EAAO;AACT,UAAA7B,EAAK,SAAS6B,CAAK;AAAA;AAEb,gBAAAA;AAAA,MAEV;AAAA,IACF;;;;;;;;;;;;;;;;;;;;;;;;;;;"}

package/dist/AddressSelect.vue.d.ts

@@ -111,55 +111,55 @@ export declare interface AddressSelectProps {
 }
 
 declare const _default: __VLS_WithTemplateSlots<DefineComponent<ExtractPropTypes<__VLS_WithDefaults<__VLS_TypePropsToRuntimeProps<AddressSelectProps>, {
-    disabled: boolean;
-    placeholder: string;
-    debounceTime: 1000;
-    modelValue: () => {
-        street_address: undefined;
-        extended_address: undefined;
-        city: undefined;
-        state: undefined;
-        postal_code: undefined;
-        country: undefined;
-    };
-    hintText: undefined;
-    errorText: undefined;
-    label: undefined;
-    preventEmpty: boolean;
-    apiKey: undefined;
+disabled: boolean;
+placeholder: string;
+debounceTime: 1000;
+modelValue: () => {
+street_address: undefined;
+extended_address: undefined;
+city: undefined;
+state: undefined;
+postal_code: undefined;
+country: undefined;
+};
+hintText: undefined;
+errorText: undefined;
+label: undefined;
+preventEmpty: boolean;
+apiKey: undefined;
 }>>, {}, {}, {}, {}, ComponentOptionsMixin, ComponentOptionsMixin, {
-    "update:modelValue": (value: Address) => void;
-    error: (value: unknown) => void;
+"update:modelValue": (value: Address) => void;
+error: (value: unknown) => void;
 }, string, PublicProps, Readonly<ExtractPropTypes<__VLS_WithDefaults<__VLS_TypePropsToRuntimeProps<AddressSelectProps>, {
-    disabled: boolean;
-    placeholder: string;
-    debounceTime: 1000;
-    modelValue: () => {
-        street_address: undefined;
-        extended_address: undefined;
-        city: undefined;
-        state: undefined;
-        postal_code: undefined;
-        country: undefined;
-    };
-    hintText: undefined;
-    errorText: undefined;
-    label: undefined;
-    preventEmpty: boolean;
-    apiKey: undefined;
+disabled: boolean;
+placeholder: string;
+debounceTime: 1000;
+modelValue: () => {
+street_address: undefined;
+extended_address: undefined;
+city: undefined;
+state: undefined;
+postal_code: undefined;
+country: undefined;
+};
+hintText: undefined;
+errorText: undefined;
+label: undefined;
+preventEmpty: boolean;
+apiKey: undefined;
 }>>> & Readonly<{
-    onError?: ((value: unknown) => any) | undefined;
-    "onUpdate:modelValue"?: ((value: Address) => any) | undefined;
+onError?: ((value: unknown) => any) | undefined;
+"onUpdate:modelValue"?: ((value: Address) => any) | undefined;
 }>, {
-    disabled: boolean;
-    label: string;
-    errorText: string;
-    hintText: string;
-    placeholder: string;
-    preventEmpty: boolean;
-    modelValue: Address;
-    apiKey: string;
-    debounceTime: number;
+disabled: boolean;
+label: string;
+errorText: string;
+hintText: string;
+placeholder: string;
+preventEmpty: boolean;
+modelValue: Address;
+apiKey: string;
+debounceTime: number;
 }, {}, {}, {}, string, ComponentProvideOptions, true, {}, any>, {
     hint?(_: {}): any;
 }>;