@leaflink/stash 46.3.0 → 46.5.0

package/assets/illustrations/spot/extend-date.svg

@@ -0,0 +1 @@
+<svg fill="none" xmlns="http://www.w3.org/2000/svg" viewBox="0 0 100 100"><path d="M84.9 26.4h-68v52.4h68V26.4Z" fill="currentColor"/><path d="M55.96 60.36h-9v9h9v-9ZM35.34 60.36h-9v9h9v-9ZM76.58 40.3h-9v9h9v-9ZM55.96 40.3h-9v9h9v-9ZM35.34 40.3h-9v9h9v-9Z" stroke-width="3" stroke-linejoin="round"/><path d="M64.9 65h13m0 0-5-4.5m5 4.5-5 4.5M29.72 22.5v7M72.08 22.5v7" stroke-width="3" stroke-linecap="round" stroke-linejoin="round"/></svg>

package/assets/illustrations/spot/financial-institution.svg

@@ -1 +1 @@
-<svg viewBox="0 0 100 100" fill="none" xmlns="http://www.w3.org/2000/svg"><g clip-path="url(#a)"><path d="M13.5 82.92h72.06" stroke-width="3" stroke-miterlimit="10" stroke-linecap="round"/><path d="M78.65 41.11h-8.7v35.9h8.7v-35.9ZM62.14 41.11h-8.7v35.9h8.7v-35.9ZM45.62 41.11h-8.7v35.9h8.7v-35.9ZM29.1 41.11h-8.7v35.9h8.7v-35.9ZM83.53 36.35h-68l34-21.39 34 21.39Z" fill="currentColor"/></g><defs><clipPath id="a"><path fill="#fff" transform="translate(12 15)" d="M0 0h75.06v69.42H0z"/></clipPath></defs></svg>
+<svg fill="none" xmlns="http://www.w3.org/2000/svg" viewBox="0 0 100 100"><path d="M13.5 82.93h72" stroke-width="3" stroke-linecap="round"/><path d="m49.53 14.96-34 21.39h68l-34-21.39ZM29.1 41.11h-8.7v35.9h8.7v-35.9ZM36.92 41.11h8.7v35.9h-8.7v-35.9ZM62.14 41.11h-8.7v35.9h8.7v-35.9ZM78.65 41.11h-8.7v35.9h8.7v-35.9Z" fill="currentColor"/></svg>

package/dist/EmptyState.js

@@ -1,9 +1,19 @@
-import { defineComponent as n, useCssModule as i, useSlots as p, openBlock as a, createElementBlock as o, normalizeClass as m, unref as e, renderSlot as u, createCommentVNode as y, createTextVNode as d, toDisplayString as _ } from "vue";
-import { t as f } from "./locale.js";
-import { s as g } from "./EmptyState.vue_used_vue_type_style_index_0_lang.module-f5d89366.js";
-import { _ as w } from "./_plugin-vue_export-helper-dad06003.js";
+import { defineComponent as d, useCssModule as f, useSlots as y, openBlock as l, createElementBlock as a, unref as e, createBlock as _, createCommentVNode as m, createElementVNode as u, renderSlot as i, toDisplayString as r, normalizeClass as n, createTextVNode as w } from "vue";
+import { t as g } from "./locale.js";
+import { _ as b } from "./Illustration.vue_vue_type_script_setup_true_lang-e52df837.js";
+import { s as x } from "./EmptyState.vue_used_vue_type_style_index_0_lang.module-f5d89366.js";
+import { _ as h } from "./_plugin-vue_export-helper-dad06003.js";
 import "lodash-es/get";
-const x = ["alt", "src"], S = /* @__PURE__ */ n({
+import "lodash-es/uniqueId";
+import "./index-79ce320f.js";
+const k = {
+  key: "empty",
+  class: "stash-empty-state",
+  "data-test": "stash-empty-state"
+}, v = {
+  key: 0,
+  class: "tw-flex tw-flex-col tw-items-center tw-text-center md:tw-flex-row md:tw-text-left"
+}, S = { class: "tw-mb-1.5" }, $ = ["alt", "src"], C = /* @__PURE__ */ d({
   name: "ll-empty-state",
   __name: "EmptyState",
   props: {
@@ -11,31 +21,56 @@ const x = ["alt", "src"], S = /* @__PURE__ */ n({
       alt: "",
       src: ""
     }) },
-    text: { default: "" }
+    text: { default: "" },
+    title: { default: "" },
+    subtitle: { default: "" },
+    vignette: { default: void 0 }
   },
-  setup(r) {
-    const t = r, s = i(), l = p();
-    return (c, k) => (a(), o("div", {
-      key: "empty",
-      class: m(["stash-empty-state tw-mx-auto tw-my-0 tw-flex tw-items-center tw-justify-center tw-py-12", [e(s).root, { "tw-text-center": !t.image.src && !e(l).image }]]),
-      "data-test": "stash-empty-state"
-    }, [
-      u(c.$slots, "image", {}, () => [
-        t.image.src ? (a(), o("img", {
+  setup(p) {
+    const t = p, c = f(), s = y();
+    return (o, B) => (l(), a("div", k, [
+      t.title || e(s).title || t.subtitle || e(s).subtitle || t.vignette ? (l(), a("div", v, [
+        t.vignette ? (l(), _(b, {
           key: 0,
-          class: m(["tw-mr-6", e(s).image]),
-          alt: t.image.alt,
-          src: t.image.src,
-          "data-test": "stash-empty-state__img"
-        }, null, 10, x)) : y("", !0)
-      ]),
-      d(" " + _(t.text || e(f)("ll.emptyState.noResults")), 1)
-    ], 2));
+          "data-test": "stash-empty-state|illustration",
+          type: "vignette",
+          class: "tw-mx-3",
+          name: t.vignette,
+          size: 300
+        }, null, 8, ["name"])) : m("", !0),
+        u("section", null, [
+          i(o.$slots, "title", {}, () => [
+            u("h3", S, r(t.title), 1)
+          ]),
+          i(o.$slots, "subtitle", {}, () => [
+            t.subtitle || e(s).subtitle ? (l(), a("p", {
+              key: 0,
+              class: n({ " tw-mb-8": e(s).button, "tw-mb-0": !e(s).button })
+            }, r(t.subtitle), 3)) : m("", !0)
+          ]),
+          i(o.$slots, "button")
+        ])
+      ])) : (l(), a("div", {
+        key: 1,
+        class: n(["tw-mx-auto tw-my-0 tw-flex tw-items-center tw-justify-center tw-py-12", [e(c).root, { "tw-text-center": !t.image.src && !e(s).image }]])
+      }, [
+        i(o.$slots, "image", {}, () => [
+          t.image.src ? (l(), a("img", {
+            key: 0,
+            class: n(["tw-mr-6", e(c).image]),
+            alt: t.image.alt,
+            src: t.image.src,
+            "data-test": "stash-empty-state__img"
+          }, null, 10, $)) : m("", !0)
+        ]),
+        w(" " + r(t.text || e(g)("ll.emptyState.noResults")), 1)
+      ], 2))
+    ]));
   }
-}), h = {
-  $style: g
-}, V = /* @__PURE__ */ w(S, [["__cssModules", h]]);
+}), E = {
+  $style: x
+}, q = /* @__PURE__ */ h(C, [["__cssModules", E]]);
 export {
-  V as default
+  q as default
 };
 //# sourceMappingURL=EmptyState.js.map

package/dist/EmptyState.js.map

@@ -1 +1 @@
-{"version":3,"file":"EmptyState.js","sources":["../src/components/EmptyState/EmptyState.vue"],"sourcesContent":["<script lang=\"ts\" setup>\n  import { useCssModule, useSlots } from 'vue';\n\n  import { t } from '../../locale';\n\n  export interface EmptyStateProps {\n    /**\n     * Controls wether the sidebar is opened or not\n     */\n    image?: {\n      alt?: string;\n      src: string;\n    };\n    text?: string;\n  }\n\n  defineOptions({\n    name: 'll-empty-state',\n  });\n\n  const props = withDefaults(defineProps<EmptyStateProps>(), {\n    /**\n     * An optional image to render\n     */\n    image: () => ({\n      alt: '',\n      src: '',\n    }),\n\n    /**\n     * The custom message to render\n     */\n    text: '',\n  });\n\n  const classes = useCssModule();\n  const slots = useSlots();\n</script>\n\n<template>\n  <div\n    key=\"empty\"\n    class=\"stash-empty-state tw-mx-auto tw-my-0 tw-flex tw-items-center tw-justify-center tw-py-12\"\n    data-test=\"stash-empty-state\"\n    :class=\"[classes.root, { 'tw-text-center': !props.image.src && !slots.image }]\"\n  >\n    <slot name=\"image\">\n      <img\n        v-if=\"props.image.src\"\n        class=\"tw-mr-6\"\n        :alt=\"props.image.alt\"\n        :class=\"classes.image\"\n        :src=\"props.image.src\"\n        data-test=\"stash-empty-state__img\"\n      />\n    </slot>\n\n    {{ props.text || t('ll.emptyState.noResults') }}\n  </div>\n</template>\n\n<style module>\n  .root {\n    max-width: 600px;\n  }\n\n  .image {\n    max-width: 60px;\n  }\n</style>\n"],"names":["classes","useCssModule","slots","useSlots"],"mappings":";;;;;;;;;;;;;;;;iBAmCQA,IAAUC,KACVC,IAAQC;;;;;;;;;;;;;;;;;;;;;"}
+{"version":3,"file":"EmptyState.js","sources":["../src/components/EmptyState/EmptyState.vue"],"sourcesContent":["<script lang=\"ts\" setup>\n  import { useCssModule } from 'vue';\n\n  import { t } from '../../locale';\n  import { VignetteNames } from '../Illustration/Illustration.models';\n  import Illustration from '../Illustration/Illustration.vue';\n\n  export interface EmptyStateProps {\n    /**\n     * @deprecated Use illustration instead.\n     */\n    image?: {\n      alt?: string;\n      src: string;\n    };\n\n    /**\n     * @deprecated Use title instead.\n     */\n    text?: string;\n\n    /**\n     * the title text of the empty state\n     */\n    title?: string;\n\n    /**\n     * the subtitle text of the empty state\n     */\n    subtitle?: string;\n\n    /**\n     * The name of the vignette illustration to render\n     */\n    vignette?: VignetteNames;\n  }\n\n  export interface EmptyStateSlots {\n    title?: void;\n    subtitle?: void;\n    button?: void;\n    image?: void;\n  }\n\n  defineOptions({\n    name: 'll-empty-state',\n  });\n\n  const props = withDefaults(defineProps<EmptyStateProps>(), {\n    /**\n     * An optional image to render\n     */\n    image: () => ({\n      alt: '',\n      src: '',\n    }),\n\n    /**\n     * The custom message to render\n     */\n    text: '',\n\n    title: '',\n    subtitle: '',\n    vignette: undefined,\n  });\n\n  const classes = useCssModule();\n  const slots = defineSlots<EmptyStateSlots>();\n</script>\n\n<template>\n  <div key=\"empty\" class=\"stash-empty-state\" data-test=\"stash-empty-state\">\n    <template v-if=\"props.title || slots.title || props.subtitle || slots.subtitle || props.vignette\">\n      <div class=\"tw-flex tw-flex-col tw-items-center tw-text-center md:tw-flex-row md:tw-text-left\">\n        <Illustration\n          v-if=\"props.vignette\"\n          data-test=\"stash-empty-state|illustration\"\n          type=\"vignette\"\n          class=\"tw-mx-3\"\n          :name=\"props.vignette\"\n          :size=\"300\"\n        />\n        <section>\n          <slot name=\"title\">\n            <h3 class=\"tw-mb-1.5\">\n              {{ props.title }}\n            </h3>\n          </slot>\n\n          <slot name=\"subtitle\">\n            <p v-if=\"props.subtitle || slots.subtitle\" :class=\"{ ' tw-mb-8': slots.button, 'tw-mb-0': !slots.button }\">\n              {{ props.subtitle }}\n            </p>\n          </slot>\n\n          <slot name=\"button\"></slot>\n        </section>\n      </div>\n    </template>\n\n    <template v-else>\n      <div\n        class=\"tw-mx-auto tw-my-0 tw-flex tw-items-center tw-justify-center tw-py-12\"\n        :class=\"[classes.root, { 'tw-text-center': !props.image.src && !slots.image }]\"\n      >\n        <slot name=\"image\">\n          <img\n            v-if=\"props.image.src\"\n            class=\"tw-mr-6\"\n            :alt=\"props.image.alt\"\n            :class=\"classes.image\"\n            :src=\"props.image.src\"\n            data-test=\"stash-empty-state__img\"\n          />\n        </slot>\n\n        {{ props.text || t('ll.emptyState.noResults') }}\n      </div>\n    </template>\n  </div>\n</template>\n\n<style module>\n  .root {\n    max-width: 600px;\n  }\n\n  .image {\n    max-width: 60px;\n  }\n</style>\n"],"names":["classes","useCssModule","slots","_useSlots"],"mappings":";;;;;;;;;;;;;;;;;;;;;;;;;;;;;iBAmEQA,IAAUC,KACVC,IAAQC;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;"}

package/dist/EmptyState.vue.d.ts

@@ -45,6 +45,9 @@ declare const _default: __VLS_WithTemplateSlots<DefineComponent<__VLS_WithDefaul
      * The custom message to render
      */
     text: string;
+    title: string;
+    subtitle: string;
+    vignette: undefined;
 }>, {}, unknown, {}, {}, ComponentOptionsMixin, ComponentOptionsMixin, {}, string, VNodeProps & AllowedComponentProps & ComponentCustomProps, Readonly<ExtractPropTypes<__VLS_WithDefaults<__VLS_TypePropsToRuntimeProps<EmptyStateProps>, {
     /**
      * An optional image to render
@@ -57,26 +60,87 @@ declare const _default: __VLS_WithTemplateSlots<DefineComponent<__VLS_WithDefaul
      * The custom message to render
      */
     text: string;
+    title: string;
+    subtitle: string;
+    vignette: undefined;
 }>>>, {
+    title: string;
     image: {
         alt?: string | undefined;
         src: string;
     };
     text: string;
-}, {}>, {
-    image?(_: {}): any;
-}>;
+    subtitle: string;
+    vignette: "map" | "search" | "payments" | "calendar" | "dashboard" | "edit" | "megaphone" | "truck" | "warehouse" | "light-bulb" | "pie-chart" | "api" | "bank" | "basket" | "brand-menu" | "deals" | "document-search" | "empty-tray" | "graph" | "integrations" | "messages" | "money-bank" | "notifications" | "orders-empty" | "products" | "search-storefront" | "store" | "todo" | "users" | "warehouse-delivery";
+}, {}>, Readonly<EmptyStateSlots>>;
 export default _default;
 
 export declare interface EmptyStateProps {
     /**
-     * Controls wether the sidebar is opened or not
+     * @deprecated Use illustration instead.
      */
     image?: {
         alt?: string;
         src: string;
     };
+    /**
+     * @deprecated Use title instead.
+     */
     text?: string;
+    /**
+     * the title text of the empty state
+     */
+    title?: string;
+    /**
+     * the subtitle text of the empty state
+     */
+    subtitle?: string;
+    /**
+     * The name of the vignette illustration to render
+     */
+    vignette?: VignetteNames;
+}
+
+export declare interface EmptyStateSlots {
+    title?: void;
+    subtitle?: void;
+    button?: void;
+    image?: void;
 }
 
+declare enum VignetteName {
+    Api = "api",
+    Bank = "bank",
+    Basket = "basket",
+    BrandMenu = "brand-menu",
+    Calendar = "calendar",
+    Dashboard = "dashboard",
+    Deals = "deals",
+    DocumentSearch = "document-search",
+    Edit = "edit",
+    EmptyTray = "empty-tray",
+    Graph = "graph",
+    Integrations = "integrations",
+    LightBulb = "light-bulb",
+    Map = "map",
+    Megaphone = "megaphone",
+    Messages = "messages",
+    MoneyBank = "money-bank",
+    Notifications = "notifications",
+    OrdersEmpty = "orders-empty",
+    Payments = "payments",
+    PieChart = "pie-chart",
+    Products = "products",
+    Search = "search",
+    SearchStorefront = "search-storefront",
+    Store = "store",
+    Todo = "todo",
+    Truck = "truck",
+    Users = "users",
+    Warehouse = "warehouse",
+    WarehouseDelivery = "warehouse-delivery"
+}
+
+declare type VignetteNames = `${VignetteName}`;
+
 export { }

package/dist/HttpError.js

@@ -1,7 +1,7 @@
 import { openBlock as p, createElementBlock as h, createStaticVNode as y, defineComponent as k, useCssModule as C, useSlots as L, computed as l, resolveComponent as B, normalizeClass as i, unref as o, createElementVNode as r, createVNode as n, withCtx as m, toDisplayString as a, createTextVNode as c, renderSlot as S, createCommentVNode as j } from "vue";
 import { t } from "./locale.js";
 import b from "./Button.js";
-import { _ as H, I as N, V as X } from "./Illustration.vue_vue_type_script_setup_true_lang-664fa82f.js";
+import { _ as H, I as N, V as X } from "./Illustration.vue_vue_type_script_setup_true_lang-e52df837.js";
 import { _ as $ } from "./_plugin-vue_export-helper-dad06003.js";
 import "lodash-es/get";
 import "./Button.vue_used_vue_type_style_index_0_lang.module-63d31dc0.js";

package/dist/Illustration.js

@@ -1,5 +1,5 @@
-import { _ as a } from "./Illustration.vue_vue_type_script_setup_true_lang-664fa82f.js";
-import { I as r, S as i, V as f, s as n, v as N } from "./Illustration.vue_vue_type_script_setup_true_lang-664fa82f.js";
+import { _ as a } from "./Illustration.vue_vue_type_script_setup_true_lang-e52df837.js";
+import { I as r, S as i, V as f, s as n, v as N } from "./Illustration.vue_vue_type_script_setup_true_lang-e52df837.js";
 import "vue";
 import "lodash-es/uniqueId";
 import "./index-79ce320f.js";

package/dist/Illustration.vue.d.ts

@@ -132,6 +132,7 @@ export declare enum SpotName {
     EasyReconciliations = "easy-reconciliations",
     Efficiency = "efficiency",
     Error = "error",
+    ExtendDate = "extend-date",
     FinancialGrowth = "financial-growth",
     FinancialInstitution = "financial-institution",
     Focus = "focus",

package/dist/{Illustration.vue_vue_type_script_setup_true_lang-664fa82f.js → Illustration.vue_vue_type_script_setup_true_lang-e52df837.js}

@@ -1,12 +1,12 @@
-import { defineComponent as u, inject as d, computed as c, openBlock as h, createBlock as y, unref as k, normalizeClass as f } from "vue";
+import { defineComponent as u, inject as d, computed as e, openBlock as h, createBlock as y, unref as k, normalizeClass as f } from "vue";
 import v from "lodash-es/uniqueId";
 import { I as b } from "./index-79ce320f.js";
-var l = /* @__PURE__ */ ((r) => (r.Approved = "approved", r.Avatar = "avatar", r.Barcode = "barcode", r.Calendar = "calendar", r.Cartridge = "cartridge", r.Celebrate = "celebrate", r.ChatBubble = "chat-bubble", r.CheckBox = "check-box", r.CheckCircle = "check-circle", r.Click = "click", r.Cocktail = "cocktail", r.Confirmation = "confirmation", r.Connnect = "connnect", r.Cookie = "cookie", r.CreditCard = "credit-card", r.Crm = "crm", r.Cultivation = "cultivation", r.Data = "data", r.DeliveryCompleted = "delivery-completed", r.Delivery = "delivery", r.DigitalPayments = "digital-payments", r.Discover = "discover", r.Diversity = "diversity", r.Drink = "drink", r.Dolly = "dolly", r.EasyReconciliations = "easy-reconciliations", r.Efficiency = "efficiency", r.Error = "error", r.FinancialGrowth = "financial-growth", r.FinancialInstitution = "financial-institution", r.Focus = "focus", r.FulfillmentIssues = "fulfillment-issues", r.Growth = "growth", r.Handshake = "handshake", r.Hierarchy = "hierarchy", r.Home = "home", r.Laptop = "laptop", r.Licenses = "licenses", r.LightBulb = "light-bulb", r.LightbulbError = "lightbulb-error", r.LineChart = "line-chart", r.Link = "link", r.LocationPin = "location-pin", r.Lock = "lock", r.Messaging = "messaging", r.Microchip = "microchip", r.MissingData = "missing-data", r.MoneyTransfer = "money-transfer", r.Money = "money", r.NoInventoryAccess = "no-inventory-access", r.NoInventory = "no-inventory", r.NoPromote = "no-promote", r.PackageReceived = "package-received", r.Package = "package", r.PaymentProcessing = "payment-processing", r.Phone = "phone", r.PieChart = "pie-chart", r.ProductCycle = "product-cycle", r.Puzzle = "puzzle", r.Receipt = "receipt", r.Retail = "retail", r.SearchingDocument = "searching-document", r.ShoppingBasket = "shopping-basket", r.Shopping = "shopping", r.Sign = "sign", r.Smile = "smile", r.Speed = "speed", r.Time = "time", r.Tools = "tools", r.Truck = "truck", r.User = "user", r.Warehouse = "warehouse", r.Warning = "warning", r.XCircle = "x-circle", r))(l || {});
+var l = /* @__PURE__ */ ((r) => (r.Approved = "approved", r.Avatar = "avatar", r.Barcode = "barcode", r.Calendar = "calendar", r.Cartridge = "cartridge", r.Celebrate = "celebrate", r.ChatBubble = "chat-bubble", r.CheckBox = "check-box", r.CheckCircle = "check-circle", r.Click = "click", r.Cocktail = "cocktail", r.Confirmation = "confirmation", r.Connnect = "connnect", r.Cookie = "cookie", r.CreditCard = "credit-card", r.Crm = "crm", r.Cultivation = "cultivation", r.Data = "data", r.DeliveryCompleted = "delivery-completed", r.Delivery = "delivery", r.DigitalPayments = "digital-payments", r.Discover = "discover", r.Diversity = "diversity", r.Drink = "drink", r.Dolly = "dolly", r.EasyReconciliations = "easy-reconciliations", r.Efficiency = "efficiency", r.Error = "error", r.ExtendDate = "extend-date", r.FinancialGrowth = "financial-growth", r.FinancialInstitution = "financial-institution", r.Focus = "focus", r.FulfillmentIssues = "fulfillment-issues", r.Growth = "growth", r.Handshake = "handshake", r.Hierarchy = "hierarchy", r.Home = "home", r.Laptop = "laptop", r.Licenses = "licenses", r.LightBulb = "light-bulb", r.LightbulbError = "lightbulb-error", r.LineChart = "line-chart", r.Link = "link", r.LocationPin = "location-pin", r.Lock = "lock", r.Messaging = "messaging", r.Microchip = "microchip", r.MissingData = "missing-data", r.MoneyTransfer = "money-transfer", r.Money = "money", r.NoInventoryAccess = "no-inventory-access", r.NoInventory = "no-inventory", r.NoPromote = "no-promote", r.PackageReceived = "package-received", r.Package = "package", r.PaymentProcessing = "payment-processing", r.Phone = "phone", r.PieChart = "pie-chart", r.ProductCycle = "product-cycle", r.Puzzle = "puzzle", r.Receipt = "receipt", r.Retail = "retail", r.SearchingDocument = "searching-document", r.ShoppingBasket = "shopping-basket", r.Shopping = "shopping", r.Sign = "sign", r.Smile = "smile", r.Speed = "speed", r.Time = "time", r.Tools = "tools", r.Truck = "truck", r.User = "user", r.Warehouse = "warehouse", r.Warning = "warning", r.XCircle = "x-circle", r))(l || {});
 const C = Object.values(l);
 var o = /* @__PURE__ */ ((r) => (r.Api = "api", r.Bank = "bank", r.Basket = "basket", r.BrandMenu = "brand-menu", r.Calendar = "calendar", r.Dashboard = "dashboard", r.Deals = "deals", r.DocumentSearch = "document-search", r.Edit = "edit", r.EmptyTray = "empty-tray", r.Graph = "graph", r.Integrations = "integrations", r.LightBulb = "light-bulb", r.Map = "map", r.Megaphone = "megaphone", r.Messages = "messages", r.MoneyBank = "money-bank", r.Notifications = "notifications", r.OrdersEmpty = "orders-empty", r.Payments = "payments", r.PieChart = "pie-chart", r.Products = "products", r.Search = "search", r.SearchStorefront = "search-storefront", r.Store = "store", r.Todo = "todo", r.Truck = "truck", r.Users = "users", r.Warehouse = "warehouse", r.WarehouseDelivery = "warehouse-delivery", r))(o || {});
 const g = Object.values(o);
 var s = /* @__PURE__ */ ((r) => (r.Spot = "spot", r.Vignette = "vignette", r.Scene = "scene", r))(s || {});
-const p = /* @__PURE__ */ u({
+const E = /* @__PURE__ */ u({
   __name: "Illustration",
   props: {
     id: { default: v("ll-illustration-") },
@@ -30,11 +30,11 @@ const p = /* @__PURE__ */ u({
       );
     const n = d("stashOptions", {
       staticPath: "/static"
-    }), e = c(() => i.type === s.Spot), t = c(() => e.value ? "0" : !1), a = c(() => i.staticPath || (n == null ? void 0 : n.staticPath));
+    }), c = e(() => i.type === s.Spot), t = e(() => c.value ? "0" : !1), a = e(() => i.staticPath || (n == null ? void 0 : n.staticPath));
     return (w, P) => (h(), y(k(b), {
       id: i.id,
       class: f(["tw-inline-block tw-align-middle", {
-        [`tw-text-${i.fillColor}-400 tw-stroke-${i.strokeColor}`]: e.value
+        [`tw-text-${i.fillColor}-400 tw-stroke-${i.strokeColor}`]: c.value
       }]),
       title: i.title,
       height: i.size,
@@ -49,8 +49,8 @@ export {
   s as I,
   l as S,
   o as V,
-  p as _,
+  E as _,
   C as s,
   g as v
 };
-//# sourceMappingURL=Illustration.vue_vue_type_script_setup_true_lang-664fa82f.js.map
+//# sourceMappingURL=Illustration.vue_vue_type_script_setup_true_lang-e52df837.js.map

package/dist/Illustration.vue_vue_type_script_setup_true_lang-e52df837.js.map

@@ -0,0 +1 @@
+{"version":3,"file":"Illustration.vue_vue_type_script_setup_true_lang-e52df837.js","sources":["../src/components/Illustration/Illustration.models.ts","../src/components/Illustration/Illustration.vue"],"sourcesContent":["/**\n * Enum to strongly map between a friendly name and file name of the illustration\n */\nexport enum SpotName {\n  Approved = 'approved',\n  Avatar = 'avatar',\n  Barcode = 'barcode',\n  Calendar = 'calendar',\n  Cartridge = 'cartridge',\n  Celebrate = 'celebrate',\n  ChatBubble = 'chat-bubble',\n  CheckBox = 'check-box',\n  CheckCircle = 'check-circle',\n  Click = 'click',\n  Cocktail = 'cocktail',\n  Confirmation = 'confirmation',\n  Connnect = 'connnect',\n  Cookie = 'cookie',\n  CreditCard = 'credit-card',\n  Crm = 'crm',\n  Cultivation = 'cultivation',\n  Data = 'data',\n  DeliveryCompleted = 'delivery-completed',\n  Delivery = 'delivery',\n  DigitalPayments = 'digital-payments',\n  Discover = 'discover',\n  Diversity = 'diversity',\n  Drink = 'drink',\n  Dolly = 'dolly',\n  EasyReconciliations = 'easy-reconciliations',\n  Efficiency = 'efficiency',\n  Error = 'error',\n  ExtendDate = 'extend-date',\n  FinancialGrowth = 'financial-growth',\n  FinancialInstitution = 'financial-institution',\n  Focus = 'focus',\n  FulfillmentIssues = 'fulfillment-issues',\n  Growth = 'growth',\n  Handshake = 'handshake',\n  Hierarchy = 'hierarchy',\n  Home = 'home',\n  Laptop = 'laptop',\n  Licenses = 'licenses',\n  LightBulb = 'light-bulb',\n  LightbulbError = 'lightbulb-error',\n  LineChart = 'line-chart',\n  Link = 'link',\n  LocationPin = 'location-pin',\n  Lock = 'lock',\n  Messaging = 'messaging',\n  Microchip = 'microchip',\n  MissingData = 'missing-data',\n  MoneyTransfer = 'money-transfer',\n  Money = 'money',\n  NoInventoryAccess = 'no-inventory-access',\n  NoInventory = 'no-inventory',\n  NoPromote = 'no-promote',\n  PackageReceived = 'package-received',\n  Package = 'package',\n  PaymentProcessing = 'payment-processing',\n  Phone = 'phone',\n  PieChart = 'pie-chart',\n  ProductCycle = 'product-cycle',\n  Puzzle = 'puzzle',\n  Receipt = 'receipt',\n  Retail = 'retail',\n  SearchingDocument = 'searching-document',\n  ShoppingBasket = 'shopping-basket',\n  Shopping = 'shopping',\n  Sign = 'sign',\n  Smile = 'smile',\n  Speed = 'speed',\n  Time = 'time',\n  Tools = 'tools',\n  Truck = 'truck',\n  User = 'user',\n  Warehouse = 'warehouse',\n  Warning = 'warning',\n  XCircle = 'x-circle',\n}\n\nexport type SpotNames = `${SpotName}`;\n\n/**\n * String array of all illustration names\n */\nexport const spotNames = Object.values(SpotName);\n\nexport enum VignetteName {\n  Api = 'api',\n  Bank = 'bank',\n  Basket = 'basket',\n  BrandMenu = 'brand-menu',\n  Calendar = 'calendar',\n  Dashboard = 'dashboard',\n  Deals = 'deals',\n  DocumentSearch = 'document-search',\n  Edit = 'edit',\n  EmptyTray = 'empty-tray',\n  Graph = 'graph',\n  Integrations = 'integrations',\n  LightBulb = 'light-bulb',\n  Map = 'map',\n  Megaphone = 'megaphone',\n  Messages = 'messages',\n  MoneyBank = 'money-bank',\n  Notifications = 'notifications',\n  OrdersEmpty = 'orders-empty',\n  Payments = 'payments',\n  PieChart = 'pie-chart',\n  Products = 'products',\n  Search = 'search',\n  SearchStorefront = 'search-storefront',\n  Store = 'store',\n  Todo = 'todo',\n  Truck = 'truck',\n  Users = 'users',\n  Warehouse = 'warehouse',\n  WarehouseDelivery = 'warehouse-delivery',\n}\n\nexport type VignetteNames = `${VignetteName}`;\n\n/**\n * String array of all vignette names\n */\nexport const vignetteNames = Object.values(VignetteName);\n\n/**\n * Types of illustrations that map to the subfolder under ./assets/illustrations/<type>\n */\nexport enum IllustrationType {\n  Spot = 'spot',\n  Vignette = 'vignette',\n  // Scene is not implemented, but adding it for future work mentioned in STASH-61.\n  Scene = 'scene',\n}\n\nexport type IllustrationTypes = `${IllustrationType}`;\n","<script lang=\"ts\">\n  export * from './Illustration.models';\n</script>\n\n<script lang=\"ts\" setup>\n  import uniqueId from 'lodash-es/uniqueId';\n  import { computed, inject } from 'vue';\n  import InlineSvg from 'vue-inline-svg';\n\n  import { StashPrimaryColor, StashPrimaryColorGroup } from '../../../types/colors';\n  import { StashProvideState } from '../../../types/misc';\n  import {\n    IllustrationType,\n    IllustrationTypes,\n    SpotName,\n    SpotNames,\n    spotNames,\n    VignetteName,\n    VignetteNames,\n    vignetteNames,\n  } from './Illustration.models';\n\n  export interface IllustrationProps {\n    id?: string;\n\n    /**\n     * The filename of the icon that should be displayed\n     */\n    name: SpotNames | VignetteNames;\n\n    /**\n     * Accessible, short-text description for the icon. Not rendered as part of the graphic, but\n     * browsers usually display it as a tooltip and screen readers use this.\n     */\n    title?: string;\n\n    /**\n     * The size in pixels of the illustration.  This number will be used for width and height\n     */\n    size?: number;\n\n    /**\n     * Type of the illustration\n     */\n    type?: IllustrationTypes;\n\n    /**\n     * The fill color for the illustration.  This component will use the 400 shade of the color\n     * per design's request.  Defaults to teal.\n     */\n    fillColor?: StashPrimaryColorGroup;\n\n    /**\n     * The color theme for the illustration.  This component will use the standard 500 shade of the color.\n     * Defaults to purple\n     */\n    strokeColor?: StashPrimaryColor;\n\n    /**\n     * Illustration's custom static path. It'll default to either the staticPath defined on the library installation or '/static' if none are provided.\n     */\n    staticPath?: string;\n  }\n\n  const props = withDefaults(defineProps<IllustrationProps>(), {\n    id: uniqueId('ll-illustration-'),\n    title: '',\n    size: 48,\n    type: IllustrationType.Spot,\n    fillColor: 'blue',\n    strokeColor: 'purple-500',\n    staticPath: '',\n  });\n\n  if (props.type === IllustrationType.Scene) {\n    throw new Error(\n      'Scene illustration types are not supported. Illustrations will need to be uploaded under ./assets/illustrations/scene. Illustrations to be provided by design.',\n    );\n  }\n\n  if (\n    (props.type === IllustrationType.Spot && !spotNames.includes(props.name as SpotName)) ||\n    (props.type === IllustrationType.Vignette && !vignetteNames.includes(props.name as VignetteName))\n  ) {\n    throw new Error(\n      `${props.type} illustration name ${props.name} not found. Did you check that you are using the correct type for your illustration?`,\n    );\n  }\n\n  const stashOptions = inject<Partial<StashProvideState>>('stashOptions', {\n    staticPath: '/static',\n  });\n\n  const isSpotIllustration = computed(() => props.type === IllustrationType.Spot);\n\n  /**\n   * Browsers won't add the `stroke-width` attribute if it is set to false.\n   * However, setting it to specific number value affects vignettes\n   */\n  const strokeWidth = computed<boolean | string>(() => {\n    return isSpotIllustration.value ? '0' : false;\n  });\n\n  const computedStaticPath = computed(() => {\n    return props.staticPath || stashOptions?.staticPath;\n  });\n</script>\n\n<template>\n  <!-- InlineSvg package (https://github.com/shrpne/vue-inline-svg) swaps external svgs and puts\n  them inline so we can style them with CSS -->\n  <!-- Having to override fill to be none and stroke to be zero so the exported svgs from Figma\n  that do not have those attributes specified do not get a default one applied -->\n  <InlineSvg\n    :id=\"props.id\"\n    class=\"tw-inline-block tw-align-middle\"\n    :class=\"{\n      [`tw-text-${props.fillColor}-400 tw-stroke-${props.strokeColor}`]: isSpotIllustration,\n    }\"\n    :title=\"props.title\"\n    :height=\"props.size\"\n    :width=\"props.size\"\n    :stroke-width=\"strokeWidth\"\n    fill=\"none\"\n    :src=\"`${computedStaticPath}/illustrations/${props.type}/${props.name}.svg`\"\n  />\n</template>\n"],"names":["SpotName","spotNames","VignetteName","vignetteNames","IllustrationType","props","stashOptions","inject","isSpotIllustration","computed","strokeWidth","computedStaticPath"],"mappings":"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"}

package/dist/ListView.js

@@ -58,6 +58,7 @@ import "lodash-es/isNil";
 import "./utils/i18n.js";
 import "./Radio.js";
 import "./Paginate.vue_used_vue_type_style_index_0_lang.module-18343da7.js";
+import "./Illustration.vue_vue_type_script_setup_true_lang-e52df837.js";
 import "./EmptyState.vue_used_vue_type_style_index_0_lang.module-f5d89366.js";
 import "./Loading.vue_used_vue_type_style_index_0_lang.module-ef5a3bc6.js";
 const de = "_checkbox_hsxyw_10", he = "_actions_hsxyw_14", ue = {
@@ -379,7 +380,7 @@ function Ae(e, l, s, w, i, t) {
 }
 const Pe = {
   $style: Ie
-}, ss = /* @__PURE__ */ k(xe, [["render", Ae], ["__cssModules", Pe]]), Fe = "_caret_1147a_2", Oe = {
+}, ls = /* @__PURE__ */ k(xe, [["render", Ae], ["__cssModules", Pe]]), Fe = "_caret_1147a_2", Oe = {
   "caret-up": "_caret-up_1147a_2",
   "caret-down": "_caret-down_1147a_6",
   caret: Fe
@@ -475,7 +476,7 @@ function Le(e, l, s, w, i, t) {
 }
 const Ve = {
   $style: Oe
-}, ls = /* @__PURE__ */ k(Ee, [["render", Le], ["__cssModules", Ve]]), De = "_header_c8ut0_25", Re = "_separator_c8ut0_1", Ne = "_dropdown_c8ut0_199", ze = {
+}, is = /* @__PURE__ */ k(Ee, [["render", Le], ["__cssModules", Ve]]), De = "_header_c8ut0_25", Re = "_separator_c8ut0_1", Ne = "_dropdown_c8ut0_199", ze = {
   "list-items": "_list-items_c8ut0_2",
   "legacy-box": "_legacy-box_c8ut0_16",
   header: De,
@@ -1335,12 +1336,12 @@ function Ke(e, l, s, w, i, t) {
 }
 const We = {
   $style: ze
-}, is = /* @__PURE__ */ k(He, [["render", Ke], ["__cssModules", We]]);
+}, rs = /* @__PURE__ */ k(He, [["render", Ke], ["__cssModules", We]]);
 export {
   we as BulkActions,
-  ss as ListGroup,
-  ls as ListHeader,
+  ls as ListGroup,
+  is as ListHeader,
   Te as LoadingManager,
-  is as default
+  rs as default
 };
 //# sourceMappingURL=ListView.js.map