@leaflink/stash 45.1.1 → 45.1.3

package/dist/AddressSelect.js

@@ -24,7 +24,7 @@ import "./Icon.js";
 import "./index-79ce320f.js";
 import "./Icon.vue_used_vue_type_style_index_0_lang.module-eb359559.js";
 import "./_plugin-vue_export-helper-dad06003.js";
-import "./Field.vue_vue_type_script_setup_true_lang-224ab33a.js";
+import "./Field.vue_vue_type_script_setup_true_lang-e1e4ff03.js";
 import "./Label.vue_vue_type_script_setup_true_lang-4b02087f.js";
 import "./locale.js";
 const _ = "address-select-", ve = /* @__PURE__ */ M({

package/dist/CurrencyInput.js

@@ -6,7 +6,7 @@ import "./utils/i18n.js";
 import "./constants.js";
 import "./locale.js";
 import "lodash-es/get";
-import "./Field.vue_vue_type_script_setup_true_lang-224ab33a.js";
+import "./Field.vue_vue_type_script_setup_true_lang-e1e4ff03.js";
 import "lodash-es/uniqueId";
 import "./Label.vue_vue_type_script_setup_true_lang-4b02087f.js";
 import "./Icon.js";

package/dist/DataViewFilters.js

@@ -26,7 +26,7 @@ import "./Backdrop.js";
 import "./Input.js";
 import "lodash-es/isNil";
 import "./utils/i18n.js";
-import "./Field.vue_vue_type_script_setup_true_lang-224ab33a.js";
+import "./Field.vue_vue_type_script_setup_true_lang-e1e4ff03.js";
 function Pe({
   schema: a,
   dataViewRef: w

package/dist/DatePicker.js

@@ -20,7 +20,7 @@ import "./index-79ce320f.js";
 import "./Icon.vue_used_vue_type_style_index_0_lang.module-eb359559.js";
 import "lodash-es/isNil";
 import "./utils/i18n.js";
-import "./Field.vue_vue_type_script_setup_true_lang-224ab33a.js";
+import "./Field.vue_vue_type_script_setup_true_lang-e1e4ff03.js";
 import "./Label.vue_vue_type_script_setup_true_lang-4b02087f.js";
 function Uf(e, t) {
   he(2, arguments);

package/dist/Dialog.js

@@ -30,42 +30,42 @@ const R = ["open", "aria-labelledby", "data-test", "onKeydown"], U = ["id"], W =
   },
   emits: ["update:open", "cancel"],
   setup(M, { emit: y }) {
-    const t = M, g = Z(), d = z(), n = A(), b = G("dialog-header-"), i = C(!1), w = C(), E = l(() => t.confirmText || (t.alert ? c("ll.okay") : c("ll.confirm"))), k = l(() => !!g.default || t.description), N = l(
+    const t = M, b = Z(), i = z(), n = A(), g = G("dialog-header-"), d = C(!1), k = C(), E = l(() => t.confirmText || (t.alert ? c("ll.okay") : c("ll.confirm"))), h = l(() => !!b.default || t.description), N = l(
       () => t.status ? B[S(t.status)] : B.Info
-    ), h = l(
+    ), v = l(
       () => t.status ? I[S(t.status)] : I.Info
     ), V = l(() => t.dangerZone || t.status === J.Error);
-    function v() {
+    function w() {
       y("update:open", !1), y("cancel");
     }
     async function $(u) {
-      i.value = !0;
-      const x = d.onConfirm;
-      await x(u), i.value = !1;
+      d.value = !0;
+      const x = i.onConfirm;
+      await x(u), d.value = !1;
     }
     return H(() => {
       t.open && L(function() {
-        w.value.focus();
+        k.value.focus();
       });
     }), (u, x) => (s(), f(q, { name: "fade" }, {
       default: m(() => [
         t.open ? (s(), p("dialog", P({
           key: 0,
           ref_key: "root",
-          ref: w,
+          ref: k,
           open: t.open,
           tabindex: "0",
-          "aria-labelledby": e(b),
+          "aria-labelledby": e(g),
           "aria-modal": "true",
           class: e(n).dialog,
-          "data-test": e(d)["data-test"] || "ll-dialog"
-        }, e(d), {
-          onKeydown: Y(v, ["esc"])
+          "data-test": e(i)["data-test"] || "ll-dialog"
+        }, e(i), {
+          onKeydown: Y(w, ["esc"])
         }), [
           a("div", {
             class: o([
               e(n).body,
-              `tw-border-${h.value}`,
+              `tw-border-${v.value}`,
               {
                 "tw-border-t-6": t.status
               }
@@ -75,28 +75,28 @@ const R = ["open", "aria-labelledby", "data-test", "onKeydown"], U = ["id"], W =
               class: o(e(n).content)
             }, [
               a("div", {
-                class: o(["tw-flex tw-items-center", k.value && "tw-mb-1.5"])
+                class: o(["tw-flex tw-items-center", h.value && "tw-mb-1.5"])
               }, [
                 t.status ? (s(), f(O, {
                   key: 0,
                   "data-test": "dialog-status-icon",
                   name: N.value,
-                  class: o(`tw-text-${h.value}`)
+                  class: o(`tw-text-${v.value}`)
                 }, null, 8, ["name", "class"])) : r("", !0),
                 a("h3", {
-                  id: e(b),
+                  id: e(g),
                   class: o({ "tw-ml-1.5 tw-mt-px": t.status })
                 }, _(t.header), 11, U)
               ], 2),
-              k.value ? (s(), p("p", W, [
-                e(g).default ? j(u.$slots, "default", { key: 0 }) : (s(), p("span", {
+              h.value ? (s(), p("p", W, [
+                e(b).default ? j(u.$slots, "default", { key: 0 }) : (s(), p("span", {
                   key: 1,
                   innerHTML: t.description
                 }, null, 8, X))
               ])) : r("", !0)
             ], 2),
             a("footer", {
-              class: o([e(n).footer, "lg:max-xl:tw-bg-blue-300 md:max-lg:tw-bg-orange-300"])
+              class: o(e(n).footer)
             }, [
               a("div", tt, [
                 a("div", {
@@ -106,7 +106,7 @@ const R = ["open", "aria-labelledby", "data-test", "onKeydown"], U = ["id"], W =
                     key: 0,
                     "data-test": "button|cancel",
                     secondary: "",
-                    onClick: v
+                    onClick: w
                   }, {
                     default: m(() => [
                       T(_(t.cancelText), 1)
@@ -115,7 +115,7 @@ const R = ["open", "aria-labelledby", "data-test", "onKeydown"], U = ["id"], W =
                   })),
                   F(D, {
                     "data-test": "button|confirm",
-                    disabled: t.disabled || i.value,
+                    disabled: t.disabled || d.value,
                     color: V.value ? "red" : "blue",
                     class: o({
                       "tw-w-full": t.alert
@@ -144,8 +144,8 @@ const R = ["open", "aria-labelledby", "data-test", "onKeydown"], U = ["id"], W =
   footer: nt
 }, ct = {
   $style: rt
-}, ht = /* @__PURE__ */ Q(et, [["__cssModules", ct]]);
+}, vt = /* @__PURE__ */ Q(et, [["__cssModules", ct]]);
 export {
-  ht as default
+  vt as default
 };
 //# sourceMappingURL=Dialog.js.map

package/dist/Dialog.js.map

@@ -1 +1 @@
-{"version":3,"file":"Dialog.js","sources":["../src/components/Dialog/Dialog.vue"],"sourcesContent":["<script setup lang=\"ts\">\n  import capitalize from 'lodash-es/capitalize';\n  import uniqueId from 'lodash-es/uniqueId';\n  import { computed, nextTick, ref, useAttrs, useCssModule, useSlots, watchEffect } from 'vue';\n\n  import {\n    StatusColor,\n    StatusColors,\n    StatusIcon,\n    StatusIcons,\n    StatusSeverities,\n    StatusSeverity,\n  } from '../../../types/statusLevels';\n  import { t } from '../../locale';\n  import Button from '../Button/Button.vue';\n  import Icon from '../Icon/Icon.vue';\n\n  export interface DialogProps {\n    /**\n     * Shows or hides the dialog.\n     * Usage: v-model:open=\"isOpen\"\n     */\n    open?: boolean;\n\n    /**\n     * Whether the confirmation button is enabled or not.\n     */\n    disabled?: boolean;\n\n    /**\n     * Is this a dangerous action? Will turn the confirmation button red.\n     */\n    dangerZone?: boolean;\n\n    /**\n     * Header text.\n     */\n    header?: string;\n\n    /**\n     * Description text.\n     */\n    description?: string;\n\n    /**\n     * Cancel button text.\n     */\n    cancelText?: string;\n\n    /**\n     * Confirm button text.\n     */\n    confirmText?: string;\n\n    /**\n     * Treats it like an Alert Dialog, with only the confirmation button showing.\n     *\n     * @see {@link https://developer.mozilla.org/en-US/docs/Web/API/Window/alert}\n     */\n    alert?: boolean;\n\n    /**\n     * Adds a top accent border and icon next to the header.\n     * This behaves similarly to the Alert component in respect to the levels, icons, and colors\n     * passing `error` will treat the dialog the same as `dangerZone`\n     */\n    status?: StatusSeverity;\n  }\n\n  const props = withDefaults(defineProps<DialogProps>(), {\n    open: false,\n    disabled: false,\n    dangerZone: false,\n    header: t('ll.areYouSure'),\n    description: '',\n    cancelText: t('ll.cancel'),\n    confirmText: '',\n    alert: false,\n    status: undefined,\n  });\n\n  defineOptions({\n    name: 'll-dialog',\n    inheritAttrs: false,\n  });\n\n  const emits =\n    defineEmits<{\n      (e: 'update:open', value: boolean): void;\n      (e: 'cancel'): void;\n    }>();\n\n  const slots = useSlots();\n  const attrs = useAttrs();\n  const classes = useCssModule();\n  const headerId = uniqueId('dialog-header-');\n\n  const isConfirming = ref(false);\n  const root = ref();\n\n  /**\n   * Set the default confirm button text to \"Confirm\".\n   * If the `alert` prop is true, the default text is \"Okay\".\n   * If the `confirmText` prop is provided, `confirmText` is used whether or not\n   * the alert prop is true.\n   */\n  const modifiedConfirmText = computed(() => props.confirmText || (props.alert ? t('ll.okay') : t('ll.confirm')));\n\n  const hasDescription = computed(() => !!slots.default || props.description);\n\n  const statusIcon = computed<StatusIcon>(() =>\n    props.status ? StatusIcons[capitalize(props.status)] : StatusIcons.Info,\n  );\n  const statusColor = computed<StatusColor>(() =>\n    props.status ? StatusColors[capitalize(props.status)] : StatusColors.Info,\n  );\n\n  const computedDangerZone = computed(() => props.dangerZone || props.status === StatusSeverities.Error);\n\n  function cancel() {\n    emits('update:open', false);\n    emits('cancel');\n  }\n\n  async function handleConfirm(event: Event) {\n    isConfirming.value = true;\n\n    // useAttrs returns a Record<string, unknown> type, which causes\n    // TS errors when trying to call a passed listener\n    const onConfirm = attrs.onConfirm as (event: Event) => void;\n\n    // Call the parent confirm listener and await it. Using Async/Await lets\n    // us await even non-promises. Pass the event so modifiers can work.\n    await onConfirm(event);\n    isConfirming.value = false;\n  }\n\n  watchEffect(() => {\n    if (props.open) {\n      // Move focus to confirm button\n      nextTick(function () {\n        root.value.focus();\n      });\n    }\n  });\n</script>\n\n<template>\n  <transition name=\"fade\">\n    <dialog\n      v-if=\"props.open\"\n      ref=\"root\"\n      :open=\"props.open\"\n      tabindex=\"0\"\n      :aria-labelledby=\"headerId\"\n      aria-modal=\"true\"\n      :class=\"classes.dialog\"\n      :data-test=\"attrs['data-test'] || 'll-dialog'\"\n      v-bind=\"attrs\"\n      @keydown.esc=\"cancel\"\n    >\n      <div\n        :class=\"[\n          classes.body,\n          `tw-border-${statusColor}`,\n          {\n            'tw-border-t-6': props.status,\n          },\n        ]\"\n      >\n        <div :class=\"classes.content\">\n          <div class=\"tw-flex tw-items-center\" :class=\"hasDescription && 'tw-mb-1.5'\">\n            <Icon\n              v-if=\"props.status\"\n              data-test=\"dialog-status-icon\"\n              :name=\"statusIcon\"\n              :class=\"`tw-text-${statusColor}`\"\n            />\n            <h3 :id=\"headerId\" :class=\"{ 'tw-ml-1.5 tw-mt-px': props.status }\">{{ props.header }}</h3>\n          </div>\n\n          <p v-if=\"hasDescription\" class=\"tw-mb-0\">\n            <slot v-if=\"slots.default\"></slot>\n            <!-- eslint-disable-next-line vue/no-v-html -->\n            <span v-else v-html=\"props.description\"></span>\n          </p>\n        </div>\n\n        <footer :class=\"classes.footer\" class=\"lg:max-xl:tw-bg-blue-300 md:max-lg:tw-bg-orange-300\">\n          <div class=\"tw-text-right\">\n            <div :class=\"{ 'button-grid': !props.alert }\">\n              <Button v-if=\"!props.alert\" data-test=\"button|cancel\" secondary @click=\"cancel\">\n                {{ props.cancelText }}\n              </Button>\n\n              <Button\n                data-test=\"button|confirm\"\n                :disabled=\"props.disabled || isConfirming\"\n                :color=\"computedDangerZone ? 'red' : 'blue'\"\n                :class=\"{\n                  'tw-w-full': props.alert,\n                }\"\n                @click=\"handleConfirm\"\n              >\n                {{ modifiedConfirmText }}\n              </Button>\n            </div>\n          </div>\n        </footer>\n      </div>\n    </dialog>\n  </transition>\n</template>\n\n<style module>\n  .dialog {\n    background: rgb(0 0 0 / 30%);\n    bottom: 0;\n    display: flex;\n    flex-direction: column;\n    left: 0;\n    overflow: auto;\n    -webkit-overflow-scrolling: touch;\n    place-content: center;\n    position: fixed;\n    right: 0;\n    top: 0;\n    z-index: theme('zIndex.dialog');\n    width: 100%;\n    height: 100vh;\n  }\n\n  .body {\n    @apply tw-shadow;\n\n    background: var(--color-white);\n    color: var(--color-ice-700);\n    display: flex;\n    flex-direction: column;\n    margin: 0 auto;\n    max-height: 100vh;\n    max-width: 360px;\n    transition: transform theme('transitionDuration.150') theme('transitionTimingFunction.swing');\n    width: 100%;\n\n    &.grey {\n      background: var(--color-ice-200);\n      border-radius: theme('borderRadius.DEFAULT');\n    }\n\n    @media screen('md') {\n      border-radius: theme('borderRadius.DEFAULT');\n    }\n  }\n\n  .content {\n    flex-grow: 1;\n    padding: theme('spacing.6') var(--grid-gutter);\n  }\n\n  .footer {\n    background: var(--color-ice-200);\n    border-top: theme('borderWidth.DEFAULT') solid var(--color-ice-500);\n    display: initial; /* TEMP. Will need to fix marketplace `footer` style */\n    padding: theme('spacing.6') var(--grid-gutter);\n\n    @media screen('md') {\n      border-bottom-left-radius: theme('borderRadius.DEFAULT');\n      border-bottom-right-radius: theme('borderRadius.DEFAULT');\n    }\n  }\n\n  :global(.fade-enter-from),\n  :global(.fade-leave-active) {\n    .body {\n      transform: translate3d(0, theme('spacing.3'), 0);\n    }\n  }\n</style>\n"],"names":["slots","useSlots","attrs","useAttrs","classes","useCssModule","headerId","uniqueId","isConfirming","ref","root","modifiedConfirmText","computed","props","t","hasDescription","statusIcon","StatusIcons","capitalize","statusColor","StatusColors","computedDangerZone","StatusSeverities","cancel","emits","handleConfirm","event","onConfirm","watchEffect","nextTick"],"mappings":";;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;iBA4FQA,IAAQC,KACRC,IAAQC,KACRC,IAAUC,KACVC,IAAWC,EAAS,gBAAgB,GAEpCC,IAAeC,EAAI,EAAK,GACxBC,IAAOD,KAQPE,IAAsBC,EAAS,MAAMC,EAAM,gBAAgBA,EAAM,QAAQC,EAAE,SAAS,IAAIA,EAAE,YAAY,EAAE,GAExGC,IAAiBH,EAAS,MAAM,CAAC,CAACZ,EAAM,WAAWa,EAAM,WAAW,GAEpEG,IAAaJ;AAAA,MAAqB,MACtCC,EAAM,SAASI,EAAYC,EAAWL,EAAM,MAAM,CAAC,IAAII,EAAY;AAAA,IAAA,GAE/DE,IAAcP;AAAA,MAAsB,MACxCC,EAAM,SAASO,EAAaF,EAAWL,EAAM,MAAM,CAAC,IAAIO,EAAa;AAAA,IAAA,GAGjEC,IAAqBT,EAAS,MAAMC,EAAM,cAAcA,EAAM,WAAWS,EAAiB,KAAK;AAErG,aAASC,IAAS;AAChB,MAAAC,EAAM,eAAe,EAAK,GAC1BA,EAAM,QAAQ;AAAA,IAChB;AAEA,mBAAeC,EAAcC,GAAc;AACzC,MAAAlB,EAAa,QAAQ;AAIrB,YAAMmB,IAAYzB,EAAM;AAIxB,YAAMyB,EAAUD,CAAK,GACrBlB,EAAa,QAAQ;AAAA,IACvB;AAEA,WAAAoB,EAAY,MAAM;AAChB,MAAIf,EAAM,QAERgB,EAAS,WAAY;AACnB,QAAAnB,EAAK,MAAM;MAAM,CAClB;AAAA,IACH,CACD;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;"}
+{"version":3,"file":"Dialog.js","sources":["../src/components/Dialog/Dialog.vue"],"sourcesContent":["<script setup lang=\"ts\">\n  import capitalize from 'lodash-es/capitalize';\n  import uniqueId from 'lodash-es/uniqueId';\n  import { computed, nextTick, ref, useAttrs, useCssModule, useSlots, watchEffect } from 'vue';\n\n  import {\n    StatusColor,\n    StatusColors,\n    StatusIcon,\n    StatusIcons,\n    StatusSeverities,\n    StatusSeverity,\n  } from '../../../types/statusLevels';\n  import { t } from '../../locale';\n  import Button from '../Button/Button.vue';\n  import Icon from '../Icon/Icon.vue';\n\n  export interface DialogProps {\n    /**\n     * Shows or hides the dialog.\n     * Usage: v-model:open=\"isOpen\"\n     */\n    open?: boolean;\n\n    /**\n     * Whether the confirmation button is enabled or not.\n     */\n    disabled?: boolean;\n\n    /**\n     * Is this a dangerous action? Will turn the confirmation button red.\n     */\n    dangerZone?: boolean;\n\n    /**\n     * Header text.\n     */\n    header?: string;\n\n    /**\n     * Description text.\n     */\n    description?: string;\n\n    /**\n     * Cancel button text.\n     */\n    cancelText?: string;\n\n    /**\n     * Confirm button text.\n     */\n    confirmText?: string;\n\n    /**\n     * Treats it like an Alert Dialog, with only the confirmation button showing.\n     *\n     * @see {@link https://developer.mozilla.org/en-US/docs/Web/API/Window/alert}\n     */\n    alert?: boolean;\n\n    /**\n     * Adds a top accent border and icon next to the header.\n     * This behaves similarly to the Alert component in respect to the levels, icons, and colors\n     * passing `error` will treat the dialog the same as `dangerZone`\n     */\n    status?: StatusSeverity;\n  }\n\n  const props = withDefaults(defineProps<DialogProps>(), {\n    open: false,\n    disabled: false,\n    dangerZone: false,\n    header: t('ll.areYouSure'),\n    description: '',\n    cancelText: t('ll.cancel'),\n    confirmText: '',\n    alert: false,\n    status: undefined,\n  });\n\n  defineOptions({\n    name: 'll-dialog',\n    inheritAttrs: false,\n  });\n\n  const emits =\n    defineEmits<{\n      (e: 'update:open', value: boolean): void;\n      (e: 'cancel'): void;\n    }>();\n\n  const slots = useSlots();\n  const attrs = useAttrs();\n  const classes = useCssModule();\n  const headerId = uniqueId('dialog-header-');\n\n  const isConfirming = ref(false);\n  const root = ref();\n\n  /**\n   * Set the default confirm button text to \"Confirm\".\n   * If the `alert` prop is true, the default text is \"Okay\".\n   * If the `confirmText` prop is provided, `confirmText` is used whether or not\n   * the alert prop is true.\n   */\n  const modifiedConfirmText = computed(() => props.confirmText || (props.alert ? t('ll.okay') : t('ll.confirm')));\n\n  const hasDescription = computed(() => !!slots.default || props.description);\n\n  const statusIcon = computed<StatusIcon>(() =>\n    props.status ? StatusIcons[capitalize(props.status)] : StatusIcons.Info,\n  );\n  const statusColor = computed<StatusColor>(() =>\n    props.status ? StatusColors[capitalize(props.status)] : StatusColors.Info,\n  );\n\n  const computedDangerZone = computed(() => props.dangerZone || props.status === StatusSeverities.Error);\n\n  function cancel() {\n    emits('update:open', false);\n    emits('cancel');\n  }\n\n  async function handleConfirm(event: Event) {\n    isConfirming.value = true;\n\n    // useAttrs returns a Record<string, unknown> type, which causes\n    // TS errors when trying to call a passed listener\n    const onConfirm = attrs.onConfirm as (event: Event) => void;\n\n    // Call the parent confirm listener and await it. Using Async/Await lets\n    // us await even non-promises. Pass the event so modifiers can work.\n    await onConfirm(event);\n    isConfirming.value = false;\n  }\n\n  watchEffect(() => {\n    if (props.open) {\n      // Move focus to confirm button\n      nextTick(function () {\n        root.value.focus();\n      });\n    }\n  });\n</script>\n\n<template>\n  <transition name=\"fade\">\n    <dialog\n      v-if=\"props.open\"\n      ref=\"root\"\n      :open=\"props.open\"\n      tabindex=\"0\"\n      :aria-labelledby=\"headerId\"\n      aria-modal=\"true\"\n      :class=\"classes.dialog\"\n      :data-test=\"attrs['data-test'] || 'll-dialog'\"\n      v-bind=\"attrs\"\n      @keydown.esc=\"cancel\"\n    >\n      <div\n        :class=\"[\n          classes.body,\n          `tw-border-${statusColor}`,\n          {\n            'tw-border-t-6': props.status,\n          },\n        ]\"\n      >\n        <div :class=\"classes.content\">\n          <div class=\"tw-flex tw-items-center\" :class=\"hasDescription && 'tw-mb-1.5'\">\n            <Icon\n              v-if=\"props.status\"\n              data-test=\"dialog-status-icon\"\n              :name=\"statusIcon\"\n              :class=\"`tw-text-${statusColor}`\"\n            />\n            <h3 :id=\"headerId\" :class=\"{ 'tw-ml-1.5 tw-mt-px': props.status }\">{{ props.header }}</h3>\n          </div>\n\n          <p v-if=\"hasDescription\" class=\"tw-mb-0\">\n            <slot v-if=\"slots.default\"></slot>\n            <!-- eslint-disable-next-line vue/no-v-html -->\n            <span v-else v-html=\"props.description\"></span>\n          </p>\n        </div>\n\n        <footer :class=\"classes.footer\">\n          <div class=\"tw-text-right\">\n            <div :class=\"{ 'button-grid': !props.alert }\">\n              <Button v-if=\"!props.alert\" data-test=\"button|cancel\" secondary @click=\"cancel\">\n                {{ props.cancelText }}\n              </Button>\n\n              <Button\n                data-test=\"button|confirm\"\n                :disabled=\"props.disabled || isConfirming\"\n                :color=\"computedDangerZone ? 'red' : 'blue'\"\n                :class=\"{\n                  'tw-w-full': props.alert,\n                }\"\n                @click=\"handleConfirm\"\n              >\n                {{ modifiedConfirmText }}\n              </Button>\n            </div>\n          </div>\n        </footer>\n      </div>\n    </dialog>\n  </transition>\n</template>\n\n<style module>\n  .dialog {\n    background: rgb(0 0 0 / 30%);\n    bottom: 0;\n    display: flex;\n    flex-direction: column;\n    left: 0;\n    overflow: auto;\n    -webkit-overflow-scrolling: touch;\n    place-content: center;\n    position: fixed;\n    right: 0;\n    top: 0;\n    z-index: theme('zIndex.dialog');\n    width: 100%;\n    height: 100vh;\n  }\n\n  .body {\n    @apply tw-shadow;\n\n    background: var(--color-white);\n    color: var(--color-ice-700);\n    display: flex;\n    flex-direction: column;\n    margin: 0 auto;\n    max-height: 100vh;\n    max-width: 360px;\n    transition: transform theme('transitionDuration.150') theme('transitionTimingFunction.swing');\n    width: 100%;\n\n    &.grey {\n      background: var(--color-ice-200);\n      border-radius: theme('borderRadius.DEFAULT');\n    }\n\n    @media screen('md') {\n      border-radius: theme('borderRadius.DEFAULT');\n    }\n  }\n\n  .content {\n    flex-grow: 1;\n    padding: theme('spacing.6') var(--grid-gutter);\n  }\n\n  .footer {\n    background: var(--color-ice-200);\n    border-top: theme('borderWidth.DEFAULT') solid var(--color-ice-500);\n    display: initial; /* TEMP. Will need to fix marketplace `footer` style */\n    padding: theme('spacing.6') var(--grid-gutter);\n\n    @media screen('md') {\n      border-bottom-left-radius: theme('borderRadius.DEFAULT');\n      border-bottom-right-radius: theme('borderRadius.DEFAULT');\n    }\n  }\n\n  :global(.fade-enter-from),\n  :global(.fade-leave-active) {\n    .body {\n      transform: translate3d(0, theme('spacing.3'), 0);\n    }\n  }\n</style>\n"],"names":["slots","useSlots","attrs","useAttrs","classes","useCssModule","headerId","uniqueId","isConfirming","ref","root","modifiedConfirmText","computed","props","t","hasDescription","statusIcon","StatusIcons","capitalize","statusColor","StatusColors","computedDangerZone","StatusSeverities","cancel","emits","handleConfirm","event","onConfirm","watchEffect","nextTick"],"mappings":";;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;iBA4FQA,IAAQC,KACRC,IAAQC,KACRC,IAAUC,KACVC,IAAWC,EAAS,gBAAgB,GAEpCC,IAAeC,EAAI,EAAK,GACxBC,IAAOD,KAQPE,IAAsBC,EAAS,MAAMC,EAAM,gBAAgBA,EAAM,QAAQC,EAAE,SAAS,IAAIA,EAAE,YAAY,EAAE,GAExGC,IAAiBH,EAAS,MAAM,CAAC,CAACZ,EAAM,WAAWa,EAAM,WAAW,GAEpEG,IAAaJ;AAAA,MAAqB,MACtCC,EAAM,SAASI,EAAYC,EAAWL,EAAM,MAAM,CAAC,IAAII,EAAY;AAAA,IAAA,GAE/DE,IAAcP;AAAA,MAAsB,MACxCC,EAAM,SAASO,EAAaF,EAAWL,EAAM,MAAM,CAAC,IAAIO,EAAa;AAAA,IAAA,GAGjEC,IAAqBT,EAAS,MAAMC,EAAM,cAAcA,EAAM,WAAWS,EAAiB,KAAK;AAErG,aAASC,IAAS;AAChB,MAAAC,EAAM,eAAe,EAAK,GAC1BA,EAAM,QAAQ;AAAA,IAChB;AAEA,mBAAeC,EAAcC,GAAc;AACzC,MAAAlB,EAAa,QAAQ;AAIrB,YAAMmB,IAAYzB,EAAM;AAIxB,YAAMyB,EAAUD,CAAK,GACrBlB,EAAa,QAAQ;AAAA,IACvB;AAEA,WAAAoB,EAAY,MAAM;AAChB,MAAIf,EAAM,QAERgB,EAAS,WAAY;AACnB,QAAAnB,EAAK,MAAM;MAAM,CAClB;AAAA,IACH,CACD;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;"}

package/dist/Field.js

@@ -1,4 +1,4 @@
-import { _ as o } from "./Field.vue_vue_type_script_setup_true_lang-224ab33a.js";
+import { _ as o } from "./Field.vue_vue_type_script_setup_true_lang-e1e4ff03.js";
 import "vue";
 import "lodash-es/uniqueId";
 import "./Label.vue_vue_type_script_setup_true_lang-4b02087f.js";

package/dist/Field.vue_vue_type_script_setup_true_lang-e1e4ff03.js

@@ -0,0 +1,93 @@
+import { defineComponent as _, useAttrs as T, useSlots as k, computed as l, openBlock as s, createBlock as w, resolveDynamicComponent as B, mergeProps as O, unref as f, withCtx as m, normalizeClass as R, createTextVNode as q, toDisplayString as h, createCommentVNode as v, createElementBlock as o, renderSlot as u } from "vue";
+import p from "lodash-es/uniqueId";
+import { _ as E } from "./Label.vue_vue_type_script_setup_true_lang-4b02087f.js";
+const L = ["aria-labelledby"], S = ["id"], C = {
+  key: 4,
+  class: "stash-field-hint tw-mt-1 tw-block tw-whitespace-pre-line tw-text-xs",
+  "data-test": "stash-field-hint"
+}, g = {
+  key: 5,
+  class: "stash-field-hint tw-mt-1 tw-whitespace-pre-line tw-text-xs",
+  "data-test": "stash-field-hint"
+}, N = /* @__PURE__ */ _({
+  inheritAttrs: !1,
+  __name: "Field",
+  props: {
+    addBottomSpace: { type: Boolean, default: !1 },
+    errorText: { default: void 0 },
+    hintText: { default: void 0 },
+    id: { default: void 0 },
+    errorId: { default: void 0 },
+    isReadOnly: { type: Boolean },
+    isRequired: { type: Boolean, default: !1 },
+    label: { default: void 0 },
+    showOptionalInLabel: { type: Boolean, default: !1 },
+    fieldset: { type: Boolean, default: !1 }
+  },
+  setup(b) {
+    const e = b, y = T(), r = k(), i = l(() => e.id || p("stash-field-")), d = l(() => e.errorId || p("stash-field-error-")), a = l(() => p("stash-field-label-")), n = l(() => !!e.errorText), I = l(() => e.fieldset ? "fieldset" : "div"), x = l(() => {
+      const { placeholder: t, ...c } = y;
+      return c;
+    });
+    return (t, c) => (s(), w(B(I.value), O({
+      "data-test": "stash-field",
+      class: ["stash-field", [
+        { "tw-p-0": e.fieldset },
+        { "tw-mb-9": e.addBottomSpace && !e.errorText && !e.hintText && !f(r).hint },
+        { "tw-mb-4": e.addBottomSpace && (e.errorText || e.hintText || f(r).hint) }
+      ]]
+    }, x.value), {
+      default: m(() => [
+        e.label ? (s(), w(E, {
+          key: 0,
+          id: a.value,
+          class: R({ "tw-mb-1.5": !!e.isReadOnly }),
+          for: i.value,
+          "has-error": n.value,
+          "is-required": t.isRequired,
+          "show-optional": e.showOptionalInLabel,
+          legend: e.fieldset
+        }, {
+          default: m(() => [
+            q(h(e.label), 1)
+          ]),
+          _: 1
+        }, 8, ["id", "class", "for", "has-error", "is-required", "show-optional", "legend"])) : v("", !0),
+        e.isReadOnly ? (s(), o("div", {
+          key: 1,
+          "aria-labelledby": a.value
+        }, [
+          u(t.$slots, "default", {
+            fieldId: i.value,
+            fieldErrorId: d.value,
+            hasError: n.value,
+            isRequired: t.isRequired,
+            labelId: a.value,
+            showOptionalInLabel: e.showOptionalInLabel
+          })
+        ], 8, L)) : u(t.$slots, "default", {
+          key: 2,
+          fieldId: i.value,
+          fieldErrorId: d.value,
+          hasError: n.value,
+          isRequired: t.isRequired,
+          labelId: a.value,
+          showOptionalInLabel: e.showOptionalInLabel
+        }),
+        e.errorText ? (s(), o("span", {
+          key: 3,
+          id: d.value,
+          class: "stash-field-error tw-mt-1 tw-block tw-whitespace-pre-line tw-text-xs tw-text-red-500",
+          "data-test": "stash-field-error"
+        }, h(e.errorText), 9, S)) : e.hintText && !e.isReadOnly ? (s(), o("span", C, h(e.hintText), 1)) : f(r).hint && !e.isReadOnly ? (s(), o("div", g, [
+          u(t.$slots, "hint")
+        ])) : v("", !0)
+      ]),
+      _: 3
+    }, 16, ["class"]));
+  }
+});
+export {
+  N as _
+};
+//# sourceMappingURL=Field.vue_vue_type_script_setup_true_lang-e1e4ff03.js.map

package/dist/Field.vue_vue_type_script_setup_true_lang-e1e4ff03.js.map

@@ -0,0 +1 @@
+{"version":3,"file":"Field.vue_vue_type_script_setup_true_lang-e1e4ff03.js","sources":["../src/components/Field/Field.vue"],"sourcesContent":["<script setup lang=\"ts\">\n  import uniqueId from 'lodash-es/uniqueId';\n  import { computed, useAttrs, useSlots } from 'vue';\n\n  import Label from '../Label/Label.vue';\n\n  defineOptions({\n    inheritAttrs: false,\n  });\n\n  export interface FieldProps {\n    /**\n     * Adds spacing under the field that is consistent whether hint/error text is displayed.\n     */\n    addBottomSpace?: boolean;\n\n    /**\n     * Error text to display. Replaces `hintText` (if provided) & adds error styling.\n     */\n    errorText?: string;\n\n    /**\n     * Displays text below the input; hidden when the isReadOnly prop is truthy.\n     */\n    hintText?: string;\n\n    /**\n     * ID for the Label and Input; must be unique\n     */\n    id?: string;\n\n    /**\n     * ID for the error text element; useful for aria-errormessage\n     */\n    errorId?: string;\n\n    /**\n     * Whether it's a readonly field.\n     */\n    isReadOnly?: boolean;\n\n    /**\n     * Whether the field is required.\n     */\n    isRequired?: boolean;\n\n    /**\n     * Label to render above the input.\n     */\n    label?: string;\n\n    /**\n     * Show \"(optional)\" to the right of the label text\n     */\n    showOptionalInLabel?: boolean;\n\n    /**\n     * Indicates wheter the field is a fieldset or not\n     */\n    fieldset?: boolean;\n  }\n\n  const props = withDefaults(defineProps<FieldProps>(), {\n    addBottomSpace: false,\n    errorText: undefined,\n    hintText: undefined,\n    id: undefined,\n    errorId: undefined,\n    isRequired: false,\n    label: undefined,\n    showOptionalInLabel: false,\n    fieldset: false,\n  });\n  const attrs = useAttrs();\n  const slots = useSlots();\n  const fieldId = computed(() => props.id || uniqueId('stash-field-'));\n  const fieldErrorId = computed(() => props.errorId || uniqueId('stash-field-error-'));\n  const labelId = computed(() => uniqueId('stash-field-label-'));\n  const hasError = computed(() => !!props.errorText);\n  const wrapperElement = computed(() => (props.fieldset ? 'fieldset' : 'div'));\n\n  // Any attributes that are unique to form elements, you want to exclude from\n  // being bound from the root element.\n  const rootAttrs = computed(() => {\n    // eslint-disable-next-line @typescript-eslint/no-unused-vars\n    const { placeholder, ...otherAttrs } = attrs;\n\n    return otherAttrs;\n  });\n</script>\n\n<template>\n  <component\n    :is=\"wrapperElement\"\n    data-test=\"stash-field\"\n    class=\"stash-field\"\n    :class=\"[\n      { 'tw-p-0': props.fieldset },\n      { 'tw-mb-9': props.addBottomSpace && !props.errorText && !props.hintText && !slots.hint },\n      { 'tw-mb-4': props.addBottomSpace && (props.errorText || props.hintText || slots.hint) },\n    ]\"\n    v-bind=\"rootAttrs\"\n  >\n    <Label\n      v-if=\"props.label\"\n      :id=\"labelId\"\n      :class=\"{ 'tw-mb-1.5': !!props.isReadOnly }\"\n      :for=\"fieldId\"\n      :has-error=\"hasError\"\n      :is-required=\"isRequired\"\n      :show-optional=\"props.showOptionalInLabel\"\n      :legend=\"props.fieldset\"\n    >\n      {{ props.label }}\n    </Label>\n\n    <!-- @slot for the form field; the Label can also be rendered here instead of using the label prop -->\n    <template v-if=\"props.isReadOnly\">\n      <div :aria-labelledby=\"labelId\">\n        <slot\n          :field-id=\"fieldId\"\n          :field-error-id=\"fieldErrorId\"\n          :has-error=\"hasError\"\n          :is-required=\"isRequired\"\n          :label-id=\"labelId\"\n          :show-optional-in-label=\"props.showOptionalInLabel\"\n        ></slot>\n      </div>\n    </template>\n    <template v-else>\n      <slot\n        :field-id=\"fieldId\"\n        :field-error-id=\"fieldErrorId\"\n        :has-error=\"hasError\"\n        :is-required=\"isRequired\"\n        :label-id=\"labelId\"\n        :show-optional-in-label=\"props.showOptionalInLabel\"\n      ></slot>\n    </template>\n\n    <span\n      v-if=\"props.errorText\"\n      :id=\"fieldErrorId\"\n      class=\"stash-field-error tw-mt-1 tw-block tw-whitespace-pre-line tw-text-xs tw-text-red-500\"\n      data-test=\"stash-field-error\"\n    >\n      {{ props.errorText }}\n    </span>\n\n    <span\n      v-else-if=\"props.hintText && !props.isReadOnly\"\n      class=\"stash-field-hint tw-mt-1 tw-block tw-whitespace-pre-line tw-text-xs\"\n      data-test=\"stash-field-hint\"\n    >\n      {{ props.hintText }}\n    </span>\n\n    <div\n      v-else-if=\"slots.hint && !props.isReadOnly\"\n      class=\"stash-field-hint tw-mt-1 tw-whitespace-pre-line tw-text-xs\"\n      data-test=\"stash-field-hint\"\n    >\n      <!-- @slot for displaying hint text below the field -->\n      <slot name=\"hint\"></slot>\n    </div>\n  </component>\n</template>\n"],"names":["attrs","useAttrs","slots","useSlots","fieldId","computed","props","uniqueId","fieldErrorId","labelId","hasError","wrapperElement","rootAttrs","placeholder","otherAttrs"],"mappings":";;;;;;;;;;;;;;;;;;;;;;;;;;;iBAyEQA,IAAQC,KACRC,IAAQC,KACRC,IAAUC,EAAS,MAAMC,EAAM,MAAMC,EAAS,cAAc,CAAC,GAC7DC,IAAeH,EAAS,MAAMC,EAAM,WAAWC,EAAS,oBAAoB,CAAC,GAC7EE,IAAUJ,EAAS,MAAME,EAAS,oBAAoB,CAAC,GACvDG,IAAWL,EAAS,MAAM,CAAC,CAACC,EAAM,SAAS,GAC3CK,IAAiBN,EAAS,MAAOC,EAAM,WAAW,aAAa,KAAM,GAIrEM,IAAYP,EAAS,MAAM;AAE/B,YAAM,EAAE,aAAAQ,GAAa,GAAGC,EAAA,IAAed;AAEhC,aAAAc;AAAA,IAAA,CACR;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;"}

package/dist/FilterSelect.js

@@ -1,6 +1,6 @@
 import { defineComponent as S, computed as p, openBlock as r, createBlock as $, withCtx as u, createElementVNode as s, createElementBlock as d, withDirectives as f, vModelCheckbox as v, createVNode as _, withKeys as h, createTextVNode as b, toDisplayString as x, unref as C, createCommentVNode as K, Fragment as A, renderList as B } from "vue";
 import { t as E } from "./locale.js";
-import { _ as N } from "./Field.vue_vue_type_script_setup_true_lang-224ab33a.js";
+import { _ as N } from "./Field.vue_vue_type_script_setup_true_lang-e1e4ff03.js";
 import y from "./FilterChip.js";
 import "lodash-es/get";
 import "lodash-es/uniqueId";

package/dist/Filters.js

@@ -38,7 +38,7 @@ import "./index-79ce320f.js";
 import "./Icon.vue_used_vue_type_style_index_0_lang.module-eb359559.js";
 import "lodash-es/isNil";
 import "./utils/i18n.js";
-import "./Field.vue_vue_type_script_setup_true_lang-224ab33a.js";
+import "./Field.vue_vue_type_script_setup_true_lang-e1e4ff03.js";
 import "./Label.vue_vue_type_script_setup_true_lang-4b02087f.js";
 import "lodash-es/isEmpty";
 import "lodash-es/isEqual";

package/dist/InlineEdit.js

@@ -5,7 +5,7 @@ import "./constants.js";
 import "./locale.js";
 import "lodash-es/get";
 import "lodash-es/isNil";
-import "./Field.vue_vue_type_script_setup_true_lang-224ab33a.js";
+import "./Field.vue_vue_type_script_setup_true_lang-e1e4ff03.js";
 import "lodash-es/uniqueId";
 import "./Label.vue_vue_type_script_setup_true_lang-4b02087f.js";
 import "./Icon.js";

package/dist/Input.js

@@ -1,7 +1,7 @@
 import { defineComponent as P, useSlots as U, useCssModule as G, useAttrs as L, ref as f, computed as v, watchEffect as O, onMounted as W, openBlock as m, createBlock as g, mergeProps as V, unref as o, createSlots as j, withCtx as k, createElementVNode as N, withDirectives as q, vModelDynamic as H, createElementBlock as x, normalizeClass as C, renderSlot as y, createCommentVNode as I } from "vue";
 import $ from "lodash-es/isNil";
 import { convertDecimal as B, sanitizeDecimal as J, decimalSeparator as _ } from "./utils/i18n.js";
-import { _ as K } from "./Field.vue_vue_type_script_setup_true_lang-224ab33a.js";
+import { _ as K } from "./Field.vue_vue_type_script_setup_true_lang-e1e4ff03.js";
 import Q from "./Icon.js";
 import { _ as R } from "./_plugin-vue_export-helper-dad06003.js";
 import "./constants.js";

package/dist/InputOptions.js

@@ -1,5 +1,5 @@
 import { defineComponent as B, useAttrs as S, useSlots as k, useCssModule as T, ref as d, computed as c, watchEffect as $, watch as v, openBlock as b, createBlock as E, mergeProps as m, createSlots as A, withCtx as f, createElementVNode as M, normalizeClass as O, unref as u, createVNode as h, renderSlot as z } from "vue";
-import { _ as F } from "./Field.vue_vue_type_script_setup_true_lang-224ab33a.js";
+import { _ as F } from "./Field.vue_vue_type_script_setup_true_lang-e1e4ff03.js";
 import N from "./Input.js";
 import U from "./Select.js";
 import { _ as P } from "./_plugin-vue_export-helper-dad06003.js";

package/dist/ListView.js

@@ -46,7 +46,7 @@ import "./utils/formatDateTime.js";
 import "./utils/normalizeDate.js";
 import "./toTimeZone-e6e9ab75.js";
 import "./InputOptions.js";
-import "./Field.vue_vue_type_script_setup_true_lang-224ab33a.js";
+import "./Field.vue_vue_type_script_setup_true_lang-e1e4ff03.js";
 import "./Label.vue_vue_type_script_setup_true_lang-4b02087f.js";
 import "./Select.js";
 import "lodash-es/isEmpty";