@adyen/bento-vue2 1.89.2 → 1.91.0

package/dist/draggable-handle.js

@@ -1,149 +0,0 @@
-import { defineComponent as u, computed as s } from "vue";
-import { f as c } from "./chunks/button-actions.BLk114As.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

@@ -1 +0,0 @@
-{"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;;;;;;;;;;;;;;;;;;"}