@adyen/bento-vue2 1.84.2 → 1.86.0

package/dist/draggable-handle.js

@@ -0,0 +1,173 @@
+import { defineComponent as u, computed as s } from "vue";
+import { f as c } from "./chunks/button-actions.VSc47LLH.js";
+import { u as _ } from "./chunks/index.B6WW_F-J.js";
+import { G as f } from "./chunks/grab.BxiVZ1RZ.js";
+/* empty css                     */
+import { n } from "./chunks/_plugin-vue2_normalizer.CeySl7Fu.js";
+import { A as b } from "./chunks/arrow-left.CRREfabP.js";
+import { A as h } from "./chunks/arrow-right.Dn3AYpUP.js";
+import "./assets/draggable-handle.css";
+let l = 0;
+const g = {
+  beforeCreate() {
+    this.uuid = l.toString(), l += 1;
+  }
+};
+var w = function() {
+  var e = this, t = e._self._c;
+  return t("svg", e._b({ staticClass: "ui-assets-icons-16", attrs: { role: "img", xmlns: "http://www.w3.org/2000/svg", width: "16", height: "16", fill: "none" } }, "svg", e.$attrs, !1), [e.$attrs["svg-title"] ? t("title", [e._v(e._s(e.$attrs["svg-title"]))]) : e._e(), t("path", { attrs: { fill: "#001222", d: "M8.75023 3.81089L13.0001 8.06077L14.0608 7.00011L8.00011 0.939453L1.93945 7.00011L3.00011 8.06077L7.25023 3.81066V14.7502H8.75023V3.81089Z" } })]);
+}, L = [], M = /* @__PURE__ */ n(
+  g,
+  w,
+  L,
+  !1,
+  null,
+  null
+);
+const d = M.exports;
+let i = 0;
+const T = {
+  beforeCreate() {
+    this.uuid = i.toString(), i += 1;
+  }
+};
+var x = function() {
+  var e = this, t = e._self._c;
+  return t("svg", e._b({ staticClass: "ui-assets-icons-16", attrs: { role: "img", xmlns: "http://www.w3.org/2000/svg", width: "16", height: "16", fill: "none" } }, "svg", e.$attrs, !1), [e.$attrs["svg-title"] ? t("title", [e._v(e._s(e.$attrs["svg-title"]))]) : e._e(), t("path", { attrs: { fill: "#001222", d: "M7.25434 12.1937L3.00011 7.93952L1.93945 9.00018L8.00011 15.0608L14.0608 9.00018L13.0001 7.93952L8.75433 12.1853L8.74316 1.24951L7.24316 1.25104L7.25434 12.1937Z" } })]);
+}, $ = [], R = /* @__PURE__ */ n(
+  T,
+  x,
+  $,
+  !1,
+  null,
+  null
+);
+const m = R.exports, C = {
+  "en-US": {
+    moveDown: "Move down",
+    moveLeft: "Move left",
+    moveRight: "Move right",
+    moveToTheBottom: "Move to the bottom",
+    moveToTheTop: "Move to the top",
+    moveUp: "Move up",
+    reorderLabel: "Reorder {label}"
+  },
+  "ja-JP": {
+    moveDown: "下に移動",
+    moveLeft: "左に移動",
+    moveRight: "右に移動",
+    moveToTheBottom: "一番下に移動",
+    moveToTheTop: "一番上に移動",
+    moveUp: "上に移動",
+    reorderLabel: "{label}を並べ替え"
+  },
+  "pt-BR": {
+    moveDown: "Mover para baixo",
+    moveLeft: "Mover para a esquerda",
+    moveRight: "Mover para a direita",
+    moveToTheBottom: "Mover para embaixo",
+    moveToTheTop: "Mover para o topo",
+    moveUp: "Mover para cima",
+    reorderLabel: "Reordenar {label}"
+  }
+}, B = {
+  i18n: { messages: C },
+  name: "bento-draggable-handle"
+}, D = /* @__PURE__ */ u({
+  ...B,
+  props: {
+    condensed: { default: !1 },
+    disabledMenus: { default: () => ({}) },
+    label: null,
+    variant: { default: "up-and-down" }
+  },
+  emits: ["move-bottom", "move-down", "move-left", "move-right", "move-top", "move-up"],
+  setup(a, { emit: e }) {
+    const t = a, { t: o } = _(), v = s(
+      () => ({
+        "aria-label": o("reorderLabel", { label: t.label }),
+        condensed: t.condensed,
+        variant: "tertiary"
+      })
+    ), p = s(() => {
+      const r = {
+        up: {
+          text: o("moveUp"),
+          handler: () => e("move-up"),
+          disabled: t.disabledMenus.up,
+          icon: d
+        },
+        down: {
+          text: o("moveDown"),
+          handler: () => e("move-down"),
+          disabled: t.disabledMenus.down,
+          icon: m
+        },
+        left: {
+          text: o("moveLeft"),
+          handler: () => e("move-left"),
+          disabled: t.disabledMenus.left,
+          icon: b
+        },
+        right: {
+          text: o("moveRight"),
+          handler: () => e("move-right"),
+          disabled: t.disabledMenus.right,
+          icon: h
+        },
+        top: {
+          text: o("moveToTheTop"),
+          handler: () => e("move-top"),
+          disabled: t.disabledMenus.top,
+          icon: d
+        },
+        bottom: {
+          text: o("moveToTheBottom"),
+          handler: () => e("move-bottom"),
+          disabled: t.disabledMenus.bottom,
+          icon: m
+        }
+      };
+      return t.variant === "up-and-down" ? [
+        r.up,
+        // Divider added after "Move down"
+        {
+          ...r.down,
+          addDivider: !0
+        },
+        r.top,
+        r.bottom
+      ] : [
+        r.up,
+        r.down,
+        r.left,
+        // Divider added after "Move right"
+        {
+          ...r.right,
+          addDivider: !0
+        },
+        r.top,
+        r.bottom
+      ];
+    });
+    return { __sfc: !0, t: o, props: t, emit: e, buttonComputedProps: v, menuData: p, BentoMenu: c, GrabIcon: f };
+  }
+});
+var I = function() {
+  var e = this, t = e._self._c, o = e._self._setupProxy;
+  return t(o.BentoMenu, { staticClass: "b-draggable-handle", attrs: { data: o.menuData, "menu-width": 250, button: o.buttonComputedProps }, scopedSlots: e._u([{ key: "iconLeft", fn: function() {
+    return [t("span", { staticClass: "b-draggable-handle__icon" }, [t(o.GrabIcon, { attrs: { "aria-hidden": "true" } })], 1)];
+  }, proxy: !0 }]) });
+}, A = [], U = /* @__PURE__ */ n(
+  D,
+  I,
+  A,
+  !1,
+  null,
+  "8b3d7ce1"
+);
+const j = U.exports;
+export {
+  j as BentoDraggableHandle
+};
+//# sourceMappingURL=draggable-handle.js.map

package/dist/draggable-handle.js.map

@@ -0,0 +1 @@
+{"version":3,"file":"draggable-handle.js","sources":["../../ui-assets/icons-16/dist/vue/arrow-top.vue","../../ui-assets/icons-16/dist/vue/arrow-bottom.vue","../src/components/draggable-handle/draggable-handle.vue"],"sourcesContent":["\n<template>\n    <svg role=\"img\" v-bind=\"$attrs\" class=\"ui-assets-icons-16\" xmlns=\"http://www.w3.org/2000/svg\" width=\"16\" height=\"16\" fill=\"none\"><title v-if=\"$attrs['svg-title']\">{{ $attrs['svg-title'] }}</title><path fill=\"#001222\" d=\"M8.75023 3.81089L13.0001 8.06077L14.0608 7.00011L8.00011 0.939453L1.93945 7.00011L3.00011 8.06077L7.25023 3.81066V14.7502H8.75023V3.81089Z\"/></svg>\n</template>\n<script>\n    import '../css/main.css';\n\n    let uuid = 0;\n\n    export default {\n        beforeCreate() {\n            this.uuid = uuid.toString();\n            uuid += 1;\n        },\n    };\n</script>\n","\n<template>\n    <svg role=\"img\" v-bind=\"$attrs\" class=\"ui-assets-icons-16\" xmlns=\"http://www.w3.org/2000/svg\" width=\"16\" height=\"16\" fill=\"none\"><title v-if=\"$attrs['svg-title']\">{{ $attrs['svg-title'] }}</title><path fill=\"#001222\" d=\"M7.25434 12.1937L3.00011 7.93952L1.93945 9.00018L8.00011 15.0608L14.0608 9.00018L13.0001 7.93952L8.75433 12.1853L8.74316 1.24951L7.24316 1.25104L7.25434 12.1937Z\"/></svg>\n</template>\n<script>\n    import '../css/main.css';\n\n    let uuid = 0;\n\n    export default {\n        beforeCreate() {\n            this.uuid = uuid.toString();\n            uuid += 1;\n        },\n    };\n</script>\n","<template>\n    <bento-menu class=\"b-draggable-handle\" :data=\"menuData\" :menu-width=\"250\" :button=\"buttonComputedProps\">\n        <template #iconLeft>\n            <span class=\"b-draggable-handle__icon\">\n                <grab-icon aria-hidden=\"true\" />\n            </span>\n        </template>\n    </bento-menu>\n</template>\n\n<script setup lang=\"ts\">\n    import { computed } from 'vue';\n    import { BentoMenu, type BentoMenuItem, type BentoMenuProps } from '@/components/menu';\n    import { type BentoDraggableHandleProps } from './draggable-handle.types';\n    import { useI18n } from '@/utils/ts/i18n';\n    import GrabIcon from '@adyen/ui-assets-icons-16/vue/grab';\n    import ArrowTopIcon from '@adyen/ui-assets-icons-16/vue/arrow-top';\n    import ArrowLeftIcon from '@adyen/ui-assets-icons-16/vue/arrow-left';\n    import ArrowRightIcon from '@adyen/ui-assets-icons-16/vue/arrow-right';\n    import ArrowBottomIcon from '@adyen/ui-assets-icons-16/vue/arrow-bottom';\n\n    import messages from './messages.json';\n\n    type MessageSchema = (typeof messages)['en-US'];\n    const { t } = useI18n<{ message: MessageSchema }>({ messages });\n\n    const props = defineProps({\n  condensed: { default: false },\n  disabledMenus: { default: () => ({}) },\n  label: null,\n  variant: { default: 'up-and-down' }\n});\n    const emit = defineEmits([\"move-bottom\", \"move-down\", \"move-left\", \"move-right\", \"move-top\", \"move-up\"]);\n\n    const buttonComputedProps = computed(\n        () =>\n            ({\n                'aria-label': t('reorderLabel', { label: props.label }),\n                condensed: props.condensed,\n                variant: 'tertiary',\n            }) as BentoMenuProps['button']\n    );\n\n    /**\n     * Renders the menus for the draggable handle.\n     */\n    const menuData = computed(() => {\n        const MENUS: {\n            [key: string]: BentoMenuItem;\n        } = {\n            up: {\n                text: t('moveUp'),\n                handler: () => emit('move-up'),\n                disabled: props.disabledMenus.up,\n                icon: ArrowTopIcon,\n            },\n            down: {\n                text: t('moveDown'),\n                handler: () => emit('move-down'),\n                disabled: props.disabledMenus.down,\n                icon: ArrowBottomIcon,\n            },\n            left: {\n                text: t('moveLeft'),\n                handler: () => emit('move-left'),\n                disabled: props.disabledMenus.left,\n                icon: ArrowLeftIcon,\n            },\n            right: {\n                text: t('moveRight'),\n                handler: () => emit('move-right'),\n                disabled: props.disabledMenus.right,\n                icon: ArrowRightIcon,\n            },\n            top: {\n                text: t('moveToTheTop'),\n                handler: () => emit('move-top'),\n                disabled: props.disabledMenus.top,\n                icon: ArrowTopIcon,\n            },\n            bottom: {\n                text: t('moveToTheBottom'),\n                handler: () => emit('move-bottom'),\n                disabled: props.disabledMenus.bottom,\n                icon: ArrowBottomIcon,\n            },\n        };\n\n        // Render the menus and dividers according to the variant\n        return props.variant === 'up-and-down'\n            ? [\n                  MENUS.up,\n                  // Divider added after \"Move down\"\n                  {\n                      ...MENUS.down,\n                      addDivider: true,\n                  },\n                  MENUS.top,\n                  MENUS.bottom,\n              ]\n            : [\n                  MENUS.up,\n                  MENUS.down,\n                  MENUS.left,\n                  // Divider added after \"Move right\"\n                  {\n                      ...MENUS.right,\n                      addDivider: true,\n                  },\n                  MENUS.top,\n                  MENUS.bottom,\n              ];\n    });\n</script>\n\n<script lang=\"ts\">\n    /**\n     * Bento drag and drop handle component.\n     *\n     * @example\n     * import { BentoDraggableHandle } from '@adyen/bento-vue2';\n     *\n     * export default {\n     *     components: { BentoDraggableHandle },\n     *     template: `\n     *          <bento-draggable-handle\n     *              bottom\n     *              condensed\n     *              down\n     *              left\n     *              right\n     *              top\n     *              up\n     *              \\@move-bottom=\"moveBottom(index)\"\n     *              \\@move-down=\"moveDown(index)\"\n     *              \\@move-left=\"moveLeft(index)\"\n     *              \\@move-right=\"moveRight(index)\"\n     *              \\@move-top=\"moveTop(index)\"\n     *              \\@move-up=\"moveUp(index)\"\n     *          />\n     *     `,\n     *     setup() {\n     *          const moveBottom = () => {}\n     *          const moveDown = () => {}\n     *          const moveLeft = () => {}\n     *          const moveRight = () => {}\n     *          const moveTop = () => {}\n     *          const moveUp = () => {}\n     *     }\n     * }\n     */\n    export default {\n        i18n: { messages },\n        name: 'bento-draggable-handle',\n    };\n</script>\n\n<style lang=\"scss\" scoped src=\"./draggable-handle.scss\" />\n"],"names":["uuid$1","_sfc_main$2","uuid","_sfc_main$1","__default__","messages","t","useI18n","buttonComputedProps","computed","props","menuData","MENUS","emit","ArrowTopIcon","ArrowBottomIcon","ArrowLeftIcon","ArrowRightIcon"],"mappings":";;;;;;;;;AAOA,IAAAA,IAAA;AAEA,MAAAC,IAAA;AAAA,EACA,eAAA;AACA,SAAA,OAAAD,EAAA,SAAA,GACAA,KAAA;AAAA,EACA;AACA;;;;;;;;;;;;;ACPA,IAAAE,IAAA;AAEA,MAAAC,IAAA;AAAA,EACA,eAAA;AACA,SAAA,OAAAD,EAAA,SAAA,GACAA,KAAA;AAAA,EACA;AACA;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;GCyIIE,IAAA;AAAA,EAAe,MAAA,EAAA,UAAAC,EAAA;AAAA,EACM,MAAA;AAErB;;;;;;;;;;iBAlIA,EAAA,GAAAC,EAAA,IAAAC,EAAA,GAUAC,IAAAC;AAAA,MAA4B,OAAA;AAAA,QAEnB,cAAAH,EAAA,gBAAA,EAAA,OAAAI,EAAA,MAAA,CAAA;AAAA,QACyD,WAAAA,EAAA;AAAA,QACrC,SAAA;AAAA,MACR;AAAA,IACb,GAMRC,IAAAF,EAAA,MAAA;AACI,YAAAG,IAAA;AAAA,QAEI,IAAA;AAAA,UACI,MAAAN,EAAA,QAAA;AAAA,UACgB,SAAA,MAAAO,EAAA,SAAA;AAAA,UACa,UAAAH,EAAA,cAAA;AAAA,UACC,MAAAI;AAAA,QACxB;AAAA,QACV,MAAA;AAAA,UACM,MAAAR,EAAA,UAAA;AAAA,UACgB,SAAA,MAAAO,EAAA,WAAA;AAAA,UACa,UAAAH,EAAA,cAAA;AAAA,UACD,MAAAK;AAAA,QACxB;AAAA,QACV,MAAA;AAAA,UACM,MAAAT,EAAA,UAAA;AAAA,UACgB,SAAA,MAAAO,EAAA,WAAA;AAAA,UACa,UAAAH,EAAA,cAAA;AAAA,UACD,MAAAM;AAAA,QACxB;AAAA,QACV,OAAA;AAAA,UACO,MAAAV,EAAA,WAAA;AAAA,UACgB,SAAA,MAAAO,EAAA,YAAA;AAAA,UACa,UAAAH,EAAA,cAAA;AAAA,UACF,MAAAO;AAAA,QACxB;AAAA,QACV,KAAA;AAAA,UACK,MAAAX,EAAA,cAAA;AAAA,UACqB,SAAA,MAAAO,EAAA,UAAA;AAAA,UACQ,UAAAH,EAAA,cAAA;AAAA,UACA,MAAAI;AAAA,QACxB;AAAA,QACV,QAAA;AAAA,UACQ,MAAAR,EAAA,iBAAA;AAAA,UACqB,SAAA,MAAAO,EAAA,aAAA;AAAA,UACQ,UAAAH,EAAA,cAAA;AAAA,UACH,MAAAK;AAAA,QACxB;AAAA,MACV;AAIJ,aAAAL,EAAA,YAAA,gBAAA;AAAA,QACME,EAAA;AAAA;AAAA,QACU;AAAA,UAEN,GAAAA,EAAA;AAAA,UACa,YAAA;AAAA,QACG;AAAA,QAChBA,EAAA;AAAA,QACMA,EAAA;AAAA,MACA,IAAA;AAAA,QAEVA,EAAA;AAAA,QACUA,EAAA;AAAA,QACAA,EAAA;AAAA;AAAA,QACA;AAAA,UAEN,GAAAA,EAAA;AAAA,UACa,YAAA;AAAA,QACG;AAAA,QAChBA,EAAA;AAAA,QACMA,EAAA;AAAA,MACA;AAAA,IACV,CAAA;;;;;;;;;;;;;;;;;;"}

package/dist/dropdown.js

@@ -1,16 +1,16 @@
-import { B as r } from "./chunks/dropdown.C2pXf8Li.js";
-import { B as t } from "./chunks/dropdown-default-textbox.Cq68tN9F.js";
-import { a as p, B as d } from "./chunks/use-cached-selected-values.gDWGi5Nk.js";
-import { d as s, a as w, b as D, c as m, e as y } from "./chunks/dropdown-tag.HBM0wrEV.js";
+import { B as r } from "./chunks/dropdown.DDPfKc74.js";
+import { B as t } from "./chunks/dropdown-default-textbox.5WjhJWdh.js";
+import { d as p, a as d, b as B, c as s, e as w } from "./chunks/dropdown-tag.BnMuMIDk.js";
+import { B as m, a as y } from "./chunks/use-cached-selected-values.wn2xnwYG.js";
 export {
   r as BentoDropdown,
-  s as BentoDropdownAvatar,
-  w as BentoDropdownCountry,
-  D as BentoDropdownCurrency,
-  p as BentoDropdownEvent,
-  d as BentoDropdownLazyLoadType,
-  m as BentoDropdownPaymentMethod,
+  p as BentoDropdownAvatar,
+  d as BentoDropdownCountry,
+  B as BentoDropdownCurrency,
+  m as BentoDropdownEvent,
+  y as BentoDropdownLazyLoadType,
+  s as BentoDropdownPaymentMethod,
   t as BentoDropdownSize,
-  y as BentoDropdownTag
+  w as BentoDropdownTag
 };
 //# sourceMappingURL=dropdown.js.map

package/dist/empty-state.js

@@ -1,4 +1,4 @@
-import { B as e, b as m, c as n, a as o } from "./chunks/empty-state.DpBnqAxu.js";
+import { B as e, a as m, b as n, c as o } from "./chunks/empty-state.IiG1LXa2.js";
 export {
   e as BentoEmptyState,
   m as BentoEmptyStateImage,

package/dist/file-uploader.js

@@ -1,4 +1,4 @@
-import { f as r } from "./chunks/file-uploader.CnOqfuI-.js";
+import { f as r } from "./chunks/file-uploader.BU1V40qK.js";
 export {
   r as BentoFileUploader
 };

package/dist/filter-bar.js

@@ -1,4 +1,4 @@
-import { a, B as r, c as B, b as n, d as o } from "./chunks/filter-bar.CnJAxz9B.js";
+import { B as a, a as r, b as B, c as n, d as o } from "./chunks/filter-bar.UdXQf_RN.js";
 export {
   a as BentoBaseFilter,
   r as BentoFilterBar,

package/dist/focus-trap.js

@@ -1,4 +1,4 @@
-import { B as a } from "./chunks/focus-trap.CNIU5jOz.js";
+import { B as a } from "./chunks/focus-trap.DMc1wL3A.js";
 export {
   a as BentoFocusTrap
 };

package/dist/form-layout.js

@@ -1,4 +1,4 @@
-import { f as a, a as e, c as r, b as m } from "./chunks/form-layout-title.CdC1T4gs.js";
+import { f as a, a as e, b as r, c as m } from "./chunks/form-layout-title.Bbq05nMT.js";
 export {
   a as BentoFormLayout,
   e as BentoFormLayoutFieldTip,

package/dist/header-with-views.js

@@ -1,4 +1,4 @@
-import { h as r } from "./chunks/header-with-views.Dc9LUYNY.js";
+import { h as r } from "./chunks/header-with-views.DX8EXLMJ.js";
 export {
   r as BentoHeaderWithViews
 };

package/dist/header.js

@@ -1,4 +1,4 @@
-import { B as r } from "./chunks/header.BmtlQmPs.js";
+import { B as r } from "./chunks/header.YECm2GAh.js";
 export {
   r as BentoHeader
 };