@adyen/bento-vue3 1.69.0 → 1.70.0

package/dist/chunks/radio-group.BG8W9epW.js.map

@@ -1 +0,0 @@
-{"version":3,"file":"radio-group.BG8W9epW.js","sources":["../../../vue2/src/components/radio-group/components/radio-button/radio-button.vue","../../../vue2/src/components/radio-group/radio-group.types.ts","../../../vue2/src/components/radio-group/radio-group.vue"],"sourcesContent":["<template>\n    <div class=\"b-radio-button\" data-testid=\"radio-button-container\" :class=\"conditionalClassContainer\">\n        <radio-input\n            :id=\"radioButtonId\"\n            ref=\"radioInputRef\"\n            :aria-label=\"ariaLabel\"\n            :aria-describedby=\"hasSlot('description') ? descriptionId : ''\"\n            :checked=\"isChecked\"\n            :disabled=\"disabled\"\n            :readonly=\"readonly\"\n            :has-error=\"hasError\"\n            :value=\"value\"\n            :model-value=\"modelValue\"\n            :name=\"name\"\n            @update:model-value=\"onChange\"\n        />\n        <div>\n            <label v-if=\"hasSlot('default')\" :for=\"radioButtonId\" class=\"b-radio-button__label-container\">\n                <span v-if=\"hasSlot('default')\" class=\"b-radio-button__primary-label\">\n                    <bento-typography class=\"b-radio-button__label\" el=\"span\" variant=\"body\"><slot /></bento-typography>\n                    <bento-tag v-if=\"tag\" class=\"b-radio-button__label-tag\" v-bind=\"tag\" />\n                </span>\n                <bento-typography\n                    v-if=\"hasSlot('default') && hasSlot('description')\"\n                    :id=\"descriptionId\"\n                    class=\"b-radio-button__description\"\n                    el=\"span\"\n                    variant=\"body\"\n                >\n                    <slot name=\"description\"></slot>\n                </bento-typography>\n            </label>\n            <bento-typography v-if=\"hasSlot('content') && isChecked\" class=\"b-radio-button__content\" el=\"div\">\n                <slot name=\"content\"></slot>\n            </bento-typography>\n        </div>\n    </div>\n</template>\n\n<script setup lang=\"ts\">\n    import { BentoTag } from '@/components/tag';\n    import { BentoTypography } from '@/components/typography';\n    import { RadioInput } from '../../../internal/radio-input';\n    import { useAriaLabel } from '@/utils/ts/aria-label';\n    import { generateUid } from '@/core/utils/ts';\n    import { computed, type ComputedRef, type PropType, ref, toRefs, useSlots } from 'vue';\n    import { useDefaultSlotValidator, useHasSlot } from '@/composables';\n    import { BentoRadioButtonStateClass, type BentoRadioButtonTag, type BentoRadioButtonValue } from './radio-button.types';\n    import { getSlotText } from '@/utils/ts/get-slot-text';\n\n    const slots = useSlots();\n    const hasSlot = useHasSlot(slots);\n    const props = defineProps({\n        /**\n         * Disable the radio button (optional)\n         */\n        disabled: { type: Boolean, default: false },\n\n        /**\n         * Shows bento-radio-button in error state (optional)\n         */\n        hasError: { type: Boolean, default: false },\n\n        /**\n         * This property should not be used directly.\n         * It will be used by v-model directive on radio component.\n         */\n        modelValue: {\n            type: [String, Number] as PropType<BentoRadioButtonValue>,\n            default: null,\n        },\n\n        /**\n         * Sets the radio button to readonly (optional)\n         */\n        readonly: { type: Boolean, default: false },\n\n        /**\n         * Sets the properties of the BentoTag component that is placed next to the label.\n         * {@see BentoTag}\n         */\n        tag: { type: Object as PropType<BentoRadioButtonTag>, default: undefined },\n\n        /**\n         * Indicates the value of the input that will be returned when it's checked\n         */\n        value: {\n            type: [String, Number] as PropType<BentoRadioButtonValue>,\n            required: true,\n        },\n\n        /**\n         * Sets the name of the radio input.\n         * Used for differentiating radio groups or accessing input via form submission.\n         */\n        name: {\n            type: String,\n            default: null,\n        },\n    });\n\n    const emit = defineEmits<{\n        /**\n         * Emitted when the radio button is clicked. Enables Vue2 \"v-model\"\n         */\n        (e: 'input', value: BentoRadioButtonValue);\n\n        /**\n         * Emitted when the radio button is clicked. Enables Vue3 \"v-model\"\n         */\n        (e: 'update:model-value', value: BentoRadioButtonValue);\n    }>();\n\n    const { value } = toRefs(props);\n    const radioButtonId = generateUid('bento-radio-button');\n    const descriptionId = generateUid('description');\n    const radioInputRef = ref(null);\n\n    useDefaultSlotValidator('bento-radio-button', slots.default, slots.description);\n\n    const conditionalClassContainer = computed(() => ({\n        [`b-radio-button--${BentoRadioButtonStateClass.DISABLED}`]: props.disabled,\n        [`b-radio-button--${BentoRadioButtonStateClass.READONLY}`]: props.readonly,\n    }));\n\n    const ariaLabel = useAriaLabel({\n        ariaLabel: getSlotText(slots)('default'),\n        label: value.value as string,\n    });\n\n    const isChecked: ComputedRef<boolean> = computed(() => props.value === props.modelValue);\n\n    const onChange = () => {\n        if (!props.disabled && !props.readonly) {\n            emit('update:model-value', props.value);\n            emit('input', props.value);\n        }\n    };\n\n    const focus = () => {\n        radioInputRef.value.focus();\n    };\n\n    defineExpose({\n        focus,\n    });\n</script>\n\n<script lang=\"ts\">\n    /**\n     * Radio buttons are used when two or more options are mutually exclusive,\n     * the user can only select a single option from a list of pre-defined options.\n     * The label tag area is also clickable.\n     * Only to be used internally.\n     *\n     * @example\n     * import { BentoRadioButton } from '@adyen/bento-vue2';\n     *\n     * export default {\n     *     components: { BentoRadioButton },\n     *     template: `\n     *         <bento-radio-button\n     *             disabled\n     *             value=\"inputRadio\"\n     *             model-value.sync=\"modelValue\"\n     *         >\n     *             Label text\n     *             <template #description>Description text below label</template>\n     *             <template #content>Content shown when checked</template>\n     *         </bento-radio-button>\n     *     `,\n     *     setup() {\n     *         const modelValue = ref('anyValue')\n     *         const value = 'option-value'\n     *\n     *         return {\n     *             modelValue,\n     *             value,\n     *         }\n     *     }\n     * }\n     */\n    export default {\n        name: 'bento-radio-button',\n        model: { prop: 'modelValue' },\n    };\n</script>\n\n<style lang=\"scss\" scoped src=\"./radio-button.scss\" />\n","import type { BentoRadioButtonTag, BentoRadioButtonValue } from './components/radio-button';\n\n/**\n * @deprecated for usage with properties since version 2.0. Use the string literal instead.\n */\nexport enum BentoRadioGroupVariant {\n    HORIZONTAL = 'horizontal',\n    VERTICAL = 'vertical',\n}\n\nexport type BentoRadioGroupValue = BentoRadioButtonValue;\n\nexport interface BentoRadioGroupItem {\n    value: BentoRadioGroupValue;\n    label: string;\n    description?: string;\n    disabled?: boolean;\n    readonly?: boolean;\n    hasError?: boolean;\n    tag?: BentoRadioButtonTag;\n}\n\nexport type BentoRadioGroupItems = Array<BentoRadioGroupItem>;\n","<template>\n    <div class=\"b-radio-group\">\n        <controls-group\n            class=\"b-radio-group__buttons\"\n            :aria-describedby=\"shouldShowErrorMessage ? errorId : ''\"\n            :component-name=\"COMPONENT_NAME\"\n            :class=\"conditionalClasses\"\n            :description=\"description\"\n            :disabled=\"disabled\"\n            :form=\"formId\"\n            :label=\"label\"\n            :optional=\"optional\"\n            :required=\"required\"\n            :hide-label=\"hideLabel\"\n            :tooltip-text=\"tooltipText\"\n        >\n            <bento-radio-button\n                v-for=\"item in items\"\n                ref=\"radioButton\"\n                :key=\"item.value\"\n                :model-value=\"inputValue\"\n                :value=\"item.value\"\n                :disabled=\"disabled || item.disabled\"\n                :readonly=\"isReadOnly || item.readonly\"\n                :has-error=\"shouldShowError || item.hasError\"\n                :tag=\"item.tag\"\n                :name=\"formId || label\"\n                @update:model-value=\"onInput\"\n            >\n                <template #default>{{ item.label }}</template>\n                <template v-if=\"item.description\" #description>{{ item.description }}</template>\n                <template v-if=\"hasSlot('content') && isVertical\" #content>\n                    <slot name=\"content\"></slot>\n                </template>\n            </bento-radio-button>\n        </controls-group>\n        <error-message\n            v-if=\"shouldShowErrorMessage\"\n            :id=\"errorId\"\n            :error-message=\"errorMessage\"\n            class=\"b-radio-group__error-message\"\n        />\n    </div>\n</template>\n\n<script setup lang=\"ts\">\n    import { computed, type PropType, ref, toRef, useSlots, watch } from 'vue';\n    import { ControlsGroup, ErrorMessage } from '@/components/internal';\n    import { BentoRadioButton } from './components/radio-button';\n    import { useHasSlot } from '@/composables';\n    import { generateUid } from '@/core/utils/ts';\n    import { deprecate } from '@/utils/ts/deprecate';\n    import { type BentoRadioGroupItems, type BentoRadioGroupValue, BentoRadioGroupVariant } from './radio-group.types';\n    import { useFormLayoutFieldLoading } from '@/composables/use-form-layout-loading/use-form-layout-loading';\n\n    /**\n     * The name of the component to be used in the Vue devtools and console warnings.\n     */\n    const COMPONENT_NAME = 'bento-radio-group';\n\n    const slots = useSlots();\n    const hasSlot = useHasSlot(slots);\n\n    const emit = defineEmits<{\n        /**\n         * Emitted when an option inside the group is selected. Enables Vue2 \"v-model\"\n         */\n        (e: 'input', value: BentoRadioGroupValue);\n\n        /**\n         * Emitted when an option inside the group is selected. Enables Vue3 \"v-model\"\n         */\n        (e: 'update:model-value', value: BentoRadioGroupValue);\n    }>();\n\n    const props = defineProps({\n        /**\n         * Descriptive supporting text visbile underneath the label.\n         */\n        description: { type: String, default: null },\n\n        /**\n         * If set to true, renders all bento-radio-buttons in the group in a disabled state.\n         */\n        disabled: { type: Boolean, default: false },\n\n        /**\n         * If passed as a prop, all bento-radio-buttons in an error state and renders the string beneath the buttons.\n         */\n        errorMessage: { type: String, default: null },\n\n        /**\n         * The form id the radio group is associated with. Defaults to null, as a radio group can also be used standalone.\n         */\n        formId: { type: String, default: null },\n\n        /**\n         * If set to true, renders all bento-radio-buttons in the group in an error state.\n         *\n         * @deprecated Use \"errorMessage\" prop instead\n         */\n        hasError: { type: Boolean, default: false },\n\n        /**\n         * Shows/hides the group label.\n         */\n        hideLabel: { type: Boolean, default: null },\n\n        /**\n         * The radio group's items.\n         */\n        items: {\n            type: Array as PropType<BentoRadioGroupItems>,\n            required: true,\n        },\n\n        /**\n         * The name associated with the group. Required for accessibility purposes.\n         */\n        label: { type: String, required: true },\n\n        /**\n         * Determines the initially selected value of the group. Corresponds to the BentoRadioButtonItem's value.\n         * Defaults to no value selected.\n         */\n        modelValue: {\n            type: [Number, String] as PropType<BentoRadioGroupValue>,\n            default: null,\n        },\n\n        /**\n         * Indicates the field is optional.\n         */\n        optional: { type: Boolean, default: false },\n\n        /**\n         * If set to true, renders all bento-radio-button in the group in a readonly state.\n         */\n        readonly: { type: Boolean, default: false },\n\n        /**\n         * Indicates the field is required.\n         */\n        required: { type: Boolean, default: false },\n\n        /**\n         * Tooltip message.\n         */\n        tooltipText: { type: String, default: null },\n\n        /**\n         * The radio group's layout. It can be vertical or horizontal. Defaults to vertical.\n         */\n        variant: {\n            type: String as PropType<BentoRadioGroupVariant | `${BentoRadioGroupVariant}`>,\n            default: BentoRadioGroupVariant.VERTICAL,\n            validator: (value: BentoRadioGroupVariant) => Object.values(BentoRadioGroupVariant).includes(value),\n        },\n    });\n\n    const inputValue = toRef(props, 'modelValue');\n    const errorId = generateUid('error');\n    const { isReadOnly } = useFormLayoutFieldLoading(toRef(props, 'readonly'));\n    const radioButton = ref(null);\n\n    const shouldShowError = computed(\n        () => !props.disabled && !isReadOnly.value && (!!props.errorMessage || props.hasError)\n    );\n    const shouldShowErrorMessage = computed(() => !props.disabled && !isReadOnly.value && !!props.errorMessage);\n\n    const conditionalClasses = computed(() => ({\n        'b-radio-group__buttons--horizontal': props.variant === BentoRadioGroupVariant.HORIZONTAL,\n    }));\n\n    // Content slot logic\n    const isVertical = computed(() => props.variant === 'vertical');\n    const shouldShowSlotError = computed(() => hasSlot('content') && !isVertical?.value);\n\n    const onInput = value => {\n        emit('update:model-value', value);\n        emit('input', value);\n    };\n\n    if (props.hasError) {\n        deprecate(\n            'BentoRadioGroup \"hasError\" property',\n            `Use the BentoRadioGroup \"errorMessage\" property instead to indicate that there is a modifier error.\n                    Having the field as \"undefined\" will hide/remove the error.\n                    <bento-radio-group errorMessage=\"Error message text\" />`,\n            '2.0.0'\n        );\n    }\n\n    watch(\n        shouldShowSlotError,\n        newVal => {\n            if (newVal) {\n                throw new Error('The content slot is only available for the vertical radio group layout');\n            }\n        },\n        {\n            immediate: true,\n        }\n    );\n\n    const focus = () => {\n        radioButton.value[0].focus();\n    };\n\n    defineExpose({\n        focus,\n    });\n</script>\n\n<script lang=\"ts\">\n    /**\n     * A radio group component should be used whenever it is necessary to use a set of radio buttons\n     * This component conforms to the official WAI-ARIA guidelines for grouping controls: https://www.w3.org/WAI/tutorials/forms/grouping/\n     *\n     * import { BentoRadioGroup } from '@adyen/bento-vue2/';\n     *\n     * export default {\n     *     components: { BentoRadioGroup },\n     *     template: `\n     *             <bento-radio-group\n     *                label=\"Your group label\"\n     *                :items=\"[\n     *                    { value: 1, label: 'Your label' },\n     *                    { value: 2, label: 'Another label', description: 'Your descriptive sub label' },\n     *                 ]\"\n     *                 variant=\"horizontal\"\n     *              />\n     *     `\n     * };\n     */\n    export default {\n        name: 'bento-radio-group',\n        model: { prop: 'modelValue' },\n    };\n</script>\n\n<style lang=\"scss\" scoped src=\"./radio-group.scss\" />\n"],"names":["__default__$1","slots","useSlots","hasSlot","useHasSlot","props","__props","emit","__emit","value","toRefs","radioButtonId","generateUid","descriptionId","radioInputRef","ref","useDefaultSlotValidator","conditionalClassContainer","computed","RadioInputStateClass","ariaLabel","useAriaLabel","getSlotText","isChecked","onChange","__expose","BentoRadioGroupVariant","BentoRadioGroupVariant2","__default__","COMPONENT_NAME","inputValue","toRef","errorId","isReadOnly","useFormLayoutFieldLoading","radioButton","shouldShowError","shouldShowErrorMessage","conditionalClasses","isVertical","shouldShowSlotError","onInput","deprecate","watch","newVal"],"mappings":";;;;;;;;;;;;;;;;;GAsLIA,KAAA;AAAA,EAAe,MAAA;AAAA,EACL,OAAA,EAAA,MAAA,aAAA;AAEV;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;AAvIA,UAAAC,IAAAC,EAAA,GACAC,IAAAC,EAAAH,CAAA,GACAI,IAAAC,GAiDAC,IAAAC,GAYA,EAAA,OAAAC,EAAA,IAAAC,EAAAL,CAAA,GACAM,IAAAC,EAAA,oBAAA,GACAC,IAAAD,EAAA,aAAA,GACAE,IAAAC,EAAA,IAAA;AAEA,IAAAC,GAAA,sBAAAf,EAAA,SAAAA,EAAA,WAAA;AAEA,UAAAgB,IAAAC,EAAA,OAAA;AAAA,MAAkD,CAAA,mBAAAC,EAAA,QAAA,EAAA,GAAAd,EAAA;AAAA,MACoB,CAAA,mBAAAc,EAAA,QAAA,EAAA,GAAAd,EAAA;AAAA,IACA,EAAA,GAGtEe,IAAAC,EAAA;AAAA,MAA+B,WAAAC,GAAArB,CAAA,EAAA,SAAA;AAAA,MACY,OAAAQ,EAAA;AAAA,IAC1B,CAAA,GAGjBc,IAAAL,EAAA,MAAAb,EAAA,UAAAA,EAAA,UAAA,GAEAmB,IAAA,MAAA;AACI,MAAA,CAAAnB,EAAA,YAAA,CAAAA,EAAA,aACIE,EAAA,sBAAAF,EAAA,KAAA,GACAE,EAAA,SAAAF,EAAA,KAAA;AAAA,IACJ;AAOJ,WAAAoB,EAAA;AAAA,MAAa,OAJb,MAAA;AACI,QAAAX,EAAA,MAAA,MAAA;AAAA,MAA0B;AAAA,IAI1B,CAAA;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;AC3II,IAAAY,IAAA,kBAAAC,OACRA,EAAA,aAAA,cACAA,EAAA,WAAA,YAFQA,IAAAD,KAAA,CAAA,CAAA;uCCsORE,KAAA;AAAA,EAAe,MAAA;AAAA,EACL,OAAA,EAAA,MAAA,aAAA;AAEV;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;AApLA,UAAAC,IAAA,qBAEA5B,IAAAC,EAAA,GACAC,IAAAC,EAAAH,CAAA,GAEAM,IAAAC,GAYAH,IAAAC,GAqFAwB,IAAAC,EAAA1B,GAAA,YAAA,GACA2B,IAAApB,EAAA,OAAA,GACA,EAAA,YAAAqB,EAAA,IAAAC,EAAAH,EAAA1B,GAAA,UAAA,CAAA,GACA8B,IAAApB,EAAA,IAAA,GAEAqB,IAAAlB;AAAA,MAAwB,MAAA,CAAAb,EAAA,YAAA,CAAA4B,EAAA,UAAA,CAAA,CAAA5B,EAAA,gBAAAA,EAAA;AAAA,IACyD,GAEjFgC,IAAAnB,EAAA,MAAA,CAAAb,EAAA,YAAA,CAAA4B,EAAA,SAAA,CAAA,CAAA5B,EAAA,YAAA,GAEAiC,IAAApB,EAAA,OAAA;AAAA,MAA2C,sCAAAb,EAAA,YAAAqB,EAAA;AAAA,IACwC,EAAA,GAInFa,IAAArB,EAAA,MAAAb,EAAA,YAAA,UAAA,GACAmC,IAAAtB,EAAA,MAAAf,EAAA,SAAA,KAAA,EAAAoC,KAAA,QAAAA,EAAA,MAAA,GAEAE,IAAA,CAAAhC,MAAA;AACI,MAAAF,EAAA,sBAAAE,CAAA,GACAF,EAAA,SAAAE,CAAA;AAAA,IAAmB;AAGvB,WAAAJ,EAAA,YACIqC;AAAA,MAAA;AAAA,MACI;AAAA;AAAA;AAAA,MACA;AAAA,IAGA,GAIRC;AAAA,MAAAH;AAAA,MACI,CAAAI,MAAA;AAEI,YAAAA;AACI,gBAAA,IAAA,MAAA,wEAAA;AAAA,MACJ;AAAA,MACJ;AAAA,QACA,WAAA;AAAA,MACe;AAAA,IACf,GAOJnB,EAAA;AAAA,MAAa,OAJb,MAAA;AACI,QAAAU,EAAA,MAAA,CAAA,EAAA,MAAA;AAAA,MAA2B;AAAA,IAI3B,CAAA;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;"}

package/dist/chunks/timeline-item.DthjD14m.js

@@ -1,566 +0,0 @@
-import { defineComponent as oe, computed as m, ref as $, toRefs as ce, provide as H, nextTick as fe, resolveComponent as T, createElementBlock as v, openBlock as n, createCommentVNode as u, createElementVNode as g, createBlock as S, withCtx as h, createTextVNode as I, toDisplayString as y, createVNode as C, renderSlot as V, mergeProps as q, inject as W, onUnmounted as ve, normalizeClass as Z, Fragment as z, renderList as pe } from "vue";
-import { B as ae } from "./button.wMNce6wZ.js";
-import { B as _e } from "./textarea.CtfRoIUw.js";
-import { u as se } from "./i18n.B6g5VX0q.js";
-import { B as be } from "./toggle-button.ByyLw0Yf.js";
-import { _ as J } from "./_plugin-vue_export-helper.CHgC5LLL.js";
-import { B as he } from "./date.BZENjOb6.js";
-import { B as ge } from "./link.Di0rtpOj.js";
-import { B as ye } from "./tag.BP8fBCx-.js";
-import { B as Ne, d as Te } from "./typography.CFHvBR7L.js";
-import { a as Ee, B as Ie, S as we } from "./structured-list-item.DIwkcIMT.js";
-/* empty css              */
-import { g as Se } from "./generate-uid.NJ8tVoha.js";
-import { u as Ce } from "./use-has-slot.B7eQSabc.js";
-import { r as Me, l as ke, c as Le, t as U, g as G } from "./index.BrH1t1iu.js";
-import { c as Ae } from "./index.BxBB1rsx.js";
-import "../assets/timeline-item.css";
-var Q = 1e3 * 60, Y = 60 * 24, X = Y * 30, x = Y * 365;
-function ee(e, o) {
-  var s = arguments.length > 2 && arguments[2] !== void 0 ? arguments[2] : {};
-  Me(2, arguments);
-  var l = s.locale || ke;
-  if (!l.formatDistance)
-    throw new RangeError("locale must contain localize.formatDistance property");
-  var N = Le(e, o);
-  if (isNaN(N))
-    throw new RangeError("Invalid time value");
-  var r = Ae(s);
-  r.addSuffix = !!s.addSuffix, r.comparison = N;
-  var a, p;
-  N > 0 ? (a = U(o), p = U(e)) : (a = U(e), p = U(o));
-  var c = s.roundingMethod == null ? "round" : String(s.roundingMethod), t;
-  if (c === "floor")
-    t = Math.floor;
-  else if (c === "ceil")
-    t = Math.ceil;
-  else if (c === "round")
-    t = Math.round;
-  else
-    throw new RangeError("roundingMethod must be 'floor', 'ceil' or 'round'");
-  var E = p.getTime() - a.getTime(), _ = E / Q, f = G(p) - G(a), b = (E - f) / Q, i;
-  if (s.unit == null ? _ < 1 ? i = "second" : _ < 60 ? i = "minute" : _ < Y ? i = "hour" : b < X ? i = "day" : b < x ? i = "month" : i = "year" : i = String(s.unit), i === "second") {
-    var k = t(E / 1e3);
-    return l.formatDistance("xSeconds", k, r);
-  } else if (i === "minute") {
-    var A = t(_);
-    return l.formatDistance("xMinutes", A, r);
-  } else if (i === "hour") {
-    var B = t(_ / 60);
-    return l.formatDistance("xHours", B, r);
-  } else if (i === "day") {
-    var D = t(b / Y);
-    return l.formatDistance("xDays", D, r);
-  } else if (i === "month") {
-    var R = t(b / X);
-    return R === 12 && s.unit !== "month" ? l.formatDistance("xYears", 1, r) : l.formatDistance("xMonths", R, r);
-  } else if (i === "year") {
-    var L = t(b / x);
-    return l.formatDistance("xYears", L, r);
-  }
-  throw new RangeError("unit must be 'second', 'minute', 'hour', 'day', 'month' or 'year'");
-}
-var O = /* @__PURE__ */ ((e) => (e.BOTTOM = "bottom", e.AFTER_FIRST = "after-first", e.BEFORE_LAST = "before-last", e))(O || {}), Re = /* @__PURE__ */ ((e) => (e.SECOND = "second", e.MINUTE = "minute", e.HOUR = "hour", e.DAY = "day", e.MONTH = "month", e.YEAR = "year", e))(Re || {}), F = /* @__PURE__ */ ((e) => (e.DEFAULT = "SquareSmallIcon", e.SUCCESS = "CheckedCircleIcon", e.CRITICAL = "CrossCircleIcon", e))(F || {}), le = /* @__PURE__ */ ((e) => (e.BLACK = "black", e.BLUE = "blue", e.GREEN = "green", e.GREY = "grey", e.ORANGE = "orange", e.RED = "red", e.YELLOW = "yellow", e))(le || {});
-const re = Symbol("timeline register entry injection key"), de = Symbol("timeline config obj injection key"), te = {
-  "en-US": {
-    addNote: "Add note",
-    cancel: "Cancel"
-  },
-  "ja-JP": {
-    addNote: "メモを追加",
-    cancel: "キャンセル"
-  },
-  "pt-BR": {
-    addNote: "Adicionar anotação",
-    cancel: "Cancelar"
-  }
-}, $e = oe({
-  i18n: { messages: te },
-  name: "bento-timeline",
-  components: { BentoButton: ae, BentoButtonActions: be, BentoTextarea: _e },
-  props: {
-    /**
-     * If set to true, gives the possibility to manually add notes to the timeline via a textarea
-     */
-    addNote: {
-      type: Boolean,
-      default: !1
-    },
-    /**
-     * Object that determines the max number of items to show without clicking the show more button
-     * and where in the timeline is the show more button placed
-     */
-    showMore: {
-      type: Object,
-      default: null
-    },
-    /**
-     * Object that determines minimum amount of time for the automatic timegap indicator;
-     * Define a unit (hour, day, month) and an amount (e.g. { amount: 7, unit: 'days' }).
-     * If null, automatic timegap detection will be turned off
-     */
-    timegapLimit: {
-      type: Object,
-      default: null
-    }
-  },
-  emits: ["add-timeline-note"],
-  setup(e, { emit: o }) {
-    const { t: s } = se({ messages: te }), l = m(() => s("addNote")), N = m(() => s("cancel")), r = $(), a = (d) => {
-      r.value = d;
-    }, p = $(null), c = $(null), t = $(!1), E = async () => {
-      var d, w;
-      t.value = !t.value, await fe(), t.value ? (d = p.value.$refs.textareaElement) == null || d.focus() : (w = c.value.$el) == null || w.focus();
-    }, _ = () => {
-      o("add-timeline-note", {
-        description: r.value,
-        timestamp: { date: /* @__PURE__ */ new Date() },
-        type: "note"
-      }), E();
-    }, f = $([]), b = m(
-      () => e.showMore && f.value.length > e.showMore.limit ? f.value.length - e.showMore.limit : null
-    ), i = $(!1), { timegapLimit: k } = ce(e), A = m(() => {
-      if (!e.showMore)
-        return null;
-      const d = Array.from(f.value.keys());
-      return e.showMore.placement === O.BEFORE_LAST ? [
-        ...d.slice(0, e.showMore.limit - 1),
-        d[d.length - 1]
-      ] : e.showMore.placement === O.AFTER_FIRST ? [d[0], ...d.slice(-(e.showMore.limit - 1))] : d.slice(0, e.showMore.limit);
-    }), B = m(() => {
-      if (!e.showMore)
-        return null;
-      switch (e.showMore.placement) {
-        case O.BEFORE_LAST:
-          return e.showMore.limit - 2;
-        case O.AFTER_FIRST:
-          return 0;
-        case O.BOTTOM:
-        default:
-          return e.showMore.limit - 1;
-      }
-    }), D = (d) => () => {
-      var w;
-      f.value = (w = f.value) == null ? void 0 : w.filter((j, M) => M !== d);
-    }, R = ({ title: d, description: w, date: j }) => {
-      const M = f.value.length;
-      return f.value.push({ title: d, description: w, date: j }), { timelineEntries: f, index: M, unregisterTimelineEntry: D(M) };
-    }, L = {
-      showAll: i,
-      showMoreIndex: B,
-      hiddenItems: b,
-      visibleIndexes: A,
-      timegapLimit: k
-    };
-    return H(re, R), H(de, L), {
-      addNoteLabel: l,
-      cancelLabel: N,
-      toggleAddNote: E,
-      updateNoteContent: a,
-      addNoteToTimeline: _,
-      showAddNoteTextArea: t,
-      // refs
-      addNoteTextareaRef: p,
-      addNoteButtonRef: c
-    };
-  }
-}), Oe = { class: "b-timeline" }, Be = {
-  key: 0,
-  class: "b-timeline__add-note-section"
-}, De = { key: 1 }, je = { class: "b-timeline__items" };
-function Ue(e, o, s, l, N, r) {
-  const a = T("bento-button"), p = T("bento-textarea"), c = T("bento-button-actions");
-  return n(), v("div", Oe, [
-    e.addNote ? (n(), v("div", Be, [
-      e.showAddNoteTextArea ? u("", !0) : (n(), S(a, {
-        key: 0,
-        ref: "addNoteButtonRef",
-        variant: "tertiary",
-        onClick: e.toggleAddNote
-      }, {
-        default: h(() => [
-          I(y(e.addNoteLabel), 1)
-        ]),
-        _: 1
-      }, 8, ["onClick"])),
-      e.showAddNoteTextArea ? (n(), v("div", De, [
-        C(p, {
-          ref: "addNoteTextareaRef",
-          label: e.addNoteLabel,
-          "character-limit": 150,
-          resizable: "vertical",
-          onInput: e.updateNoteContent
-        }, null, 8, ["label", "onInput"]),
-        C(c, {
-          actions: [
-            { title: e.addNoteLabel, event: e.addNoteToTimeline },
-            { title: e.cancelLabel, event: e.toggleAddNote }
-          ]
-        }, null, 8, ["actions"])
-      ])) : u("", !0)
-    ])) : u("", !0),
-    g("ol", je, [
-      V(e.$slots, "default", {}, void 0, !0)
-    ])
-  ]);
-}
-const bt = /* @__PURE__ */ J($e, [["render", Ue], ["__scopeId", "data-v-70bcfb2c"]]);
-let ie = 0;
-const Fe = {
-  beforeCreate() {
-    this.uuid = ie.toString(), ie += 1;
-  }
-}, Ye = { key: 0 };
-function ze(e, o, s, l, N, r) {
-  return n(), v("svg", q({ role: "img" }, e.$attrs, {
-    class: "ui-assets-icons-16",
-    xmlns: "http://www.w3.org/2000/svg",
-    width: "16",
-    height: "16",
-    fill: "none"
-  }), [
-    e.$attrs["svg-title"] ? (n(), v("title", Ye, y(e.$attrs["svg-title"]), 1)) : u("", !0),
-    o[0] || (o[0] = g("path", {
-      fill: "#001222",
-      d: "M10 3.25C11.5188 3.25 12.75 4.48122 12.75 6V10C12.75 11.5188 11.5188 12.75 10 12.75H6C4.48122 12.75 3.25 11.5188 3.25 10V6C3.25 4.48122 4.48122 3.25 6 3.25H10Z"
-    }, null, -1))
-  ], 16);
-}
-const He = /* @__PURE__ */ J(Fe, [["render", ze]]), ne = {
-  "en-US": {
-    showLess: "Show less",
-    showMore: "Show {items} more",
-    timegap: "{timegap} passed between the timeline events"
-  },
-  "ja-JP": {
-    showLess: "表示内容を減らす"
-  },
-  "pt-BR": {
-    showLess: "Mostrar menos"
-  }
-}, Ve = oe({
-  name: "bento-timeline-item",
-  components: {
-    BentoButton: ae,
-    BentoDate: he,
-    BentoLink: ge,
-    BentoTag: ye,
-    BentoTypography: Ne,
-    BentoStructuredList: Ie,
-    BentoStructuredListItem: Ee,
-    SquareSmallIcon: He
-  },
-  i18n: { messages: ne },
-  props: {
-    /**
-     * Additional timestamp of the event
-     */
-    additionalTimestamp: {
-      type: Object,
-      default: null
-    },
-    /**
-     * Relevant key-value pair data to display in the event
-     */
-    dataList: {
-      type: Array,
-      default: null
-    },
-    /**
-     * Description of the event
-     */
-    description: {
-      type: String,
-      default: null
-    },
-    /**
-     * Modifier that changes the color of the timeline icon
-     * @values blue, black, green, grey, orange, red, yellow
-     */
-    status: {
-      type: String,
-      default: "black",
-      validator: (e) => Object.values(le).includes(e)
-    },
-    /**
-     * Tag props that will be passed down to inner tag component
-     */
-    tag: {
-      type: Object,
-      default: void 0
-    },
-    /**
-     * Main timestamp of the event. Used for timegap detection.
-     */
-    timestamp: {
-      type: Object,
-      required: !0
-    },
-    /**
-     * Title of the event
-     */
-    title: {
-      type: [Object, String],
-      default: null
-    },
-    /**
-     * Type of the timeline item. If set to 'note', it renders a note item in the timeline. Defaults to 'milestone'.
-     * @values milestone, note
-     */
-    type: {
-      type: String,
-      default: "milestone",
-      validator: (e) => ["milestone", "note"].includes(e)
-    },
-    /**
-     * Variant for the timeline item
-     * @values DEFAULT, SUCCESS, CRITICAL
-     *
-     * @deprecated Use "status" prop instead
-     */
-    variant: {
-      type: String,
-      default: null,
-      validator: (e) => Object.values(F).includes(e)
-    }
-  },
-  setup(e, { slots: o }) {
-    const { t: s } = se({ messages: ne }), l = m(() => e.type === "note"), N = m(() => e.variant === F.CRITICAL ? "red" : e.variant === F.SUCCESS ? "green" : e.status);
-    e.variant && Te(
-      'BentoTimelineItem "variant" property',
-      `Use the BentoTimelineItem "status" modifier instead to modify the color of the timeline icon.
-                    <bento-timeline-item status="red" />`,
-      "2.0.0"
-    );
-    const r = m(() => ({
-      [`b-timeline-item__icon--${N.value}`]: N.value && !l.value
-    })), a = m(() => ({
-      "b-timeline-item--note": l.value
-    }));
-    H(we, !0);
-    const p = W(re), { timelineEntries: c, index: t, unregisterTimelineEntry: E } = p({
-      title: e.title,
-      date: e.timestamp.date
-    });
-    ve(() => E());
-    const { showAll: _, showMoreIndex: f, hiddenItems: b, visibleIndexes: i, timegapLimit: k } = W(de), A = m(() => _.value || !i.value), B = m(() => A.value ? !0 : i.value.includes(t)), D = m(() => typeof e.title == "object"), R = m(() => e.title), L = m(() => {
-      var K;
-      if (!k.value)
-        return null;
-      const M = (K = c.value[t - 1]) == null ? void 0 : K.date, me = A.value || i.value.includes(t - 1);
-      if (!M || !me)
-        return null;
-      const { date: P } = c.value[t], ue = parseInt(
-        ee(M, P, { unit: k.value.unit }),
-        10
-      );
-      return k.value.amount < ue ? ee(M, P, { roundingMethod: "floor" }) : null;
-    }), d = m(() => L.value ? s("timegap", { timegap: L.value }) : ""), w = m(() => b.value && f.value === t), j = m(() => t === c.value.length - 1);
-    return {
-      // Values
-      isNoteType: l,
-      iconConditionalClasses: r,
-      conditionalClasses: a,
-      displayShowMoreButton: w,
-      showAll: _,
-      hiddenItems: b,
-      isVisible: B,
-      isLinkTitle: D,
-      linkTitleProps: R,
-      timegap: L,
-      timegapAriaLabel: d,
-      isLastItem: j,
-      // Methods
-      generateUid: Se,
-      hasSlot: Ce(o),
-      t: s
-    };
-  }
-}), qe = {
-  key: 0,
-  class: "b-timeline-item__row"
-}, Je = { class: "b-timeline-item__content" }, Pe = { class: "b-timeline-item__row" }, Ke = {
-  class: "b-timeline-item__marker",
-  "aria-hidden": "true"
-}, We = {
-  key: 0,
-  class: "b-timeline-item__separator",
-  "data-testid": "last-timeline-item-separator"
-}, Ze = { class: "b-timeline-item__content" }, Ge = { key: 1 }, Qe = {
-  key: 5,
-  class: "b-timeline-item__data-list"
-}, Xe = {
-  key: 1,
-  class: "b-timeline-item__row"
-}, xe = { class: "b-timeline-item__content" };
-function et(e, o, s, l, N, r) {
-  const a = T("bento-typography"), p = T("square-small-icon"), c = T("bento-link"), t = T("bento-date"), E = T("bento-structured-list-item"), _ = T("bento-structured-list"), f = T("bento-tag"), b = T("bento-button");
-  return e.isVisible ? (n(), v("li", {
-    key: 0,
-    class: Z(["b-timeline-item", e.conditionalClasses])
-  }, [
-    e.timegap ? (n(), v("div", qe, [
-      o[1] || (o[1] = g("div", {
-        class: "b-timeline-item__marker",
-        "aria-hidden": "true"
-      }, [
-        g("div", { class: "b-timeline-item__icon b-timeline-item__icon--timegap" }),
-        g("div", { class: "b-timeline-item__separator" })
-      ], -1)),
-      g("div", Je, [
-        C(a, {
-          class: "b-timeline-item__timegap",
-          "aria-label": e.timegapAriaLabel
-        }, {
-          default: h(() => [
-            I(y(e.timegap), 1)
-          ]),
-          _: 1
-        }, 8, ["aria-label"])
-      ])
-    ])) : u("", !0),
-    g("div", Pe, [
-      g("div", Ke, [
-        C(p, {
-          class: Z(["b-timeline-item__icon", e.iconConditionalClasses])
-        }, null, 8, ["class"]),
-        e.isLastItem ? u("", !0) : (n(), v("div", We))
-      ]),
-      g("div", Ze, [
-        e.isNoteType ? u("", !0) : (n(), S(a, {
-          key: 0,
-          el: "div",
-          variant: "body",
-          strongest: "",
-          class: "b-timeline-item__title",
-          role: "heading",
-          "aria-level": "2"
-        }, {
-          default: h(() => [
-            e.isLinkTitle ? (n(), S(c, q({ key: 0 }, e.linkTitleProps, { "disable-typography": "" }), {
-              default: h(() => [
-                I(y(e.linkTitleProps.title), 1)
-              ]),
-              _: 1
-            }, 16)) : (n(), v("span", Ge, y(e.title), 1))
-          ]),
-          _: 1
-        })),
-        e.isNoteType && (e.description || e.hasSlot("default")) ? (n(), S(a, {
-          key: 1,
-          el: "div",
-          variant: "body",
-          class: "b-timeline-item__description"
-        }, {
-          default: h(() => [
-            V(e.$slots, "default", {}, () => [
-              I(y(e.description), 1)
-            ], !0)
-          ]),
-          _: 3
-        })) : u("", !0),
-        e.timestamp ? (n(), S(a, {
-          key: 2,
-          class: "b-timeline-item__timestamp",
-          el: "div",
-          variant: "caption"
-        }, {
-          default: h(() => [
-            C(t, {
-              date: e.timestamp.date,
-              format: e.timestamp.format,
-              "disable-typography": ""
-            }, null, 8, ["date", "format"]),
-            I(" " + y(e.timestamp.value), 1)
-          ]),
-          _: 1
-        })) : u("", !0),
-        !e.isNoteType && e.additionalTimestamp ? (n(), S(a, {
-          key: 3,
-          class: "b-timeline-item__timestamp",
-          el: "div",
-          variant: "caption"
-        }, {
-          default: h(() => [
-            C(t, {
-              date: e.additionalTimestamp.date,
-              format: e.additionalTimestamp.format,
-              "disable-typography": ""
-            }, null, 8, ["date", "format"]),
-            I(" " + y(e.additionalTimestamp.value), 1)
-          ]),
-          _: 1
-        })) : u("", !0),
-        !e.isNoteType && (e.description || e.hasSlot("default")) ? (n(), S(a, {
-          key: 4,
-          el: "div",
-          variant: "body",
-          class: "b-timeline-item__description"
-        }, {
-          default: h(() => [
-            V(e.$slots, "default", {}, () => [
-              I(y(e.description), 1)
-            ], !0)
-          ]),
-          _: 3
-        })) : u("", !0),
-        !e.isNoteType && e.dataList ? (n(), v("div", Qe, [
-          C(_, null, {
-            default: h(() => [
-              (n(!0), v(z, null, pe(e.dataList, (i) => (n(), S(E, {
-                key: e.generateUid(i.label),
-                label: i.label
-              }, {
-                default: h(() => [
-                  C(a, { variant: "caption" }, {
-                    default: h(() => [
-                      I(y(i.value), 1)
-                    ]),
-                    _: 2
-                  }, 1024)
-                ]),
-                _: 2
-              }, 1032, ["label"]))), 128))
-            ]),
-            _: 1
-          })
-        ])) : u("", !0),
-        !e.isNoteType && e.tag ? (n(), S(f, q({ key: 6 }, e.tag, { class: "b-timeline-item__tag" }), null, 16)) : u("", !0)
-      ])
-    ]),
-    e.displayShowMoreButton ? (n(), v("div", Xe, [
-      o[2] || (o[2] = g("div", {
-        class: "b-timeline-item__marker",
-        "aria-hidden": "true"
-      }, [
-        g("div", { class: "b-timeline-item__separator" })
-      ], -1)),
-      g("div", xe, [
-        C(b, {
-          class: "b-timeline__show-more",
-          variant: "tertiary",
-          onClick: o[0] || (o[0] = (i) => e.showAll = !e.showAll)
-        }, {
-          default: h(() => [
-            e.showAll ? (n(), v(z, { key: 1 }, [
-              I(y(e.t("showLess")), 1)
-            ], 64)) : (n(), v(z, { key: 0 }, [
-              I(y(e.t("showMore", { items: e.hiddenItems })), 1)
-            ], 64))
-          ]),
-          _: 1
-        })
-      ])
-    ])) : u("", !0)
-  ], 2)) : u("", !0);
-}
-const ht = /* @__PURE__ */ J(Ve, [["render", et], ["__scopeId", "data-v-feb2fed0"]]);
-export {
-  O as B,
-  ht as a,
-  Re as b,
-  F as c,
-  le as d,
-  bt as t
-};
-//# sourceMappingURL=timeline-item.DthjD14m.js.map