@adyen/bento-vue3 1.7.0 → 1.8.0

package/dist/popover.js

@@ -1,362 +1,6 @@
-import { defineComponent as h, computed as r, resolveComponent as i, openBlock as o, createBlock as b, withCtx as _, createTextVNode as L, toDisplayString as I, normalizeClass as B, createVNode as d, ref as w, toRefs as E, Transition as O, createElementBlock as l, createCommentVNode as n, renderSlot as g, createElementVNode as V } from "vue";
-import { u as N } from "./chunks/use-has-slot.4d98bf29.js";
-import { u as D } from "./chunks/aria-label.ac9651a5.js";
-import { c as R, a as S, b as F } from "./chunks/index.bcc58fdd.js";
-import { B as j, a as $ } from "./chunks/index.2bd3812b.js";
-import { _ as C } from "./chunks/_plugin-vue_export-helper.dad06003.js";
-import { a as U } from "./chunks/button.e5177388.js";
-import { C as q } from "./chunks/cross.5c36a670.js";
-import { BentoButtonActions as z, BentoButtonActionsLayout as P } from "./button.js";
-import "./assets/index9.css";
-const T = { ...R }, H = h({
-  components: { BentoTypography: j },
-  props: {
-    /**
-     * Indicates if the popover contains an image.
-     */
-    isImageTitle: { type: Boolean, default: !1 },
-    /**
-     * Indicates the title you want to give the popover.
-     */
-    title: { type: String, default: null }
-  },
-  setup(e) {
-    const t = r(() => !e.isImageTitle), a = r(
-      () => e.isImageTitle ? $.SUBTITLE : $.BODY
-    );
-    return {
-      // Values
-      isStrongest: t,
-      titleVariant: a
-    };
-  }
-});
-function M(e, t, a, c, u, m) {
-  const s = i("bento-typography");
-  return o(), b(s, {
-    strongest: e.isStrongest,
-    variant: e.titleVariant,
-    el: "span"
-  }, {
-    default: _(() => [
-      L(I(e.title), 1)
-    ]),
-    _: 1
-  }, 8, ["strongest", "variant"]);
-}
-const Y = /* @__PURE__ */ C(H, [["render", M]]), G = h({
-  name: "bento-popover-dismiss-button",
-  components: { BentoButton: U, CrossIcon: q },
-  props: {
-    onImage: {
-      type: Boolean,
-      default: !1
-    }
-  },
-  setup(e) {
-    return {
-      // Values
-      conditionalClass: r(() => ({ "b-popover-dismiss-button--on-image": e.onImage }))
-    };
-  }
-});
-function J(e, t, a, c, u, m) {
-  const s = i("cross-icon"), p = i("bento-button");
-  return o(), b(p, {
-    class: B(e.conditionalClass),
-    variant: "tertiary",
-    onClick: t[0] || (t[0] = (f) => e.$emit("click"))
-  }, {
-    iconLeft: _(() => [
-      d(s, { "svg-title": "dismiss" })
-    ]),
-    _: 1
-  }, 8, ["class"]);
-}
-const K = /* @__PURE__ */ C(G, [["render", J], ["__scopeId", "data-v-df01cfb8"]]);
-var A;
-const Q = h({
-  name: "bento-popover",
-  components: {
-    BentoButtonActions: z,
-    BentoPopoverDismissButton: K,
-    BentoPopoverTitle: Y,
-    PopperContainer: S
-  },
-  inheritAttrs: !0,
-  // Have to do this to be able to add class for data picker
-  props: {
-    /**
-     * List of actions that will be used to render the buttons.
-     * First element in the list will be rendered as "primary".
-     * All elements after the first will be rendered as "secondary".
-     *
-     * Each object in the list should have a `title`, an `event` and
-     * (optional) a Vue `icon` from the library `@adyen/ui-assets-icons-16`.
-     *
-     * `title`: Button's text.
-     *
-     * `event`: Event triggered when clicking the Button.
-     *
-     * `icon`: Vue Icon from the library `@adyen/ui-assets-icons-16`.
-     *
-     * ```
-     * [{
-     *   title: 'Primary',
-     *   event: () => { ... },
-     *   icon: FourPeopleIcon
-     * }, {
-     *   title: 'Secondary',
-     *   event: () => { ... }
-     * }]
-     * ```
-     */
-    actions: {
-      type: Array,
-      default: null
-    },
-    /**
-     * Defines the layout in which the button actions is presented.
-     * It can be one of:
-     *
-     * @values BUTTONS_END
-     * @values FILL_CONTAINER
-     * @values SPACE_BETWEEN
-     * @values VERTICAL_STACK
-     */
-    actionsLayout: {
-      type: String,
-      default: P.BUTTONS_END,
-      validator: (e) => Object.values(P).includes(e)
-    },
-    /**
-     * @deprecated from version 2.0.0. Use the aria-label attribute instead.
-     */
-    /**
-     * Defines a string value that provides an accessible name for the popover.
-     */
-    ariaLabel: {
-      type: String,
-      default: null
-    },
-    /**
-     * Adds a divider line to the actions section, reduces the top/bottom paddings and removes all padding in the "default" slot.
-     */
-    divider: {
-      type: Boolean,
-      default: !1
-    },
-    /**
-     * Supports disabling focus trap functionality to avoid scroll into view behavior when we don't need it.
-     * */
-    disableFocusTrap: {
-      type: Boolean,
-      default: !1
-    },
-    /**
-     * Adds a "dismiss" icon that triggers the "dismiss" event. Requires the `title` prop to be set.
-     */
-    dismissible: {
-      type: Boolean,
-      default: !1
-    },
-    /**
-     * Allows to configure to fallback position to the one specified, it could be ['right', 'top', ...].
-     * Useful when not using auto as starting placement.
-     * https://floating-ui.com/docs/flip#fallbackplacements
-     */
-    fallbackPosition: {
-      type: Array,
-      default: () => ["bottom-start", "right-start", "top-start", "left-start"]
-    },
-    /**
-     * Sets the size of the container to fit its content
-     */
-    fitContent: { type: Boolean, default: !1 },
-    /**
-     * Instructs popover to be visible outside of the containing container.
-     * Useful when component would be used in limited containers like Modal, Side panel, etc.
-     * @see {@link https://floating-ui.com/docs/usefloating#strategy}
-     */
-    fixedPositioning: {
-      type: Boolean,
-      default: !1
-    },
-    /**
-     * Toggles the popover open and closed
-     */
-    open: {
-      type: Boolean,
-      default: !1
-    },
-    /**
-     * Displays the popover in a large size.
-     */
-    large: {
-      type: Boolean,
-      default: !1
-    },
-    /**
-     * @deprecated
-     * NOTE: This property no longer functions since moving to the floating-ui framework.
-     */
-    modifiers: { type: Array, default: null },
-    /**
-     * Popover's position relative to the target element.
-     * Possible values are:
-     * 'auto',    'auto-start',    'auto-end',
-     * 'top',     'top-start',     'top-end'
-     * 'right',   'right-start',   'right-end'
-     * 'bottom',  'bottom-start',  'bottom-end'
-     * 'left',    'left-start',    'left-end'
-     */
-    position: {
-      type: String,
-      default: T.BOTTOM_START,
-      validator: (e) => Object.values(T).includes(e)
-    },
-    /**
-     * Displays the popover in a small size.
-     */
-    small: {
-      type: Boolean,
-      default: !1
-    },
-    /**
-     * Indicates the title you want to give the popover.
-     */
-    title: {
-      type: String,
-      default: null
-    },
-    /**
-     * Popover's target element.
-     * The popover will position itself relatively to target element, in specified position.
-     */
-    targetElement: {
-      type: (A = S.props) == null ? void 0 : A.targetElement.type,
-      required: !0
-    },
-    /**
-     * Displays the popover without padding.
-     */
-    withoutSpace: {
-      type: Boolean,
-      default: !1
-    }
-  },
-  emits: ["dismiss", "placement"],
-  setup(e, { emit: t, attrs: a, slots: c }) {
-    const u = r(() => {
-      var k;
-      return {
-        id: (k = a.id) == null ? void 0 : k.toString()
-      };
-    }), m = w(a["aria-label"]), { ariaLabel: s, title: p } = E(e), f = D({
-      ariaLabel: m.value,
-      // TODO: take this line away when the aria-label props is removed
-      label: s,
-      defaultFallback: p
-    }), v = r(() => ({
-      "b-popover--small": e.small && !e.large,
-      "b-popover--with-divider": !!e.divider,
-      "b-popover--large": e.large && !e.small,
-      "b-popover--fit-content": e.fitContent,
-      "b-popover--without-space": e.withoutSpace
-    })), y = r(() => ({
-      "b-popover__content--with-title": !!e.title
-    }));
-    return {
-      // Values
-      computedAriaLabel: f,
-      conditionalClasses: v,
-      contentConditionalClasses: y,
-      computedAttributes: u,
-      // Enums
-      PopperContainerAriaRole: F,
-      // Events
-      dismissPopover: () => t("dismiss"),
-      // Methods
-      hasSlot: N(c)
-    };
-  }
-});
-const W = {
-  key: 0,
-  class: "b-popover__image"
-}, X = {
-  key: 0,
-  class: "b-popover__image-dismiss-button"
-}, Z = {
-  key: 1,
-  class: "b-popover__header"
-}, x = { class: "b-popover__header-title" }, ee = { key: 0 }, te = {
-  key: 3,
-  class: "b-popover__footer"
-};
-function oe(e, t, a, c, u, m) {
-  const s = i("bento-popover-dismiss-button"), p = i("bento-popover-title"), f = i("bento-button-actions"), v = i("popper-container");
-  return o(), b(O, { name: "b-popover__animation" }, {
-    default: _(() => [
-      e.open ? (o(), b(v, {
-        key: 0,
-        id: e.computedAttributes.id,
-        "aria-role": e.PopperContainerAriaRole.POPOVER,
-        "aria-label": e.computedAriaLabel,
-        arrow: { classes: ["b-popover__arrow"] },
-        "disabled-focus-trap": e.disableFocusTrap,
-        class: B([e.conditionalClasses, "b-popover"]),
-        "fallback-position": e.fallbackPosition,
-        "fixed-positioning": e.fixedPositioning,
-        offset: [0, 2],
-        position: e.position,
-        "target-element": e.targetElement,
-        onPlacement: t[0] || (t[0] = (y) => e.$emit("placement", y))
-      }, {
-        default: _(() => [
-          e.hasSlot("image") ? (o(), l("div", W, [
-            e.dismissible ? (o(), l("div", X, [
-              d(s, {
-                "on-image": "",
-                onClick: e.dismissPopover
-              }, null, 8, ["onClick"])
-            ])) : n("", !0),
-            g(e.$slots, "image", {}, void 0, !0)
-          ])) : n("", !0),
-          e.title ? (o(), l("div", Z, [
-            V("div", x, [
-              e.hasSlot("headerIcon") ? g(e.$slots, "headerIcon", { key: 0 }, void 0, !0) : n("", !0),
-              d(p, {
-                title: e.title,
-                "is-image-title": !!e.hasSlot("image")
-              }, null, 8, ["title", "is-image-title"])
-            ]),
-            e.dismissible && !e.hasSlot("image") ? (o(), l("div", ee, [
-              d(s, { onClick: e.dismissPopover }, null, 8, ["onClick"])
-            ])) : n("", !0)
-          ])) : n("", !0),
-          e.hasSlot("default") ? (o(), l("div", {
-            key: 2,
-            class: B(["b-popover__content", e.contentConditionalClasses])
-          }, [
-            g(e.$slots, "default", {}, void 0, !0)
-          ], 2)) : n("", !0),
-          e.actions ? (o(), l("div", te, [
-            d(f, {
-              actions: e.actions,
-              layout: e.actionsLayout
-            }, null, 8, ["actions", "layout"])
-          ])) : n("", !0)
-        ]),
-        _: 3
-      }, 8, ["id", "aria-role", "aria-label", "disabled-focus-trap", "class", "fallback-position", "fixed-positioning", "position", "target-element"])) : n("", !0)
-    ]),
-    _: 3
-  });
-}
-const me = /* @__PURE__ */ C(Q, [["render", oe], ["__scopeId", "data-v-4018cb13"]]);
+import { a as r, B as s } from "./chunks/index.726e2f3c.js";
 export {
-  me as BentoPopover,
-  T as BentoPopoverPositions
+  r as BentoPopover,
+  s as BentoPopoverPositions
 };
 //# sourceMappingURL=popover.js.map

package/dist/popover.js.map

@@ -1 +1 @@
-{"version":3,"file":"popover.js","sources":["../../vue2/src/components/popover/popover.types.ts","../../vue2/src/components/popover/components/popover-title/popover-title.vue","../../vue2/src/components/popover/components/popover-dismiss-button/popover-dismiss-button.vue","../../vue2/src/components/popover/popover.vue"],"sourcesContent":["import { PopperContainerPosition } from '../popper-container';\n\n/**\n * @deprecated for usage with properties since version 2.0. Use the string literal instead.\n */\nexport const BentoPopoverPositions = { ...PopperContainerPosition };\nexport type BentoPopoverPositions = PopperContainerPosition;\n","<template>\n    <bento-typography :strongest=\"isStrongest\" :variant=\"titleVariant\" el=\"span\">\n        {{ title }}\n    </bento-typography>\n</template>\n\n<script lang=\"ts\">\n    import { computed, defineComponent } from 'vue';\n    import { BentoTypography, BentoTypographyVariant } from '@/components/typography';\n\n    export default defineComponent({\n        components: { BentoTypography },\n        props: {\n            /**\n             * Indicates if the popover contains an image.\n             */\n            isImageTitle: { type: Boolean, default: false },\n\n            /**\n             * Indicates the title you want to give the popover.\n             */\n            title: { type: String, default: null },\n        },\n        setup(props) {\n            // Use strongest only when it has no image\n            const isStrongest = computed(() => !props.isImageTitle);\n\n            // If an image is present, change the variant from BODY to SUBTITLE and remove the \"strongest\" property of the title\n            const titleVariant = computed(() =>\n                props.isImageTitle ? BentoTypographyVariant.SUBTITLE : BentoTypographyVariant.BODY\n            );\n\n            return {\n                // Values\n                isStrongest,\n                titleVariant,\n            };\n        },\n    });\n</script>\n","<template>\n    <bento-button :class=\"conditionalClass\" variant=\"tertiary\" @click=\"$emit('click')\">\n        <template #iconLeft>\n            <cross-icon svg-title=\"dismiss\" />\n        </template>\n    </bento-button>\n</template>\n\n<script lang=\"ts\">\n    import { computed, defineComponent } from 'vue';\n    import { BentoButton } from '@/components/button';\n    import CrossIcon from '@adyen/ui-assets-icons-16/vue/cross';\n\n    export default defineComponent({\n        name: 'bento-popover-dismiss-button',\n        components: { BentoButton, CrossIcon },\n        props: {\n            onImage: {\n                type: Boolean,\n                default: false,\n            },\n        },\n        setup(props) {\n            const conditionalClass = computed(() => ({ 'b-popover-dismiss-button--on-image': props.onImage }));\n\n            return {\n                // Values\n                conditionalClass,\n            };\n        },\n    });\n</script>\n\n<style lang=\"scss\" scoped src=\"./popover-dismiss-button.scss\" />\n","<template>\n    <Transition name=\"b-popover__animation\">\n        <popper-container\n            v-if=\"open\"\n            :id=\"computedAttributes['id']\"\n            :aria-role=\"PopperContainerAriaRole.POPOVER\"\n            :aria-label=\"computedAriaLabel\"\n            :arrow=\"{ classes: ['b-popover__arrow'] }\"\n            :disabled-focus-trap=\"disableFocusTrap\"\n            :class=\"conditionalClasses\"\n            :fallback-position=\"fallbackPosition\"\n            :fixed-positioning=\"fixedPositioning\"\n            :offset=\"[0, 2]\"\n            :position=\"position\"\n            :target-element=\"targetElement\"\n            class=\"b-popover\"\n            @placement=\"$emit('placement', $event)\"\n        >\n            <div v-if=\"hasSlot('image')\" class=\"b-popover__image\">\n                <div v-if=\"dismissible\" class=\"b-popover__image-dismiss-button\">\n                    <bento-popover-dismiss-button on-image @click=\"dismissPopover\" />\n                </div>\n                <slot name=\"image\"></slot>\n            </div>\n            <div v-if=\"title\" class=\"b-popover__header\">\n                <div class=\"b-popover__header-title\">\n                    <slot v-if=\"hasSlot('headerIcon')\" name=\"headerIcon\"></slot>\n                    <bento-popover-title :title=\"title\" :is-image-title=\"!!hasSlot('image')\" />\n                </div>\n                <div v-if=\"dismissible && !hasSlot('image')\">\n                    <bento-popover-dismiss-button @click=\"dismissPopover\" />\n                </div>\n            </div>\n\n            <div v-if=\"hasSlot('default')\" class=\"b-popover__content\" :class=\"contentConditionalClasses\">\n                <slot></slot>\n            </div>\n\n            <div v-if=\"actions\" class=\"b-popover__footer\">\n                <bento-button-actions :actions=\"actions\" :layout=\"actionsLayout\"></bento-button-actions>\n            </div>\n        </popper-container>\n    </Transition>\n</template>\n\n<script lang=\"ts\">\n    import { computed, defineComponent, PropType, ref, toRefs } from 'vue';\n    import { useHasSlot } from '@/composables';\n    import { useAriaLabel } from '@/utils/ts/aria-label';\n    import { PopperContainer, PopperContainerAriaRole } from '@/components/popper-container';\n    import { BentoPopoverPositions } from './popover.types';\n    import { BentoButtonActions, BentoButtonActionsLayout, BentoButtonActionsList } from '@/components/button';\n    import BentoPopoverTitle from './components/popover-title/popover-title.vue';\n    import BentoPopoverDismissButton from './components/popover-dismiss-button/popover-dismiss-button.vue';\n    import { Placement } from '@floating-ui/vue';\n\n    /**\n     * Example description of the component...\n     *\n     * @example\n     * import { BentoPopover } from '@adyen/adl-vue2';\n     *\n     * export default {\n     *     components: { BentoPopover },\n     *     template: `\n     *          <bento-popover id=\"your-popover-id\">\n     *              ...Example code of the component\n     *          </bento-popover>\n     *     `\n     * }\n     */\n    export default defineComponent({\n        name: 'bento-popover',\n        components: {\n            BentoButtonActions,\n            BentoPopoverDismissButton,\n            BentoPopoverTitle,\n            PopperContainer,\n        },\n        inheritAttrs: true, // Have to do this to be able to add class for data picker\n        props: {\n            /**\n             * List of actions that will be used to render the buttons.\n             * First element in the list will be rendered as \"primary\".\n             * All elements after the first will be rendered as \"secondary\".\n             *\n             * Each object in the list should have a `title`, an `event` and\n             * (optional) a Vue `icon` from the library `@adyen/ui-assets-icons-16`.\n             *\n             * `title`: Button's text.\n             *\n             * `event`: Event triggered when clicking the Button.\n             *\n             * `icon`: Vue Icon from the library `@adyen/ui-assets-icons-16`.\n             *\n             * ```\n             * [{\n             *   title: 'Primary',\n             *   event: () => { ... },\n             *   icon: FourPeopleIcon\n             * }, {\n             *   title: 'Secondary',\n             *   event: () => { ... }\n             * }]\n             * ```\n             */\n            actions: {\n                type: Array as PropType<BentoButtonActionsList>,\n                default: null,\n            },\n\n            /**\n             * Defines the layout in which the button actions is presented.\n             * It can be one of:\n             *\n             * @values BUTTONS_END\n             * @values FILL_CONTAINER\n             * @values SPACE_BETWEEN\n             * @values VERTICAL_STACK\n             */\n            actionsLayout: {\n                type: String as PropType<BentoButtonActionsLayout | `${BentoButtonActionsLayout}`>,\n                default: BentoButtonActionsLayout.BUTTONS_END,\n                validator: (value: BentoButtonActionsLayout) => Object.values(BentoButtonActionsLayout).includes(value),\n            },\n\n            /**\n             * @deprecated from version 2.0.0. Use the aria-label attribute instead.\n             */\n            /**\n             * Defines a string value that provides an accessible name for the popover.\n             */\n            ariaLabel: {\n                type: String,\n                default: null,\n            },\n\n            /**\n             * Adds a divider line to the actions section, reduces the top/bottom paddings and removes all padding in the \"default\" slot.\n             */\n            divider: {\n                type: Boolean,\n                default: false,\n            },\n\n            /**\n             * Supports disabling focus trap functionality to avoid scroll into view behavior when we don't need it.\n             * */\n            disableFocusTrap: {\n                type: Boolean,\n                default: false,\n            },\n\n            /**\n             * Adds a \"dismiss\" icon that triggers the \"dismiss\" event. Requires the `title` prop to be set.\n             */\n            dismissible: {\n                type: Boolean,\n                default: false,\n            },\n\n            /**\n             * Allows to configure to fallback position to the one specified, it could be ['right', 'top', ...].\n             * Useful when not using auto as starting placement.\n             * https://floating-ui.com/docs/flip#fallbackplacements\n             */\n            fallbackPosition: {\n                type: Array as PropType<Placement[]>,\n                default: () => ['bottom-start', 'right-start', 'top-start', 'left-start'],\n            },\n\n            /**\n             * Sets the size of the container to fit its content\n             */\n            fitContent: { type: Boolean, default: false },\n\n            /**\n             * Instructs popover to be visible outside of the containing container.\n             * Useful when component would be used in limited containers like Modal, Side panel, etc.\n             * @see {@link https://floating-ui.com/docs/usefloating#strategy}\n             */\n            fixedPositioning: {\n                type: Boolean,\n                default: false,\n            },\n\n            /**\n             * Toggles the popover open and closed\n             */\n            open: {\n                type: Boolean,\n                default: false,\n            },\n\n            /**\n             * Displays the popover in a large size.\n             */\n            large: {\n                type: Boolean,\n                default: false,\n            },\n\n            /**\n             * @deprecated\n             * NOTE: This property no longer functions since moving to the floating-ui framework.\n             */\n            modifiers: { type: Array, default: null },\n\n            /**\n             * Popover's position relative to the target element.\n             * Possible values are:\n             * 'auto',    'auto-start',    'auto-end',\n             * 'top',     'top-start',     'top-end'\n             * 'right',   'right-start',   'right-end'\n             * 'bottom',  'bottom-start',  'bottom-end'\n             * 'left',    'left-start',    'left-end'\n             */\n            position: {\n                type: String as PropType<BentoPopoverPositions | `${BentoPopoverPositions}`>,\n                default: BentoPopoverPositions.BOTTOM_START,\n                validator: (value: BentoPopoverPositions) => Object.values(BentoPopoverPositions).includes(value),\n            },\n\n            /**\n             * Displays the popover in a small size.\n             */\n            small: {\n                type: Boolean,\n                default: false,\n            },\n\n            /**\n             * Indicates the title you want to give the popover.\n             */\n            title: {\n                type: String,\n                default: null,\n            },\n\n            /**\n             * Popover's target element.\n             * The popover will position itself relatively to target element, in specified position.\n             */\n            targetElement: {\n                type: PopperContainer.props?.targetElement.type,\n                required: true,\n            },\n            /**\n             * Displays the popover without padding.\n             */\n            withoutSpace: {\n                type: Boolean,\n                default: false,\n            },\n        },\n        emits: ['dismiss', 'placement'],\n        setup(props, { emit, attrs, slots }) {\n            const computedAttributes = computed(() => ({\n                id: attrs.id?.toString() as string,\n            }));\n\n            const ariaLabelAttribute = ref(attrs['aria-label']);\n            const { ariaLabel, title } = toRefs(props);\n            const computedAriaLabel = useAriaLabel({\n                ariaLabel: ariaLabelAttribute.value as string,\n                // TODO: take this line away when the aria-label props is removed\n                label: ariaLabel,\n                defaultFallback: title,\n            });\n\n            const conditionalClasses = computed(() => ({\n                'b-popover--small': props.small && !props.large,\n                'b-popover--with-divider': !!props.divider,\n                'b-popover--large': props.large && !props.small,\n                'b-popover--fit-content': props.fitContent,\n                'b-popover--without-space': props.withoutSpace,\n            }));\n\n            const contentConditionalClasses = computed(() => ({\n                'b-popover__content--with-title': !!props.title,\n            }));\n\n            const dismissPopover = () => emit('dismiss');\n\n            return {\n                // Values\n                computedAriaLabel,\n                conditionalClasses,\n                contentConditionalClasses,\n                computedAttributes,\n\n                // Enums\n                PopperContainerAriaRole,\n\n                // Events\n                dismissPopover,\n\n                // Methods\n                hasSlot: useHasSlot(slots),\n            };\n        },\n    });\n</script>\n\n<style lang=\"scss\" scoped src=\"./popover.scss\" />\n"],"names":["BentoPopoverPositions","PopperContainerPosition","_sfc_main$2","defineComponent","BentoTypography","props","isStrongest","computed","titleVariant","BentoTypographyVariant","_component_bento_typography","resolveComponent","openBlock","createBlock","_ctx","_sfc_main$1","BentoButton","CrossIcon","_component_bento_button","normalizeClass","_cache","$event","_sfc_main","BentoButtonActions","BentoPopoverDismissButton","BentoPopoverTitle","PopperContainer","BentoButtonActionsLayout","value","_a","emit","attrs","slots","computedAttributes","ariaLabelAttribute","ref","ariaLabel","title","toRefs","computedAriaLabel","useAriaLabel","conditionalClasses","contentConditionalClasses","PopperContainerAriaRole","useHasSlot","_component_popper_container","withCtx","createElementBlock","_hoisted_1","_hoisted_2","createVNode","_component_bento_popover_dismiss_button","createCommentVNode","_hoisted_3","createElementVNode","_hoisted_4","renderSlot","_component_bento_popover_title","_hoisted_6","_component_bento_button_actions"],"mappings":"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"}
+{"version":3,"file":"popover.js","sources":[],"sourcesContent":[],"names":[],"mappings":";"}

package/dist/popper-container.js

@@ -1,4 +1,4 @@
-import { a as n, b as a, c as i, P as r, d as p } from "./chunks/index.bcc58fdd.js";
+import { a as n, b as a, c as i, P as r, d as p } from "./chunks/index.7262642e.js";
 export {
   n as PopperContainer,
   a as PopperContainerAriaRole,

package/dist/radio-group.js

@@ -1,5 +1,5 @@
 import { defineComponent as N, toRefs as w, computed as r, resolveComponent as E, openBlock as i, createElementBlock as C, normalizeClass as $, createElementVNode as O, createBlock as v, withCtx as u, renderSlot as S, createCommentVNode as h, toRef as L, watch as M, createVNode as P, Fragment as q, renderList as H, createSlots as z, createTextVNode as R, toDisplayString as D } from "vue";
-import { B as F, d as G } from "./chunks/index.2bd3812b.js";
+import { B as F, d as G } from "./chunks/index.75f3672e.js";
 import { u as Y } from "./chunks/aria-label.ac9651a5.js";
 import { g as A } from "./chunks/unique-id.a2a2b458.js";
 import { u as Z } from "./chunks/use-default-slot-validator.1169c221.js";
@@ -7,9 +7,9 @@ import { u as V } from "./chunks/use-has-slot.4d98bf29.js";
 import { g as T } from "./chunks/get-slot-text.bead058f.js";
 import { _ as U } from "./chunks/_plugin-vue_export-helper.dad06003.js";
 import { u as j } from "./chunks/use-form-layout-loading.d03e5d48.js";
-import { C as J } from "./chunks/controls-group.38b436f6.js";
-import { E as K } from "./chunks/error-message.64e1964b.js";
-import "./assets/index27.css";
+import { C as J } from "./chunks/controls-group.807b5fb0.js";
+import { E as K } from "./chunks/field-label.61679178.js";
+import "./assets/index11.css";
 var I = /* @__PURE__ */ ((e) => (e.DISABLED = "disabled", e.READONLY = "readonly", e.ERROR = "error", e))(I || {}), _ = /* @__PURE__ */ ((e) => (e.HORIZONTAL = "horizontal", e.VERTICAL = "vertical", e))(_ || {}), c = /* @__PURE__ */ ((e) => (e.UPDATE = "update:model-value", e.INPUT = "input", e))(c || {});
 const Q = N({
   name: "radio-button",

package/dist/search-bar.js

@@ -5,8 +5,8 @@ import { BentoInputField as x } from "./input-field.js";
 import { S as P } from "./chunks/search.d18f9657.js";
 import { C as T } from "./chunks/cross-circle-fill.0feb37b3.js";
 import { _ as F } from "./chunks/_plugin-vue_export-helper.dad06003.js";
-import { u as O } from "./chunks/dropdown.afff433b.js";
-import "./assets/index28.css";
+import { u as O } from "./chunks/dropdown.502e1f5c.js";
+import "./assets/index17.css";
 var m = /* @__PURE__ */ ((e) => (e.CLEAR = "clear", e.ESCAPE = "escape-pressed", e.INPUT = "input", e.UPDATE = "update:search-term", e))(m || {}), k = /* @__PURE__ */ ((e) => (e.CLEAR = "search-clear", e.INPUT = "search-input", e.UPDATE = "update:search-term", e))(k || {});
 const h = {
   "en-US": {

package/dist/segmented-control.js

@@ -1,13 +1,13 @@
 import { defineComponent as B, ref as m, computed as b, resolveComponent as v, openBlock as r, createElementBlock as g, normalizeClass as w, createElementVNode as W, createBlock as $, createCommentVNode as y, createVNode as T, withCtx as A, createTextVNode as D, toDisplayString as N, toRef as U, toRefs as E, onMounted as q, resolveDirective as F, Fragment as R, renderList as P, withDirectives as z } from "vue";
-import { B as M } from "./chunks/index.2bd3812b.js";
+import { B as M } from "./chunks/index.75f3672e.js";
 import { g as O } from "./chunks/unique-id.a2a2b458.js";
 import { C as j } from "./chunks/checkmark.83e4f1e0.js";
 import { _ as L } from "./chunks/_plugin-vue_export-helper.dad06003.js";
-import { b as G } from "./chunks/tooltip.f769eb14.js";
+import { b as G } from "./chunks/tooltip.054d2eb6.js";
 import { u as H } from "./chunks/i18n.6c402773.js";
 import { u as J } from "./chunks/aria-label.ac9651a5.js";
 import { o as K } from "./chunks/resize.a041304d.js";
-import "./assets/index30.css";
+import "./assets/index18.css";
 const Q = B({
   name: "bento-segmented-control-button",
   components: { BentoTypography: M, CheckmarkIcon: j },

package/dist/sidepanel.js

@@ -1,13 +1,13 @@
 import { defineComponent as H, ref as u, inject as x, onUnmounted as W, computed as r, watch as b, openBlock as E, createBlock as $, Transition as X, unref as s, withCtx as f, withDirectives as Z, createElementVNode as w, normalizeClass as B, createVNode as v, createCommentVNode as R, createTextVNode as ee, toDisplayString as ae, renderSlot as K, createElementBlock as V, vShow as te, nextTick as U, toRefs as se, provide as G, withKeys as le, withModifiers as ne } from "vue";
-import { a as j } from "./chunks/button.e5177388.js";
-import { B as F } from "./chunks/index.2bd3812b.js";
-import { F as ie } from "./chunks/footer-actions.1ce44374.js";
+import { a as j } from "./chunks/button.82ed953e.js";
+import { B as F } from "./chunks/index.75f3672e.js";
+import { F as ie } from "./chunks/footer-actions.cefaf1e2.js";
 import { A as oe } from "./chunks/arrow-left.cdbcc128.js";
 import { u as J } from "./chunks/i18n.6c402773.js";
 import { _ as M } from "./chunks/_plugin-vue_export-helper.dad06003.js";
-import { B as ue } from "./chunks/index.e579bc02.js";
+import { B as ue } from "./chunks/index.cf0d3be3.js";
 import { C as re } from "./chunks/cross.5c36a670.js";
-import "./assets/index25.css";
+import "./assets/index7.css";
 var h = /* @__PURE__ */ ((e) => (e.UPDATE_ACTIVE_PAGE = "update:active-page", e.UPDATE_IS_OPEN = "update:is-open", e))(h || {}), T = /* @__PURE__ */ ((e) => (e.TRANSITION_LEVEL_DEEPER = "b-sidepanel-page__animation--level-deeper", e.TRANSITION_LEVEL_UPPER = "b-sidepanel-page__animation--level-upper", e))(T || {});
 const Y = Symbol("sidepanel registerPage injection key"), z = Symbol("sidepanel config data injection key"), q = {
   "en-US": {

package/dist/status.js

@@ -1,7 +1,7 @@
 import { defineComponent as n, computed as r, resolveComponent as a, openBlock as l, createElementBlock as c, createElementVNode as p, normalizeClass as _, createVNode as d, withCtx as i, renderSlot as u } from "vue";
-import { B as m } from "./chunks/index.2bd3812b.js";
+import { B as m } from "./chunks/index.75f3672e.js";
 import { _ as b } from "./chunks/_plugin-vue_export-helper.dad06003.js";
-import "./assets/index38.css";
+import "./assets/index19.css";
 var t = /* @__PURE__ */ ((e) => (e.BLUE = "blue", e.GREEN = "green", e.GREY = "grey", e.ORANGE = "orange", e.RED = "red", e.YELLOW = "yellow", e))(t || {});
 const y = n({
   name: "bento-status",

package/dist/stepper.js

@@ -1,11 +1,11 @@
 import { defineComponent as K, ref as i, computed as a, watch as $, provide as Z, readonly as se, openBlock as d, createElementBlock as S, withDirectives as M, mergeProps as U, unref as n, toHandlers as ne, renderSlot as w, createVNode as A, withCtx as x, createTextVNode as j, toDisplayString as P, createCommentVNode as oe, pushScopeId as ae, popScopeId as le, createElementVNode as G, useSlots as ue, inject as re, onMounted as ie, normalizeClass as pe, createBlock as z, Fragment as ce, vShow as de } from "vue";
-import { B as V } from "./chunks/index.2bd3812b.js";
+import { B as V } from "./chunks/index.75f3672e.js";
 import { B as N, a as ve } from "./chunks/keyboard-navigation.ca47dfa8.js";
 import { u as _e } from "./chunks/i18n.6c402773.js";
 import { _ as H } from "./chunks/_plugin-vue_export-helper.dad06003.js";
-import { B as be } from "./chunks/base-button.7897a95e.js";
+import { B as be } from "./chunks/base-button.aa085dfa.js";
 import { C as fe } from "./chunks/checkmark-small.3e93a119.js";
-import "./assets/index35.css";
+import "./assets/index29.css";
 const me = (s) => {
   function v(r) {
     return ({ detail: u }) => {

package/dist/structured-list.js

@@ -1,4 +1,4 @@
-import { B as r, a as o } from "./chunks/index.77f35162.js";
+import { B as r, a as o } from "./chunks/index.b043371e.js";
 export {
   r as BentoStructuredList,
   o as BentoStructuredListItem

package/dist/summary-grid.js

@@ -1,13 +1,13 @@
 import { defineComponent as S, provide as P, resolveComponent as m, openBlock as i, createElementBlock as E, Fragment as j, renderList as w, createBlock as u, createSlots as O, withCtx as r, renderSlot as f, toRefs as N, computed as T, normalizeStyle as R, createElementVNode as C, createVNode as M, createTextVNode as v, toDisplayString as g, createCommentVNode as b, mergeProps as z } from "vue";
 import { u as G } from "./chunks/use-has-slot.4d98bf29.js";
 import { S as q } from "./chunks/summary-grid.keys.1d1028c2.js";
-import { G as U } from "./chunks/grid-layout.7c919507.js";
+import { G as U } from "./chunks/grid-layout.c2fe3057.js";
 import { _ } from "./chunks/_plugin-vue_export-helper.dad06003.js";
 import { BentoInfoIcon as Y } from "./info-icon.js";
-import { B as W, a as V } from "./chunks/index.2bd3812b.js";
+import { B as W, a as V } from "./chunks/index.75f3672e.js";
 import { BentoTag as X, BentoTagVariant as L } from "./tag.js";
-import { C as F } from "./chunks/copy.86236c8d.js";
-import "./assets/index26.css";
+import { C as F } from "./chunks/copy.28bd4298.js";
+import "./assets/index21.css";
 const H = S({
   name: "bento-summary-grid",
   components: { GridLayout: U },