@leaflink/stash 49.5.0 → 50.0.0

package/dist/ChevronToggle.js

@@ -1,13 +1,5 @@
-import { _ as o } from "./ChevronToggle.vue_vue_type_script_setup_true_lang-fcdf0c19.js";
-import "vue";
-import "./Button.js";
-import "./Icon.js";
-import "lodash-es/uniqueId";
-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 "./Button.vue_used_vue_type_style_index_0_lang.module-4dabc2a9.js";
+import { _ as f } from "./ChevronToggle.vue_vue_type_script_setup_true_lang-DuvluoTi.js";
 export {
-  o as default
+  f as default
 };
 //# sourceMappingURL=ChevronToggle.js.map

package/dist/ChevronToggle.js.map

@@ -1 +1 @@
-{"version":3,"file":"ChevronToggle.js","sources":[],"sourcesContent":[],"names":[],"mappings":";;;;;;;;;"}
+{"version":3,"file":"ChevronToggle.js","sources":[],"sourcesContent":[],"names":[],"mappings":";"}

package/dist/ChevronToggle.vue.d.ts

@@ -40,15 +40,15 @@ export declare interface ChevronToggleProps {
 }
 
 declare const _default: DefineComponent<ExtractPropTypes<__VLS_WithDefaults<__VLS_TypePropsToRuntimeProps<ChevronToggleProps>, {
-    direction: string;
+direction: string;
 }>>, {}, {}, {}, {}, ComponentOptionsMixin, ComponentOptionsMixin, {
-    click: () => void;
+click: () => void;
 }, string, PublicProps, Readonly<ExtractPropTypes<__VLS_WithDefaults<__VLS_TypePropsToRuntimeProps<ChevronToggleProps>, {
-    direction: string;
+direction: string;
 }>>> & Readonly<{
-    onClick?: (() => any) | undefined;
+onClick?: (() => any) | undefined;
 }>, {
-    direction: "left" | "right" | "up" | "down";
+direction: "left" | "right" | "up" | "down";
 }, {}, {}, {}, string, ComponentProvideOptions, true, {}, any>;
 export default _default;
 

package/dist/{ChevronToggle.vue_vue_type_script_setup_true_lang-fcdf0c19.js → ChevronToggle.vue_vue_type_script_setup_true_lang-DuvluoTi.js}

@@ -28,4 +28,4 @@ const k = /* @__PURE__ */ a({
 export {
   k as _
 };
-//# sourceMappingURL=ChevronToggle.vue_vue_type_script_setup_true_lang-fcdf0c19.js.map
+//# sourceMappingURL=ChevronToggle.vue_vue_type_script_setup_true_lang-DuvluoTi.js.map

package/dist/{ChevronToggle.vue_vue_type_script_setup_true_lang-fcdf0c19.js.map → ChevronToggle.vue_vue_type_script_setup_true_lang-DuvluoTi.js.map}

@@ -1 +1 @@
-{"version":3,"file":"ChevronToggle.vue_vue_type_script_setup_true_lang-fcdf0c19.js","sources":["../src/components/ChevronToggle/ChevronToggle.vue"],"sourcesContent":["<script setup lang=\"ts\">\n  import { computed } from 'vue';\n\n  import Button from '../Button/Button.vue';\n  import { IconName } from '../Icon/Icon.types';\n  import Icon from '../Icon/Icon.vue';\n\n  enum ChevronToggleDirections {\n    Up = 'up',\n    Down = 'down',\n    Left = 'left',\n    Right = 'right',\n  }\n\n  export type ChevronToggleDirection = `${ChevronToggleDirections}`;\n\n  export interface ChevronToggleProps {\n    direction?: ChevronToggleDirection;\n  }\n\n  const props = withDefaults(defineProps<ChevronToggleProps>(), {\n    direction: 'down',\n  });\n\n  const emit = defineEmits<{ (e: 'click'): void }>();\n\n  const icon = computed<IconName>(() => `chevron-${props.direction}`);\n</script>\n\n<template>\n  <Button class=\"stash-chevron-toggle\" icon data-test=\"stash-chevron-toggle\" @click=\"emit('click')\">\n    <Icon :name=\"icon\" :data-test=\"`icon|${icon}`\" />\n  </Button>\n</template>\n"],"names":["props","__props","emit","__emit","icon","computed"],"mappings":";;;;;;;;;;AAoBE,UAAMA,IAAQC,GAIRC,IAAOC,GAEPC,IAAOC,EAAmB,MAAM,WAAWL,EAAM,WAAW;;;;;;;;;;;;;;;;;"}
+{"version":3,"file":"ChevronToggle.vue_vue_type_script_setup_true_lang-DuvluoTi.js","sources":["../src/components/ChevronToggle/ChevronToggle.vue"],"sourcesContent":["<script setup lang=\"ts\">\n  import { computed } from 'vue';\n\n  import Button from '../Button/Button.vue';\n  import { IconName } from '../Icon/Icon.types';\n  import Icon from '../Icon/Icon.vue';\n\n  enum ChevronToggleDirections {\n    Up = 'up',\n    Down = 'down',\n    Left = 'left',\n    Right = 'right',\n  }\n\n  export type ChevronToggleDirection = `${ChevronToggleDirections}`;\n\n  export interface ChevronToggleProps {\n    direction?: ChevronToggleDirection;\n  }\n\n  const props = withDefaults(defineProps<ChevronToggleProps>(), {\n    direction: 'down',\n  });\n\n  const emit = defineEmits<{ (e: 'click'): void }>();\n\n  const icon = computed<IconName>(() => `chevron-${props.direction}`);\n</script>\n\n<template>\n  <Button class=\"stash-chevron-toggle\" icon data-test=\"stash-chevron-toggle\" @click=\"emit('click')\">\n    <Icon :name=\"icon\" :data-test=\"`icon|${icon}`\" />\n  </Button>\n</template>\n"],"names":["props","__props","emit","__emit","icon","computed"],"mappings":";;;;;;;;;;AAoBE,UAAMA,IAAQC,GAIRC,IAAOC,GAEPC,IAAOC,EAAmB,MAAM,WAAWL,EAAM,SAAS,EAAE;;;;;;;;;;;;;;;;;"}

package/dist/Chip.js

@@ -1,10 +1,7 @@
-import { defineComponent as f, useCssModule as b, openBlock as a, createElementBlock as d, normalizeClass as n, unref as i, renderSlot as m, withKeys as v, withModifiers as u, createVNode as _, createCommentVNode as w } from "vue";
+import { defineComponent as f, useCssModule as b, openBlock as r, createElementBlock as d, normalizeClass as n, unref as a, renderSlot as u, withKeys as v, withModifiers as m, createVNode as _, createCommentVNode as w } from "vue";
 import C from "./utils/colorScheme.js";
 import y from "./Icon.js";
-import { _ as $ } 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 { _ as $ } from "./_plugin-vue_export-helper-CHgC5LLL.js";
 const z = ["disabled"], k = /* @__PURE__ */ f({
   name: "ll-chip",
   __name: "Chip",
@@ -21,7 +18,7 @@ const z = ["disabled"], k = /* @__PURE__ */ f({
   },
   emits: ["click", "remove"],
   setup(c, { emit: p }) {
-    const e = c, r = p, s = b();
+    const e = c, i = p, s = b();
     function h() {
       const { computedBgColor: o, computedTextColor: t } = C({
         shade: e.shade,
@@ -35,33 +32,33 @@ const z = ["disabled"], k = /* @__PURE__ */ f({
         "tw-bg-ice-500 tw-text-white": e.disabled
       };
     }
-    return (o, t) => (a(), d("span", {
+    return (o, t) => (r(), d("span", {
       class: n(["stash-chip tw-relative tw-inline-flex tw-items-center", [
         `stash-chip--radius-${e.radius}`,
         `stash-chip--size-${e.size}`,
         `stash-chip--shade-${e.shade}`,
-        i(s).root,
-        i(s).removableChip,
-        i(s)[`size-${e.size}`],
+        a(s).root,
+        a(s).removableChip,
+        a(s)[`size-${e.size}`],
         h()
       ]]),
       "data-test": "stash-chip",
-      onClick: t[2] || (t[2] = (l) => r("click"))
+      onClick: t[2] || (t[2] = (l) => i("click"))
     }, [
-      o.isRemovable ? (a(), d("span", {
+      o.isRemovable ? (r(), d("span", {
         key: 0,
         class: n([{ "tw-mr-6 tw-truncate": e.isRemovable }])
       }, [
-        m(o.$slots, "default")
-      ], 2)) : m(o.$slots, "default", { key: 1 }),
-      e.isRemovable ? (a(), d("button", {
+        u(o.$slots, "default")
+      ], 2)) : u(o.$slots, "default", { key: 1 }),
+      e.isRemovable ? (r(), d("button", {
         key: 2,
         tabindex: "-1",
-        class: n(["stash-chip__remove-button", ["tw-absolute", i(s)["remove-button"]]]),
+        class: n(["stash-chip__remove-button", ["tw-absolute", a(s)["remove-button"]]]),
         "data-test": "stash-chip|remove-button",
         disabled: e.disabled,
-        onKeypress: t[0] || (t[0] = v(u((l) => r("remove"), ["prevent"]), ["enter"])),
-        onMousedown: t[1] || (t[1] = u((l) => r("remove"), ["prevent", "stop"]))
+        onKeypress: t[0] || (t[0] = v(m((l) => i("remove"), ["prevent"]), ["enter"])),
+        onMousedown: t[1] || (t[1] = m((l) => i("remove"), ["prevent", "stop"]))
       }, [
         _(y, {
           "data-test": "icon|close",
@@ -78,8 +75,8 @@ const z = ["disabled"], k = /* @__PURE__ */ f({
   "remove-button": "_remove-button_1u8h2_22"
 }, B = {
   $style: g
-}, E = /* @__PURE__ */ $(k, [["__cssModules", B]]);
+}, N = /* @__PURE__ */ $(k, [["__cssModules", B]]);
 export {
-  E as default
+  N as default
 };
 //# sourceMappingURL=Chip.js.map

package/dist/Chip.js.map

@@ -1 +1 @@
-{"version":3,"file":"Chip.js","sources":["../src/components/Chip/Chip.vue"],"sourcesContent":["<script setup lang=\"ts\">\n  import { useCssModule } from 'vue';\n\n  import { StashCommonColor, StashPrimaryColorGroup } from '../../../types/colors';\n  import colorSchemeUtil from '../../utils/colorScheme';\n  import Icon from '../Icon/Icon.vue';\n\n  defineOptions({\n    name: 'll-chip',\n  });\n\n  export interface ChipProps {\n    /**\n     * The color for the chip that determines both the text and bg color. Needs to\n     * be one of the brand colors in our design system (not a shade).\n     */\n    colorScheme?: StashPrimaryColorGroup;\n\n    /**\n     * The shade of the provided color to use for the background color. This effects the inferred\n     * text color unless a specific text color is provided. Currently only `light` and `main`\n     * shades are supported. `dark` may be added in the future.\n     */\n    shade?: 'light' | 'main';\n\n    /**\n     * The size of the chip.\n     */\n    size?: 'small' | 'medium';\n\n    /**\n     * The type of border radius to use.\n     */\n    radius?: 'none' | 'standard' | 'pill';\n\n    /**\n     * The background color of the chip. Needs to be one of our design system colors.\n     */\n    bgColor?: StashCommonColor;\n\n    /**\n     * The color of the chip text. Needs to be one of our design system colors.\n     */\n    textColor?: StashCommonColor;\n\n    /**\n     * Determines if a close icon is surfaced.\n     */\n    isRemovable?: boolean;\n\n    /**\n     * Determines if background and text color in Chip should be overidden.\n     */\n    shouldOverrideColors?: boolean;\n\n    /**\n     * Determines if the chip is disabled.\n     */\n    disabled?: boolean;\n  }\n\n  const props = withDefaults(defineProps<ChipProps>(), {\n    size: 'medium',\n    radius: 'standard',\n    colorScheme: 'ice',\n    shade: 'light',\n    bgColor: undefined,\n    textColor: undefined,\n    isRemovable: false,\n    shouldOverrideColors: false,\n    disabled: false,\n  });\n\n  const emit = defineEmits<{\n    /**\n     * Fires on click of the chip.\n     */\n    (e: 'click'): void;\n    /**\n     * If `is-removable` is true, fires on click of the close button.\n     */\n    (e: 'remove'): void;\n  }>();\n\n  const classes = useCssModule();\n\n  function determineConditionalStyles() {\n    const { computedBgColor, computedTextColor } = colorSchemeUtil({\n      shade: props.shade,\n      color: props.colorScheme,\n    });\n\n    const colorStyles = `tw-text-${props.textColor || computedTextColor} tw-bg-${props.bgColor || computedBgColor}`;\n\n    return {\n      'tw-rounded-none': props.radius === 'none',\n      'tw-rounded-sm': props.radius === 'standard',\n      'tw-rounded-full': props.radius === 'pill',\n      [colorStyles]: !props.shouldOverrideColors && !props.disabled,\n      'tw-bg-ice-500 tw-text-white': props.disabled,\n    };\n  }\n</script>\n\n<template>\n  <span\n    class=\"stash-chip tw-relative tw-inline-flex tw-items-center\"\n    :class=\"[\n      `stash-chip--radius-${props.radius}`,\n      `stash-chip--size-${props.size}`,\n      `stash-chip--shade-${props.shade}`,\n      classes.root,\n      classes.removableChip,\n      classes[`size-${props.size}`],\n      determineConditionalStyles(),\n    ]\"\n    data-test=\"stash-chip\"\n    @click=\"emit('click')\"\n  >\n    <span v-if=\"isRemovable\" :class=\"[{ 'tw-mr-6 tw-truncate': props.isRemovable }]\">\n      <!-- @slot Chip text -->\n      <slot></slot>\n    </span>\n\n    <!-- Allows easier testing and DOM quering when the chip text isn't nested in an inner span -->\n    <!-- @slot Chip text -->\n    <slot v-else></slot>\n\n    <button\n      v-if=\"props.isRemovable\"\n      tabindex=\"-1\"\n      class=\"stash-chip__remove-button\"\n      :class=\"['tw-absolute', classes['remove-button']]\"\n      data-test=\"stash-chip|remove-button\"\n      :disabled=\"props.disabled\"\n      @keypress.enter.prevent=\"emit('remove')\"\n      @mousedown.prevent.stop=\"emit('remove')\"\n    >\n      <Icon data-test=\"icon|close\" name=\"close\" size=\"small\" />\n    </button>\n  </span>\n</template>\n\n<style module>\n  .root {\n    /**\n     * Applying these styles this way because the rule of thumb is that tailwind classes should\n     * always end up taking precedence, so we're converted these specific styles to be generated\n     * in a custom class instead, giving `FilterChip` (which wraps `Chip`) the ability to easily\n     * override them.\n     */\n    @apply tw-leading-none tw-font-semibold tw-uppercase tw-text-[10px];\n  }\n\n  .size-medium {\n    height: 20px;\n    padding: 2px 8px 0 8px;\n  }\n\n  .size-small {\n    height: 16px;\n    padding: 2px 8px 0 8px;\n  }\n\n  .remove-button {\n    border-radius: inherit;\n    border-top-left-radius: 0;\n    border-bottom-left-radius: 0;\n    height: inherit;\n    margin-top: -2px; /* used to offset 2px top padding from .size-medium and size-small */\n    padding: 0 4px;\n    right: 0;\n  }\n\n  .remove-button:not(:disabled):hover {\n    background: rgb(0 0 0 / 10%);\n  }\n</style>\n"],"names":["props","__props","emit","__emit","classes","useCssModule","determineConditionalStyles","computedBgColor","computedTextColor","colorSchemeUtil","colorStyles"],"mappings":";;;;;;;;;;;;;;;;;;;;;;;AA6DE,UAAMA,IAAQC,GAYRC,IAAOC,GAWPC,IAAUC;AAEhB,aAASC,IAA6B;AACpC,YAAM,EAAE,iBAAAC,GAAiB,mBAAAC,EAAkB,IAAIC,EAAgB;AAAA,QAC7D,OAAOT,EAAM;AAAA,QACb,OAAOA,EAAM;AAAA,MAAA,CACd,GAEKU,IAAc,WAAWV,EAAM,aAAaQ,WAA2BR,EAAM,WAAWO;AAEvF,aAAA;AAAA,QACL,mBAAmBP,EAAM,WAAW;AAAA,QACpC,iBAAiBA,EAAM,WAAW;AAAA,QAClC,mBAAmBA,EAAM,WAAW;AAAA,QACpC,CAACU,CAAW,GAAG,CAACV,EAAM,wBAAwB,CAACA,EAAM;AAAA,QACrD,+BAA+BA,EAAM;AAAA,MAAA;AAAA,IAEzC;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;"}
+{"version":3,"file":"Chip.js","sources":["../src/components/Chip/Chip.vue"],"sourcesContent":["<script setup lang=\"ts\">\n  import { useCssModule } from 'vue';\n\n  import { StashCommonColor, StashPrimaryColorGroup } from '../../../types/colors';\n  import colorSchemeUtil from '../../utils/colorScheme';\n  import Icon from '../Icon/Icon.vue';\n\n  defineOptions({\n    name: 'll-chip',\n  });\n\n  export interface ChipProps {\n    /**\n     * The color for the chip that determines both the text and bg color. Needs to\n     * be one of the brand colors in our design system (not a shade).\n     */\n    colorScheme?: StashPrimaryColorGroup;\n\n    /**\n     * The shade of the provided color to use for the background color. This effects the inferred\n     * text color unless a specific text color is provided. Currently only `light` and `main`\n     * shades are supported. `dark` may be added in the future.\n     */\n    shade?: 'light' | 'main';\n\n    /**\n     * The size of the chip.\n     */\n    size?: 'small' | 'medium';\n\n    /**\n     * The type of border radius to use.\n     */\n    radius?: 'none' | 'standard' | 'pill';\n\n    /**\n     * The background color of the chip. Needs to be one of our design system colors.\n     */\n    bgColor?: StashCommonColor;\n\n    /**\n     * The color of the chip text. Needs to be one of our design system colors.\n     */\n    textColor?: StashCommonColor;\n\n    /**\n     * Determines if a close icon is surfaced.\n     */\n    isRemovable?: boolean;\n\n    /**\n     * Determines if background and text color in Chip should be overidden.\n     */\n    shouldOverrideColors?: boolean;\n\n    /**\n     * Determines if the chip is disabled.\n     */\n    disabled?: boolean;\n  }\n\n  const props = withDefaults(defineProps<ChipProps>(), {\n    size: 'medium',\n    radius: 'standard',\n    colorScheme: 'ice',\n    shade: 'light',\n    bgColor: undefined,\n    textColor: undefined,\n    isRemovable: false,\n    shouldOverrideColors: false,\n    disabled: false,\n  });\n\n  const emit = defineEmits<{\n    /**\n     * Fires on click of the chip.\n     */\n    (e: 'click'): void;\n    /**\n     * If `is-removable` is true, fires on click of the close button.\n     */\n    (e: 'remove'): void;\n  }>();\n\n  const classes = useCssModule();\n\n  function determineConditionalStyles() {\n    const { computedBgColor, computedTextColor } = colorSchemeUtil({\n      shade: props.shade,\n      color: props.colorScheme,\n    });\n\n    const colorStyles = `tw-text-${props.textColor || computedTextColor} tw-bg-${props.bgColor || computedBgColor}`;\n\n    return {\n      'tw-rounded-none': props.radius === 'none',\n      'tw-rounded-sm': props.radius === 'standard',\n      'tw-rounded-full': props.radius === 'pill',\n      [colorStyles]: !props.shouldOverrideColors && !props.disabled,\n      'tw-bg-ice-500 tw-text-white': props.disabled,\n    };\n  }\n</script>\n\n<template>\n  <span\n    class=\"stash-chip tw-relative tw-inline-flex tw-items-center\"\n    :class=\"[\n      `stash-chip--radius-${props.radius}`,\n      `stash-chip--size-${props.size}`,\n      `stash-chip--shade-${props.shade}`,\n      classes.root,\n      classes.removableChip,\n      classes[`size-${props.size}`],\n      determineConditionalStyles(),\n    ]\"\n    data-test=\"stash-chip\"\n    @click=\"emit('click')\"\n  >\n    <span v-if=\"isRemovable\" :class=\"[{ 'tw-mr-6 tw-truncate': props.isRemovable }]\">\n      <!-- @slot Chip text -->\n      <slot></slot>\n    </span>\n\n    <!-- Allows easier testing and DOM quering when the chip text isn't nested in an inner span -->\n    <!-- @slot Chip text -->\n    <slot v-else></slot>\n\n    <button\n      v-if=\"props.isRemovable\"\n      tabindex=\"-1\"\n      class=\"stash-chip__remove-button\"\n      :class=\"['tw-absolute', classes['remove-button']]\"\n      data-test=\"stash-chip|remove-button\"\n      :disabled=\"props.disabled\"\n      @keypress.enter.prevent=\"emit('remove')\"\n      @mousedown.prevent.stop=\"emit('remove')\"\n    >\n      <Icon data-test=\"icon|close\" name=\"close\" size=\"small\" />\n    </button>\n  </span>\n</template>\n\n<style module>\n  .root {\n    /**\n     * Applying these styles this way because the rule of thumb is that tailwind classes should\n     * always end up taking precedence, so we're converted these specific styles to be generated\n     * in a custom class instead, giving `FilterChip` (which wraps `Chip`) the ability to easily\n     * override them.\n     */\n    @apply tw-leading-none tw-font-semibold tw-uppercase tw-text-[10px];\n  }\n\n  .size-medium {\n    height: 20px;\n    padding: 2px 8px 0 8px;\n  }\n\n  .size-small {\n    height: 16px;\n    padding: 2px 8px 0 8px;\n  }\n\n  .remove-button {\n    border-radius: inherit;\n    border-top-left-radius: 0;\n    border-bottom-left-radius: 0;\n    height: inherit;\n    margin-top: -2px; /* used to offset 2px top padding from .size-medium and size-small */\n    padding: 0 4px;\n    right: 0;\n  }\n\n  .remove-button:not(:disabled):hover {\n    background: rgb(0 0 0 / 10%);\n  }\n</style>\n"],"names":["props","__props","emit","__emit","classes","useCssModule","determineConditionalStyles","computedBgColor","computedTextColor","colorSchemeUtil","colorStyles"],"mappings":";;;;;;;;;;;;;;;;;;;;AA6DE,UAAMA,IAAQC,GAYRC,IAAOC,GAWPC,IAAUC;AAEhB,aAASC,IAA6B;AACpC,YAAM,EAAE,iBAAAC,GAAiB,mBAAAC,EAAkB,IAAIC,EAAgB;AAAA,QAC7D,OAAOT,EAAM;AAAA,QACb,OAAOA,EAAM;AAAA,MAAA,CACd,GAEKU,IAAc,WAAWV,EAAM,aAAaQ,CAAiB,UAAUR,EAAM,WAAWO,CAAe;AAEtG,aAAA;AAAA,QACL,mBAAmBP,EAAM,WAAW;AAAA,QACpC,iBAAiBA,EAAM,WAAW;AAAA,QAClC,mBAAmBA,EAAM,WAAW;AAAA,QACpC,CAACU,CAAW,GAAG,CAACV,EAAM,wBAAwB,CAACA,EAAM;AAAA,QACrD,+BAA+BA,EAAM;AAAA,MAAA;AAAA,IAEzC;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;"}

package/dist/Chip.vue.d.ts

@@ -75,41 +75,41 @@ export declare interface ChipProps {
 }
 
 declare const _default: __VLS_WithTemplateSlots<DefineComponent<ExtractPropTypes<__VLS_WithDefaults<__VLS_TypePropsToRuntimeProps<ChipProps>, {
-    size: string;
-    radius: string;
-    colorScheme: string;
-    shade: string;
-    bgColor: undefined;
-    textColor: undefined;
-    isRemovable: boolean;
-    shouldOverrideColors: boolean;
-    disabled: boolean;
+size: string;
+radius: string;
+colorScheme: string;
+shade: string;
+bgColor: undefined;
+textColor: undefined;
+isRemovable: boolean;
+shouldOverrideColors: boolean;
+disabled: boolean;
 }>>, {}, {}, {}, {}, ComponentOptionsMixin, ComponentOptionsMixin, {
-    click: () => void;
-    remove: () => void;
+click: () => void;
+remove: () => void;
 }, string, PublicProps, Readonly<ExtractPropTypes<__VLS_WithDefaults<__VLS_TypePropsToRuntimeProps<ChipProps>, {
-    size: string;
-    radius: string;
-    colorScheme: string;
-    shade: string;
-    bgColor: undefined;
-    textColor: undefined;
-    isRemovable: boolean;
-    shouldOverrideColors: boolean;
-    disabled: boolean;
+size: string;
+radius: string;
+colorScheme: string;
+shade: string;
+bgColor: undefined;
+textColor: undefined;
+isRemovable: boolean;
+shouldOverrideColors: boolean;
+disabled: boolean;
 }>>> & Readonly<{
-    onClick?: (() => any) | undefined;
-    onRemove?: (() => any) | undefined;
+onClick?: (() => any) | undefined;
+onRemove?: (() => any) | undefined;
 }>, {
-    disabled: boolean;
-    size: "small" | "medium";
-    shade: "main" | "light";
-    colorScheme: StashPrimaryColorGroup;
-    radius: "standard" | "none" | "pill";
-    bgColor: "ice-700" | "purple-700" | "purple-500" | "purple-100" | "royal-700" | "royal-500" | "royal-100" | "blue-700" | "blue-500" | "blue-100" | "teal-700" | "teal-500" | "teal-100" | "green-700" | "green-500" | "green-100" | "seafoam-700" | "seafoam-500" | "seafoam-100" | "yellow-700" | "yellow-500" | "yellow-100" | "orange-700" | "orange-500" | "orange-100" | "red-700" | "red-500" | "red-100" | "ice-500" | "ice-200" | "ice-100" | "white" | "black";
-    textColor: "ice-700" | "purple-700" | "purple-500" | "purple-100" | "royal-700" | "royal-500" | "royal-100" | "blue-700" | "blue-500" | "blue-100" | "teal-700" | "teal-500" | "teal-100" | "green-700" | "green-500" | "green-100" | "seafoam-700" | "seafoam-500" | "seafoam-100" | "yellow-700" | "yellow-500" | "yellow-100" | "orange-700" | "orange-500" | "orange-100" | "red-700" | "red-500" | "red-100" | "ice-500" | "ice-200" | "ice-100" | "white" | "black";
-    isRemovable: boolean;
-    shouldOverrideColors: boolean;
+disabled: boolean;
+size: "small" | "medium";
+shade: "main" | "light";
+colorScheme: StashPrimaryColorGroup;
+radius: "standard" | "none" | "pill";
+bgColor: "ice-700" | "purple-700" | "purple-500" | "purple-100" | "royal-700" | "royal-500" | "royal-100" | "blue-700" | "blue-500" | "blue-100" | "teal-700" | "teal-500" | "teal-100" | "green-700" | "green-500" | "green-100" | "seafoam-700" | "seafoam-500" | "seafoam-100" | "yellow-700" | "yellow-500" | "yellow-100" | "orange-700" | "orange-500" | "orange-100" | "red-700" | "red-500" | "red-100" | "ice-500" | "ice-200" | "ice-100" | "white" | "black";
+textColor: "ice-700" | "purple-700" | "purple-500" | "purple-100" | "royal-700" | "royal-500" | "royal-100" | "blue-700" | "blue-500" | "blue-100" | "teal-700" | "teal-500" | "teal-100" | "green-700" | "green-500" | "green-100" | "seafoam-700" | "seafoam-500" | "seafoam-100" | "yellow-700" | "yellow-500" | "yellow-100" | "orange-700" | "orange-500" | "orange-100" | "red-700" | "red-500" | "red-100" | "ice-500" | "ice-200" | "ice-100" | "white" | "black";
+isRemovable: boolean;
+shouldOverrideColors: boolean;
 }, {}, {}, {}, string, ComponentProvideOptions, true, {}, any>, {
     default?(_: {}): any;
 }>;
@@ -150,7 +150,7 @@ declare enum StashCommonColors {
     Red100 = "red-100",
     Ice700 = "ice-700",
     Ice500 = "ice-500",
-    Ice200 = "ice-200",
+    Ice200 = "ice-200",// This is the one outlier, but it's used purposefully in a few places
     Ice100 = "ice-100",
     White = "white",
     Black = "black"

package/dist/ConfirmationCodeInput.js

@@ -1,5 +1,5 @@
 import { defineComponent as I, useCssVars as v, useCssModule as E, ref as V, onMounted as B, watch as P, openBlock as a, createElementBlock as r, normalizeClass as x, unref as l, createElementVNode as z, Fragment as A, renderList as M, toDisplayString as p, createCommentVNode as f } from "vue";
-import { _ as F } from "./_plugin-vue_export-helper-dad06003.js";
+import { _ as F } from "./_plugin-vue_export-helper-CHgC5LLL.js";
 const K = { class: "tw-mb-3 tw-flex tw-gap-6" }, S = ["value", "onInput"], U = {
   key: 0,
   class: "tw-mt-1 tw-block tw-whitespace-pre-line tw-pr-6 tw-text-center tw-text-red-500",

package/dist/ConfirmationCodeInput.js.map

@@ -1 +1 @@
-{"version":3,"file":"ConfirmationCodeInput.js","sources":["../src/components/ConfirmationCodeInput/ConfirmationCodeInput.vue"],"sourcesContent":["<script setup lang=\"ts\">\n  import { onMounted, Ref, ref, useCssModule, watch } from 'vue';\n\n  const classes = useCssModule();\n\n  export interface VerificationCodeInputProps {\n    digitCount?: number;\n    /**\n     * Error text to display.\n     */\n    errorText?: string;\n    /**\n     * Success text to display.\n     */\n    successText?: string;\n    /**\n     * Hint text to display.\n     */\n    hintText?: string;\n    /**\n     * One time password/code\n     */\n    modelValue?: string;\n  }\n\n  const props = withDefaults(defineProps<VerificationCodeInputProps>(), {\n    digitCount: 6,\n    errorText: undefined,\n    successText: undefined,\n    hintText: undefined,\n    modelValue: undefined,\n  });\n\n  const emit = defineEmits<{\n    (e: 'update:model-value', value: string | null): void;\n    (e: 'change', params: { originalEvent: Event; value: string | null }): void;\n    (e: 'focus', params: Event): void;\n    (e: 'blur', params: Event): void;\n  }>();\n\n  const data: Ref<Array<string>> = ref([]);\n\n  onMounted(() => {\n    if (props.modelValue) {\n      data.value = props.modelValue?.split('');\n    }\n  });\n\n  function handleInput(event: InputEvent, index) {\n    data.value[index] = event.target?.['value'];\n    updateModel(event);\n\n    if (event.inputType === 'deleteContentBackward') {\n      moveToPrev(event);\n    } else if (event.inputType === 'insertText' || event.inputType === 'deleteContentForward') {\n      moveToNext(event);\n    }\n  }\n\n  function updateModel(event: Event) {\n    const newValue = data.value.join('');\n    emit('update:model-value', newValue);\n    emit('change', { originalEvent: event, value: newValue });\n  }\n\n  function moveToPrev(event: InputEvent | KeyboardEvent) {\n    const prevInput: HTMLInputElement = findPrevInput(event.target as HTMLInputElement);\n\n    if (prevInput) {\n      prevInput.focus();\n      prevInput.select();\n    }\n  }\n\n  function moveToNext(event: InputEvent | KeyboardEvent) {\n    const nextInput: HTMLInputElement = findNextInput(event.target as HTMLInputElement);\n\n    if (nextInput) {\n      nextInput.focus();\n      nextInput.select();\n    }\n  }\n\n  function findPrevInput(element: HTMLInputElement) {\n    const prevElement = element.previousElementSibling;\n\n    if (!prevElement) return;\n\n    return prevElement.nodeName === 'INPUT' ? prevElement : findPrevInput(prevElement as HTMLInputElement);\n  }\n\n  function findNextInput(element: HTMLInputElement) {\n    const nextElement = element.nextElementSibling;\n\n    if (!nextElement) return;\n\n    return nextElement.nodeName === 'INPUT' ? nextElement : findNextInput(nextElement as HTMLInputElement);\n  }\n\n  function handleFocus(event) {\n    event.target.select();\n    emit('focus', event);\n  }\n\n  function handleBlur(event: Event) {\n    emit('blur', event);\n  }\n\n  function handleKeyDown(event: KeyboardEvent) {\n    if (event.ctrlKey || event.metaKey) {\n      return;\n    }\n\n    switch (event.code) {\n      case 'ArrowLeft':\n        moveToPrev(event);\n        event.preventDefault();\n        break;\n\n      case 'ArrowUp':\n      case 'ArrowDown':\n        event.preventDefault();\n        break;\n\n      case 'Backspace':\n        if (event.target?.['value'].length === 0) {\n          moveToPrev(event);\n          event.preventDefault();\n        }\n        break;\n\n      case 'ArrowRight':\n        moveToNext(event);\n        event.preventDefault();\n\n        break;\n\n      case 'Enter':\n      case 'NumpadEnter':\n      case 'Tab':\n        break;\n\n      default:\n        if (\n          !(event.code !== 'Space' && Number(event.key) >= 0 && Number(event.key) <= 9) ||\n          (data.value.join('').length >= props.digitCount && event.code !== 'Delete')\n        ) {\n          event.preventDefault();\n        }\n\n        break;\n    }\n  }\n\n  function handlePaste(event: ClipboardEvent) {\n    const paste = event.clipboardData?.getData('text');\n\n    if (paste?.length) {\n      const pastedCode = paste?.substring(0, props.digitCount);\n\n      const parsed = parseInt(pastedCode);\n\n      if (!isNaN(parsed)) {\n        data.value = pastedCode.split('');\n        updateModel(event);\n      }\n    }\n\n    event.preventDefault();\n  }\n\n  watch(\n    () => props.modelValue,\n    (newValue) => {\n      data.value = newValue ? newValue.split('') : new Array(props.digitCount);\n    },\n  );\n</script>\n\n<template>\n  <div\n    class=\"stash-confirmation-code-input tw-inline-block\"\n    data-test=\"stash-confirmation-code-input\"\n    :class=\"[classes['stash-confirmation-code-input-container']]\"\n  >\n    <div class=\"tw-mb-3 tw-flex tw-gap-6\">\n      <template v-for=\"field in props.digitCount\" :key=\"field\">\n        <input\n          data-test=\"stash-confirmation-code-input__otp\"\n          class=\"tw-border tw-bg-white tw-p-2 tw-text-center tw-text-base tw-font-medium tw-text-ice-900 focus:tw-border-blue-500\"\n          :class=\"[\n            classes['otp-code-input'],\n            { [classes['has-error']]: !!props.errorText },\n            { [classes['has-success']]: !!props.successText },\n          ]\"\n          type=\"text\"\n          inputmode=\"numeric\"\n          maxlength=\"1\"\n          :value=\"data[field - 1]\"\n          pattern=\"[0-9]\"\n          autocomplete=\"one-time-code\"\n          @input=\"handleInput($event as InputEvent, field - 1)\"\n          @keydown=\"handleKeyDown\"\n          @paste=\"handlePaste\"\n          @focus=\"handleFocus\"\n          @blur=\"handleBlur\"\n        />\n      </template>\n    </div>\n    <small\n      v-if=\"props.errorText\"\n      class=\"tw-mt-1 tw-block tw-whitespace-pre-line tw-pr-6 tw-text-center tw-text-red-500\"\n      data-test=\"field-error\"\n    >\n      {{ props.errorText }}\n    </small>\n    <small\n      v-if=\"props.successText\"\n      class=\"tw-mt-1 tw-block tw-whitespace-pre-line tw-pr-6 tw-text-center tw-text-green-500\"\n      data-test=\"field-success\"\n    >\n      {{ props.successText }}\n    </small>\n    <small\n      v-if=\"props.hintText\"\n      class=\"tw-mt-1 tw-block tw-whitespace-pre-line tw-pr-6 tw-text-center tw-text-ice-700\"\n      data-test=\"field-hint\"\n    >\n      {{ props.hintText }}\n    </small>\n  </div>\n</template>\n\n<style module>\n  .stash-confirmation-code-input-container {\n    --otp-digits: v-bind(digitCount);\n    --otp-container-width: calc(var(--otp-digits) * 60px);\n\n    width: var(--otp-container-width);\n  }\n\n  .otp-code-input {\n    border-radius: 4px;\n    caret-color: transparent;\n    height: 36px;\n    width: 36px;\n  }\n\n  .otp-code-input.has-error:not(:focus) {\n    border-color: var(--color-red-500);\n  }\n\n  .otp-code-input.has-success:not(:focus) {\n    border-color: var(--color-green-500);\n  }\n\n  .otp-code-input:focus {\n    box-shadow: 0 0 0 3px rgb(0 114 240 / 15%);\n    outline: none;\n  }\n</style>\n"],"names":["classes","useCssModule","props","__props","emit","__emit","data","ref","onMounted","_a","handleInput","event","index","updateModel","moveToPrev","moveToNext","newValue","prevInput","findPrevInput","nextInput","findNextInput","element","prevElement","nextElement","handleFocus","handleBlur","handleKeyDown","handlePaste","paste","pastedCode","parsed","watch"],"mappings":"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"}
+{"version":3,"file":"ConfirmationCodeInput.js","sources":["../src/components/ConfirmationCodeInput/ConfirmationCodeInput.vue"],"sourcesContent":["<script setup lang=\"ts\">\n  import { onMounted, Ref, ref, useCssModule, watch } from 'vue';\n\n  const classes = useCssModule();\n\n  export interface VerificationCodeInputProps {\n    digitCount?: number;\n    /**\n     * Error text to display.\n     */\n    errorText?: string;\n    /**\n     * Success text to display.\n     */\n    successText?: string;\n    /**\n     * Hint text to display.\n     */\n    hintText?: string;\n    /**\n     * One time password/code\n     */\n    modelValue?: string;\n  }\n\n  const props = withDefaults(defineProps<VerificationCodeInputProps>(), {\n    digitCount: 6,\n    errorText: undefined,\n    successText: undefined,\n    hintText: undefined,\n    modelValue: undefined,\n  });\n\n  const emit = defineEmits<{\n    (e: 'update:model-value', value: string | null): void;\n    (e: 'change', params: { originalEvent: Event; value: string | null }): void;\n    (e: 'focus', params: Event): void;\n    (e: 'blur', params: Event): void;\n  }>();\n\n  const data: Ref<Array<string>> = ref([]);\n\n  onMounted(() => {\n    if (props.modelValue) {\n      data.value = props.modelValue?.split('');\n    }\n  });\n\n  function handleInput(event: InputEvent, index) {\n    data.value[index] = event.target?.['value'];\n    updateModel(event);\n\n    if (event.inputType === 'deleteContentBackward') {\n      moveToPrev(event);\n    } else if (event.inputType === 'insertText' || event.inputType === 'deleteContentForward') {\n      moveToNext(event);\n    }\n  }\n\n  function updateModel(event: Event) {\n    const newValue = data.value.join('');\n    emit('update:model-value', newValue);\n    emit('change', { originalEvent: event, value: newValue });\n  }\n\n  function moveToPrev(event: InputEvent | KeyboardEvent) {\n    const prevInput: HTMLInputElement = findPrevInput(event.target as HTMLInputElement);\n\n    if (prevInput) {\n      prevInput.focus();\n      prevInput.select();\n    }\n  }\n\n  function moveToNext(event: InputEvent | KeyboardEvent) {\n    const nextInput: HTMLInputElement = findNextInput(event.target as HTMLInputElement);\n\n    if (nextInput) {\n      nextInput.focus();\n      nextInput.select();\n    }\n  }\n\n  function findPrevInput(element: HTMLInputElement) {\n    const prevElement = element.previousElementSibling;\n\n    if (!prevElement) return;\n\n    return prevElement.nodeName === 'INPUT' ? prevElement : findPrevInput(prevElement as HTMLInputElement);\n  }\n\n  function findNextInput(element: HTMLInputElement) {\n    const nextElement = element.nextElementSibling;\n\n    if (!nextElement) return;\n\n    return nextElement.nodeName === 'INPUT' ? nextElement : findNextInput(nextElement as HTMLInputElement);\n  }\n\n  function handleFocus(event) {\n    event.target.select();\n    emit('focus', event);\n  }\n\n  function handleBlur(event: Event) {\n    emit('blur', event);\n  }\n\n  function handleKeyDown(event: KeyboardEvent) {\n    if (event.ctrlKey || event.metaKey) {\n      return;\n    }\n\n    switch (event.code) {\n      case 'ArrowLeft':\n        moveToPrev(event);\n        event.preventDefault();\n        break;\n\n      case 'ArrowUp':\n      case 'ArrowDown':\n        event.preventDefault();\n        break;\n\n      case 'Backspace':\n        if (event.target?.['value'].length === 0) {\n          moveToPrev(event);\n          event.preventDefault();\n        }\n        break;\n\n      case 'ArrowRight':\n        moveToNext(event);\n        event.preventDefault();\n\n        break;\n\n      case 'Enter':\n      case 'NumpadEnter':\n      case 'Tab':\n        break;\n\n      default:\n        if (\n          !(event.code !== 'Space' && Number(event.key) >= 0 && Number(event.key) <= 9) ||\n          (data.value.join('').length >= props.digitCount && event.code !== 'Delete')\n        ) {\n          event.preventDefault();\n        }\n\n        break;\n    }\n  }\n\n  function handlePaste(event: ClipboardEvent) {\n    const paste = event.clipboardData?.getData('text');\n\n    if (paste?.length) {\n      const pastedCode = paste?.substring(0, props.digitCount);\n\n      const parsed = parseInt(pastedCode);\n\n      if (!isNaN(parsed)) {\n        data.value = pastedCode.split('');\n        updateModel(event);\n      }\n    }\n\n    event.preventDefault();\n  }\n\n  watch(\n    () => props.modelValue,\n    (newValue) => {\n      data.value = newValue ? newValue.split('') : new Array(props.digitCount);\n    },\n  );\n</script>\n\n<template>\n  <div\n    class=\"stash-confirmation-code-input tw-inline-block\"\n    data-test=\"stash-confirmation-code-input\"\n    :class=\"[classes['stash-confirmation-code-input-container']]\"\n  >\n    <div class=\"tw-mb-3 tw-flex tw-gap-6\">\n      <template v-for=\"field in props.digitCount\" :key=\"field\">\n        <input\n          data-test=\"stash-confirmation-code-input__otp\"\n          class=\"tw-border tw-bg-white tw-p-2 tw-text-center tw-text-base tw-font-medium tw-text-ice-900 focus:tw-border-blue-500\"\n          :class=\"[\n            classes['otp-code-input'],\n            { [classes['has-error']]: !!props.errorText },\n            { [classes['has-success']]: !!props.successText },\n          ]\"\n          type=\"text\"\n          inputmode=\"numeric\"\n          maxlength=\"1\"\n          :value=\"data[field - 1]\"\n          pattern=\"[0-9]\"\n          autocomplete=\"one-time-code\"\n          @input=\"handleInput($event as InputEvent, field - 1)\"\n          @keydown=\"handleKeyDown\"\n          @paste=\"handlePaste\"\n          @focus=\"handleFocus\"\n          @blur=\"handleBlur\"\n        />\n      </template>\n    </div>\n    <small\n      v-if=\"props.errorText\"\n      class=\"tw-mt-1 tw-block tw-whitespace-pre-line tw-pr-6 tw-text-center tw-text-red-500\"\n      data-test=\"field-error\"\n    >\n      {{ props.errorText }}\n    </small>\n    <small\n      v-if=\"props.successText\"\n      class=\"tw-mt-1 tw-block tw-whitespace-pre-line tw-pr-6 tw-text-center tw-text-green-500\"\n      data-test=\"field-success\"\n    >\n      {{ props.successText }}\n    </small>\n    <small\n      v-if=\"props.hintText\"\n      class=\"tw-mt-1 tw-block tw-whitespace-pre-line tw-pr-6 tw-text-center tw-text-ice-700\"\n      data-test=\"field-hint\"\n    >\n      {{ props.hintText }}\n    </small>\n  </div>\n</template>\n\n<style module>\n  .stash-confirmation-code-input-container {\n    --otp-digits: v-bind(digitCount);\n    --otp-container-width: calc(var(--otp-digits) * 60px);\n\n    width: var(--otp-container-width);\n  }\n\n  .otp-code-input {\n    border-radius: 4px;\n    caret-color: transparent;\n    height: 36px;\n    width: 36px;\n  }\n\n  .otp-code-input.has-error:not(:focus) {\n    border-color: var(--color-red-500);\n  }\n\n  .otp-code-input.has-success:not(:focus) {\n    border-color: var(--color-green-500);\n  }\n\n  .otp-code-input:focus {\n    box-shadow: 0 0 0 3px rgb(0 114 240 / 15%);\n    outline: none;\n  }\n</style>\n"],"names":["classes","useCssModule","props","__props","emit","__emit","data","ref","onMounted","_a","handleInput","event","index","updateModel","moveToPrev","moveToNext","newValue","prevInput","findPrevInput","nextInput","findNextInput","element","prevElement","nextElement","handleFocus","handleBlur","handleKeyDown","handlePaste","paste","pastedCode","parsed","watch"],"mappings":"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"}

package/dist/ConfirmationCodeInput.vue.d.ts

@@ -27,39 +27,39 @@ declare type __VLS_WithDefaults<P, D> = {
 };
 
 declare const _default: DefineComponent<ExtractPropTypes<__VLS_WithDefaults<__VLS_TypePropsToRuntimeProps<VerificationCodeInputProps>, {
-    digitCount: number;
-    errorText: undefined;
-    successText: undefined;
-    hintText: undefined;
-    modelValue: undefined;
+digitCount: number;
+errorText: undefined;
+successText: undefined;
+hintText: undefined;
+modelValue: undefined;
 }>>, {}, {}, {}, {}, ComponentOptionsMixin, ComponentOptionsMixin, {
-    "update:model-value": (value: string | null) => void;
-    change: (params: {
-        originalEvent: Event;
-        value: string | null;
-    }) => void;
-    focus: (params: Event) => void;
-    blur: (params: Event) => void;
+"update:model-value": (value: string | null) => void;
+change: (params: {
+originalEvent: Event;
+value: string | null;
+}) => void;
+focus: (params: Event) => void;
+blur: (params: Event) => void;
 }, string, PublicProps, Readonly<ExtractPropTypes<__VLS_WithDefaults<__VLS_TypePropsToRuntimeProps<VerificationCodeInputProps>, {
-    digitCount: number;
-    errorText: undefined;
-    successText: undefined;
-    hintText: undefined;
-    modelValue: undefined;
+digitCount: number;
+errorText: undefined;
+successText: undefined;
+hintText: undefined;
+modelValue: undefined;
 }>>> & Readonly<{
-    onBlur?: ((params: Event) => any) | undefined;
-    onChange?: ((params: {
-        originalEvent: Event;
-        value: string | null;
-    }) => any) | undefined;
-    onFocus?: ((params: Event) => any) | undefined;
-    "onUpdate:model-value"?: ((value: string | null) => any) | undefined;
+onBlur?: ((params: Event) => any) | undefined;
+onChange?: ((params: {
+originalEvent: Event;
+value: string | null;
+}) => any) | undefined;
+onFocus?: ((params: Event) => any) | undefined;
+"onUpdate:model-value"?: ((value: string | null) => any) | undefined;
 }>, {
-    errorText: string;
-    hintText: string;
-    modelValue: string;
-    digitCount: number;
-    successText: string;
+errorText: string;
+hintText: string;
+modelValue: string;
+digitCount: number;
+successText: string;
 }, {}, {}, {}, string, ComponentProvideOptions, true, {}, any>;
 export default _default;
 

package/dist/ContextSwitcher.js

@@ -1,16 +1,10 @@
-import { defineComponent as _, computed as C, resolveComponent as g, openBlock as s, createElementBlock as i, Fragment as u, renderList as x, normalizeClass as d, toDisplayString as f, createBlock as E, withCtx as S, createTextVNode as b } from "vue";
+import { defineComponent as _, computed as C, resolveComponent as g, openBlock as s, createElementBlock as l, Fragment as u, renderList as x, normalizeClass as d, toDisplayString as f, createBlock as E, withCtx as S, createTextVNode as b } from "vue";
 import { APPS as a } from "./constants.js";
 import { setPersistentItem as T, getPersistentItem as v, removePersistentItem as R } from "./utils/storage.js";
-import "@leaflink/snitch";
-import "./utils/helpers.js";
-import "lodash-es/camelCase";
-import "lodash-es/get";
-import "lodash-es/isFinite";
-import "lodash-es/isPlainObject";
 const N = {
   class: "stash-context-switcher tw-mx-auto tw-flex tw-w-64 tw-rounded-full tw-border tw-border-white/10 tw-bg-purple-700 tw-p-1.5 tw-text-center",
   "data-test": "stash-context-switcher"
-}, B = ["href", "onClick"], h = "-last-session", Q = /* @__PURE__ */ _({
+}, B = ["href", "onClick"], h = "-last-session", L = /* @__PURE__ */ _({
   name: "ll-context-switcher",
   __name: "ContextSwitcher",
   props: {
@@ -44,18 +38,18 @@ const N = {
       if (e.portalAccess.paymentsPortal && e.portalAccess.commercePortal) {
         const k = `${n === a.PAYMENTS ? a.MARKETPLACE : a.PAYMENTS}${h}`, w = `${n}${h}`;
         T(k, r, { global: !0 });
-        const l = v(w, { global: !0 });
-        l && (o.preventDefault(), t = l, window.location.href = l, R(w, { global: !0 }));
+        const i = v(w, { global: !0 });
+        i && (o.preventDefault(), t = i, window.location.href = i, R(w, { global: !0 }));
       }
       p("click", { from: r, to: t }), p("switch", o, { from: r, to: t });
     }
     return (o, n) => {
       const r = g("router-link");
-      return s(), i("div", N, [
-        (s(!0), i(u, null, x(P.value, (t) => (s(), i(u, {
+      return s(), l("div", N, [
+        (s(!0), l(u, null, x(P.value, (t) => (s(), l(u, {
           key: t.app
         }, [
-          t.hasBaseRoute ? (s(), i("a", {
+          t.hasBaseRoute ? (s(), l("a", {
             key: 0,
             class: d(["tw-w-1/2 tw-cursor-pointer tw-rounded-full tw-py-2.5 tw-font-semibold !tw-capitalize tw-leading-none !tw-no-underline", e.activeApp === t.app ? "tw-text-white tw-bg-royal-500" : "tw-text-ice-500"]),
             href: `/${t.name}`,
@@ -78,6 +72,6 @@ const N = {
   }
 });
 export {
-  Q as default
+  L as default
 };
 //# sourceMappingURL=ContextSwitcher.js.map

package/dist/ContextSwitcher.js.map

@@ -1 +1 @@
-{"version":3,"file":"ContextSwitcher.js","sources":["../src/components/ContextSwitcher/ContextSwitcher.vue"],"sourcesContent":["<script setup lang=\"ts\">\n  import { computed } from 'vue';\n  import type { LocationQuery } from 'vue-router';\n\n  import { APPS } from '../../constants';\n  import { getPersistentItem, removePersistentItem, setPersistentItem } from '../../utils/storage';\n\n  defineOptions({\n    name: 'll-context-switcher',\n  });\n\n  type AppValues = (typeof APPS)[keyof typeof APPS];\n\n  export interface ContextSwitcherProps {\n    /**\n     * The current app that is active. Choices are 'marketplace' | 'payments'.\n     */\n    activeApp: AppValues;\n\n    /**\n     * Portal access to both marketplace and payments.\n     */\n    portalAccess?: {\n      commercePortal: boolean;\n      paymentsPortal: boolean;\n    };\n\n    /**\n     * Url to replace the other app if current user does not have portal access.\n     */\n    limitedAccessUrl: string;\n\n    routeQuery?: LocationQuery;\n  }\n\n  const props = withDefaults(defineProps<ContextSwitcherProps>(), {\n    portalAccess: () => ({\n      commercePortal: false,\n      paymentsPortal: false,\n    }),\n    routeQuery: () => ({}),\n  });\n\n  const emit = defineEmits<{\n    /**\n     * Fires on click of the context switcher.\n     * @deprecated Use `switch` instead.\n     */\n    (e: 'click', urlInfo: { from: string; to: string }): void;\n    /**\n     * Fires on click of the context switcher.\n     */\n    (e: 'switch', evt: MouseEvent, urlInfo: { from: string; to: string }): void;\n  }>();\n\n  interface ContextItem {\n    app: AppValues;\n    name: string;\n    hasBaseRoute: boolean;\n  }\n\n  const CONTEXT_SWITCHER_STORAGE_KEY = '-last-session';\n\n  const routes = computed<ContextItem[]>(() => {\n    return [\n      {\n        app: APPS.MARKETPLACE,\n        name: props.portalAccess.commercePortal ? 'dashboard' : props.limitedAccessUrl,\n        hasBaseRoute: props.portalAccess.commercePortal,\n      },\n      {\n        app: APPS.PAYMENTS,\n        name: props.portalAccess.paymentsPortal ? 'payments' : props.limitedAccessUrl,\n        hasBaseRoute: false,\n      },\n    ];\n  });\n\n  /**\n   * Saves the current url in local storage before leaving the current app, if user has access to both apps\n   * If a previous session url exists, redirect users there instead then remove the local storage item afterward.\n   *\n   * @param event - Event from user click.\n   * @param app - App name of the clicked link, is a key of `APPS`.\n   */\n  function handleClick(event: MouseEvent, app: AppValues) {\n    if (app === props.activeApp) {\n      return;\n    }\n\n    const currentLocation = window.location.href;\n    let destination = (event.target as HTMLAnchorElement).href;\n\n    if (props.portalAccess.paymentsPortal && props.portalAccess.commercePortal) {\n      const appRoute = app === APPS.PAYMENTS ? APPS.MARKETPLACE : APPS.PAYMENTS;\n      const currentSessionName = `${appRoute}${CONTEXT_SWITCHER_STORAGE_KEY}`;\n      const prevSessionName = `${app}${CONTEXT_SWITCHER_STORAGE_KEY}`;\n\n      // save the current url in local storage\n      setPersistentItem(currentSessionName, currentLocation, { global: true });\n\n      // get the other app's url from local storage\n      const prevSessionUrl = getPersistentItem(prevSessionName, { global: true });\n\n      // if it exists, redirect users to such location and remove the item from local storage\n      if (prevSessionUrl) {\n        event.preventDefault();\n        destination = prevSessionUrl;\n        window.location.href = prevSessionUrl;\n        removePersistentItem(prevSessionName, { global: true });\n      }\n    }\n\n    emit('click', { from: currentLocation, to: destination });\n    emit('switch', event, { from: currentLocation, to: destination });\n  }\n</script>\n\n<template>\n  <div\n    class=\"stash-context-switcher tw-mx-auto tw-flex tw-w-64 tw-rounded-full tw-border tw-border-white/10 tw-bg-purple-700 tw-p-1.5 tw-text-center\"\n    data-test=\"stash-context-switcher\"\n  >\n    <template v-for=\"route in routes\" :key=\"route.app\">\n      <!-- render anchor tag to override base route in Payments -->\n      <a\n        v-if=\"route.hasBaseRoute\"\n        class=\"tw-w-1/2 tw-cursor-pointer tw-rounded-full tw-py-2.5 tw-font-semibold !tw-capitalize tw-leading-none !tw-no-underline\"\n        :class=\"props.activeApp === route.app ? 'tw-text-white tw-bg-royal-500' : 'tw-text-ice-500'\"\n        :href=\"`/${route.name}`\"\n        @click=\"(evt) => handleClick(evt, route.app)\"\n      >\n        {{ route.app }}\n      </a>\n\n      <router-link\n        v-else\n        class=\"tw-w-1/2 tw-cursor-pointer tw-rounded-full tw-py-2.5 tw-font-semibold !tw-capitalize tw-leading-none !tw-no-underline\"\n        :class=\"props.activeApp === route.app ? 'tw-text-white tw-bg-royal-500' : 'tw-text-ice-500'\"\n        :to=\"{ name: route.name, query: routeQuery }\"\n        :data-test-route=\"JSON.stringify({ name: route.name, query: routeQuery })\"\n        @click=\"(evt) => handleClick(evt, route.app)\"\n      >\n        {{ route.app }}\n      </router-link>\n    </template>\n  </div>\n</template>\n"],"names":["CONTEXT_SWITCHER_STORAGE_KEY","props","__props","emit","__emit","routes","computed","APPS","handleClick","event","app","currentLocation","destination","currentSessionName","prevSessionName","setPersistentItem","prevSessionUrl","getPersistentItem","removePersistentItem"],"mappings":";;;;;;;;;;;;4BA6DQA,IAA+B;;;;;;;;;;;;;;AA1BrC,UAAMC,IAAQC,GAQRC,IAAOC,GAoBPC,IAASC,EAAwB,MAC9B;AAAA,MACL;AAAA,QACE,KAAKC,EAAK;AAAA,QACV,MAAMN,EAAM,aAAa,iBAAiB,cAAcA,EAAM;AAAA,QAC9D,cAAcA,EAAM,aAAa;AAAA,MACnC;AAAA,MACA;AAAA,QACE,KAAKM,EAAK;AAAA,QACV,MAAMN,EAAM,aAAa,iBAAiB,aAAaA,EAAM;AAAA,QAC7D,cAAc;AAAA,MAChB;AAAA,IAAA,CAEH;AASQ,aAAAO,EAAYC,GAAmBC,GAAgB;AAClD,UAAAA,MAAQT,EAAM;AAChB;AAGI,YAAAU,IAAkB,OAAO,SAAS;AACpC,UAAAC,IAAeH,EAAM,OAA6B;AAEtD,UAAIR,EAAM,aAAa,kBAAkBA,EAAM,aAAa,gBAAgB;AAEpE,cAAAY,IAAqB,GADVH,MAAQH,EAAK,WAAWA,EAAK,cAAcA,EAAK,WACxBP,KACnCc,IAAkB,GAAGJ,IAAMV;AAGjC,QAAAe,EAAkBF,GAAoBF,GAAiB,EAAE,QAAQ,GAAM,CAAA;AAGvE,cAAMK,IAAiBC,EAAkBH,GAAiB,EAAE,QAAQ,IAAM;AAG1E,QAAIE,MACFP,EAAM,eAAe,GACPG,IAAAI,GACd,OAAO,SAAS,OAAOA,GACvBE,EAAqBJ,GAAiB,EAAE,QAAQ,GAAM,CAAA;AAAA;AAI1D,MAAAX,EAAK,SAAS,EAAE,MAAMQ,GAAiB,IAAIC,GAAa,GACxDT,EAAK,UAAUM,GAAO,EAAE,MAAME,GAAiB,IAAIC,GAAa;AAAA,IAClE;;;;;;;;;;;;;;;;;;;;;;;;;;;;;"}
+{"version":3,"file":"ContextSwitcher.js","sources":["../src/components/ContextSwitcher/ContextSwitcher.vue"],"sourcesContent":["<script setup lang=\"ts\">\n  import { computed } from 'vue';\n  import type { LocationQuery } from 'vue-router';\n\n  import { APPS } from '../../constants';\n  import { getPersistentItem, removePersistentItem, setPersistentItem } from '../../utils/storage';\n\n  defineOptions({\n    name: 'll-context-switcher',\n  });\n\n  type AppValues = (typeof APPS)[keyof typeof APPS];\n\n  export interface ContextSwitcherProps {\n    /**\n     * The current app that is active. Choices are 'marketplace' | 'payments'.\n     */\n    activeApp: AppValues;\n\n    /**\n     * Portal access to both marketplace and payments.\n     */\n    portalAccess?: {\n      commercePortal: boolean;\n      paymentsPortal: boolean;\n    };\n\n    /**\n     * Url to replace the other app if current user does not have portal access.\n     */\n    limitedAccessUrl: string;\n\n    routeQuery?: LocationQuery;\n  }\n\n  const props = withDefaults(defineProps<ContextSwitcherProps>(), {\n    portalAccess: () => ({\n      commercePortal: false,\n      paymentsPortal: false,\n    }),\n    routeQuery: () => ({}),\n  });\n\n  const emit = defineEmits<{\n    /**\n     * Fires on click of the context switcher.\n     * @deprecated Use `switch` instead.\n     */\n    (e: 'click', urlInfo: { from: string; to: string }): void;\n    /**\n     * Fires on click of the context switcher.\n     */\n    (e: 'switch', evt: MouseEvent, urlInfo: { from: string; to: string }): void;\n  }>();\n\n  interface ContextItem {\n    app: AppValues;\n    name: string;\n    hasBaseRoute: boolean;\n  }\n\n  const CONTEXT_SWITCHER_STORAGE_KEY = '-last-session';\n\n  const routes = computed<ContextItem[]>(() => {\n    return [\n      {\n        app: APPS.MARKETPLACE,\n        name: props.portalAccess.commercePortal ? 'dashboard' : props.limitedAccessUrl,\n        hasBaseRoute: props.portalAccess.commercePortal,\n      },\n      {\n        app: APPS.PAYMENTS,\n        name: props.portalAccess.paymentsPortal ? 'payments' : props.limitedAccessUrl,\n        hasBaseRoute: false,\n      },\n    ];\n  });\n\n  /**\n   * Saves the current url in local storage before leaving the current app, if user has access to both apps\n   * If a previous session url exists, redirect users there instead then remove the local storage item afterward.\n   *\n   * @param event - Event from user click.\n   * @param app - App name of the clicked link, is a key of `APPS`.\n   */\n  function handleClick(event: MouseEvent, app: AppValues) {\n    if (app === props.activeApp) {\n      return;\n    }\n\n    const currentLocation = window.location.href;\n    let destination = (event.target as HTMLAnchorElement).href;\n\n    if (props.portalAccess.paymentsPortal && props.portalAccess.commercePortal) {\n      const appRoute = app === APPS.PAYMENTS ? APPS.MARKETPLACE : APPS.PAYMENTS;\n      const currentSessionName = `${appRoute}${CONTEXT_SWITCHER_STORAGE_KEY}`;\n      const prevSessionName = `${app}${CONTEXT_SWITCHER_STORAGE_KEY}`;\n\n      // save the current url in local storage\n      setPersistentItem(currentSessionName, currentLocation, { global: true });\n\n      // get the other app's url from local storage\n      const prevSessionUrl = getPersistentItem(prevSessionName, { global: true });\n\n      // if it exists, redirect users to such location and remove the item from local storage\n      if (prevSessionUrl) {\n        event.preventDefault();\n        destination = prevSessionUrl;\n        window.location.href = prevSessionUrl;\n        removePersistentItem(prevSessionName, { global: true });\n      }\n    }\n\n    emit('click', { from: currentLocation, to: destination });\n    emit('switch', event, { from: currentLocation, to: destination });\n  }\n</script>\n\n<template>\n  <div\n    class=\"stash-context-switcher tw-mx-auto tw-flex tw-w-64 tw-rounded-full tw-border tw-border-white/10 tw-bg-purple-700 tw-p-1.5 tw-text-center\"\n    data-test=\"stash-context-switcher\"\n  >\n    <template v-for=\"route in routes\" :key=\"route.app\">\n      <!-- render anchor tag to override base route in Payments -->\n      <a\n        v-if=\"route.hasBaseRoute\"\n        class=\"tw-w-1/2 tw-cursor-pointer tw-rounded-full tw-py-2.5 tw-font-semibold !tw-capitalize tw-leading-none !tw-no-underline\"\n        :class=\"props.activeApp === route.app ? 'tw-text-white tw-bg-royal-500' : 'tw-text-ice-500'\"\n        :href=\"`/${route.name}`\"\n        @click=\"(evt) => handleClick(evt, route.app)\"\n      >\n        {{ route.app }}\n      </a>\n\n      <router-link\n        v-else\n        class=\"tw-w-1/2 tw-cursor-pointer tw-rounded-full tw-py-2.5 tw-font-semibold !tw-capitalize tw-leading-none !tw-no-underline\"\n        :class=\"props.activeApp === route.app ? 'tw-text-white tw-bg-royal-500' : 'tw-text-ice-500'\"\n        :to=\"{ name: route.name, query: routeQuery }\"\n        :data-test-route=\"JSON.stringify({ name: route.name, query: routeQuery })\"\n        @click=\"(evt) => handleClick(evt, route.app)\"\n      >\n        {{ route.app }}\n      </router-link>\n    </template>\n  </div>\n</template>\n"],"names":["CONTEXT_SWITCHER_STORAGE_KEY","props","__props","emit","__emit","routes","computed","APPS","handleClick","event","app","currentLocation","destination","currentSessionName","prevSessionName","setPersistentItem","prevSessionUrl","getPersistentItem","removePersistentItem"],"mappings":";;;;;;4BA6DQA,IAA+B;;;;;;;;;;;;;;AA1BrC,UAAMC,IAAQC,GAQRC,IAAOC,GAoBPC,IAASC,EAAwB,MAC9B;AAAA,MACL;AAAA,QACE,KAAKC,EAAK;AAAA,QACV,MAAMN,EAAM,aAAa,iBAAiB,cAAcA,EAAM;AAAA,QAC9D,cAAcA,EAAM,aAAa;AAAA,MACnC;AAAA,MACA;AAAA,QACE,KAAKM,EAAK;AAAA,QACV,MAAMN,EAAM,aAAa,iBAAiB,aAAaA,EAAM;AAAA,QAC7D,cAAc;AAAA,MAChB;AAAA,IAAA,CAEH;AASQ,aAAAO,EAAYC,GAAmBC,GAAgB;AAClD,UAAAA,MAAQT,EAAM;AAChB;AAGI,YAAAU,IAAkB,OAAO,SAAS;AACpC,UAAAC,IAAeH,EAAM,OAA6B;AAEtD,UAAIR,EAAM,aAAa,kBAAkBA,EAAM,aAAa,gBAAgB;AAE1E,cAAMY,IAAqB,GADVH,MAAQH,EAAK,WAAWA,EAAK,cAAcA,EAAK,QAC3B,GAAGP,CAA4B,IAC/Dc,IAAkB,GAAGJ,CAAG,GAAGV,CAA4B;AAG7D,QAAAe,EAAkBF,GAAoBF,GAAiB,EAAE,QAAQ,GAAM,CAAA;AAGvE,cAAMK,IAAiBC,EAAkBH,GAAiB,EAAE,QAAQ,IAAM;AAG1E,QAAIE,MACFP,EAAM,eAAe,GACPG,IAAAI,GACd,OAAO,SAAS,OAAOA,GACvBE,EAAqBJ,GAAiB,EAAE,QAAQ,GAAM,CAAA;AAAA,MAE1D;AAEA,MAAAX,EAAK,SAAS,EAAE,MAAMQ,GAAiB,IAAIC,GAAa,GACxDT,EAAK,UAAUM,GAAO,EAAE,MAAME,GAAiB,IAAIC,GAAa;AAAA,IAClE;;;;;;;;;;;;;;;;;;;;;;;;;;;;;"}

package/dist/ContextSwitcher.vue.d.ts

@@ -2,7 +2,7 @@ import { ComponentOptionsMixin } from 'vue';
 import { ComponentProvideOptions } from 'vue';
 import { DefineComponent } from 'vue';
 import { ExtractPropTypes } from 'vue';
-import type { LocationQuery } from 'vue-router';
+import { LocationQuery } from 'vue-router';
 import { PropType } from 'vue';
 import { PublicProps } from 'vue';
 
@@ -57,41 +57,41 @@ export declare interface ContextSwitcherProps {
 }
 
 declare const _default: DefineComponent<ExtractPropTypes<__VLS_WithDefaults<__VLS_TypePropsToRuntimeProps<ContextSwitcherProps>, {
-    portalAccess: () => {
-        commercePortal: boolean;
-        paymentsPortal: boolean;
-    };
-    routeQuery: () => {};
+portalAccess: () => {
+commercePortal: boolean;
+paymentsPortal: boolean;
+};
+routeQuery: () => {};
 }>>, {}, {}, {}, {}, ComponentOptionsMixin, ComponentOptionsMixin, {
-    click: (urlInfo: {
-        from: string;
-        to: string;
-    }) => void;
-    switch: (evt: MouseEvent, urlInfo: {
-        from: string;
-        to: string;
-    }) => void;
+click: (urlInfo: {
+from: string;
+to: string;
+}) => void;
+switch: (evt: MouseEvent, urlInfo: {
+from: string;
+to: string;
+}) => void;
 }, string, PublicProps, Readonly<ExtractPropTypes<__VLS_WithDefaults<__VLS_TypePropsToRuntimeProps<ContextSwitcherProps>, {
-    portalAccess: () => {
-        commercePortal: boolean;
-        paymentsPortal: boolean;
-    };
-    routeQuery: () => {};
+portalAccess: () => {
+commercePortal: boolean;
+paymentsPortal: boolean;
+};
+routeQuery: () => {};
 }>>> & Readonly<{
-    onClick?: ((urlInfo: {
-        from: string;
-        to: string;
-    }) => any) | undefined;
-    onSwitch?: ((evt: MouseEvent, urlInfo: {
-        from: string;
-        to: string;
-    }) => any) | undefined;
+onClick?: ((urlInfo: {
+from: string;
+to: string;
+}) => any) | undefined;
+onSwitch?: ((evt: MouseEvent, urlInfo: {
+from: string;
+to: string;
+}) => any) | undefined;
 }>, {
-    portalAccess: {
-        commercePortal: boolean;
-        paymentsPortal: boolean;
-    };
-    routeQuery: LocationQuery;
+portalAccess: {
+commercePortal: boolean;
+paymentsPortal: boolean;
+};
+routeQuery: LocationQuery;
 }, {}, {}, {}, string, ComponentProvideOptions, true, {}, any>;
 export default _default;