@evance/evance-ui 1.0.35 → 1.0.36

package/dist/esm/chunks/EvSpacer.vue_vue_type_script_setup_true_lang-CV4fpTYp.mjs

@@ -0,0 +1,32 @@
+/*! Evance UI v1.0.36 | MIT License */
+import { defineComponent, createElementBlock, openBlock, normalizeStyle, normalizeClass, renderSlot } from "vue";
+import { m as makeComponentProps } from "./component-B7n8wpjB.mjs";
+import { p as propsFactory } from "./props-2s59DNIa.mjs";
+const makeEvSpacerProps = propsFactory(
+  {
+    ...makeComponentProps()
+  },
+  "EvSpacer"
+);
+const _sfc_main = /* @__PURE__ */ defineComponent({
+  __name: "EvSpacer",
+  props: {
+    ...makeEvSpacerProps()
+  },
+  setup(__props) {
+    const props = __props;
+    return (_ctx, _cache) => {
+      return openBlock(), createElementBlock("div", {
+        class: normalizeClass(["ev-spacer", props.class]),
+        style: normalizeStyle([props.style])
+      }, [
+        renderSlot(_ctx.$slots, "default")
+      ], 6);
+    };
+  }
+});
+export {
+  _sfc_main as _,
+  makeEvSpacerProps as m
+};
+//# sourceMappingURL=EvSpacer.vue_vue_type_script_setup_true_lang-CV4fpTYp.mjs.map

package/dist/esm/chunks/EvSpacer.vue_vue_type_script_setup_true_lang-CV4fpTYp.mjs.map

@@ -0,0 +1 @@
+{"version":3,"file":"EvSpacer.vue_vue_type_script_setup_true_lang-CV4fpTYp.mjs","sources":["../../../src/components/EvGrid/EvSpacer/EvSpacer.ts"],"sourcesContent":["import { propsFactory } from \"@/util\";\nimport { makeComponentProps } from \"@/composables/component\";\n\n/**\n * # makeEvSpacerProps\n */\nexport const makeEvSpacerProps = propsFactory(\n    {\n        ...makeComponentProps(),\n    },\n    \"EvSpacer\",\n);\n"],"names":[],"mappings":";;;;AAMO,MAAM,oBAAoB;AAAA,EAC7B;AAAA,IACI,GAAG,mBAAmB;AAAA,EAC1B;AAAA,EACA;AACJ;;;;;;;;;;;;;;;;;;"}

package/dist/esm/chunks/EvSurface.vue_vue_type_script_setup_true_lang-BlKKIwv7.mjs

@@ -0,0 +1,94 @@
+/*! Evance UI v1.0.36 | MIT License */
+import { defineComponent, createBlock, openBlock, resolveDynamicComponent, normalizeStyle, normalizeClass, unref, withCtx, renderSlot } from "vue";
+import { m as makeDimensionsProps, u as useDimensions } from "./dimensions-C7ldaBSW.mjs";
+import { m as makeTagProps } from "./tag-4PAUDCGP.mjs";
+import { m as makeComponentProps } from "./component-B7n8wpjB.mjs";
+import { p as propsFactory } from "./props-2s59DNIa.mjs";
+import { m as makeClassName } from "./modifiers-BVTtETUg.mjs";
+import { d as isEmpty, i as isString } from "./is-functions-DV0o6XE9.mjs";
+function makeElevationClass(elevation) {
+  return makeClassName(elevation, "elevation");
+}
+const makeEvSurfaceProps = propsFactory(
+  {
+    elevation: {
+      type: String,
+      default: "default"
+    },
+    // Rounded
+    rounded: {
+      type: [String, Number, Boolean],
+      default: void 0
+    },
+    // Scrollable
+    scrollable: {
+      type: [String, Boolean],
+      default: void 0
+    },
+    ...makeComponentProps(),
+    ...makeDimensionsProps(),
+    ...makeTagProps()
+  },
+  "EvSurface"
+);
+const _sfc_main = /* @__PURE__ */ defineComponent({
+  __name: "EvSurface",
+  props: {
+    ...makeEvSurfaceProps()
+  },
+  setup(__props) {
+    const props = __props;
+    const dimensions = useDimensions(props);
+    function makeRoundedClass(rounded) {
+      if (!rounded || isEmpty(rounded)) {
+        return void 0;
+      }
+      if (rounded === true) {
+        return "is-rounded";
+      }
+      if (!isString(rounded)) {
+        return void 0;
+      }
+      return makeClassName(rounded, "is-rounded");
+    }
+    function makeScrollableClass(scrollable) {
+      if (typeof scrollable === "undefined") {
+        return void 0;
+      }
+      if (scrollable === false) {
+        return "is-overflow-hidden";
+      }
+      switch (scrollable) {
+        case "x":
+          return "is-scrollable-x";
+        case "y":
+          return "is-scrollable-y";
+        default:
+          return "is-scrollable";
+      }
+    }
+    return (_ctx, _cache) => {
+      return openBlock(), createBlock(resolveDynamicComponent(props.tag), {
+        class: normalizeClass([
+          "ev-surface",
+          unref(makeElevationClass)(props.elevation),
+          makeRoundedClass(props.rounded),
+          makeScrollableClass(props.scrollable),
+          props.class
+        ]),
+        style: normalizeStyle([unref(dimensions), props.style])
+      }, {
+        default: withCtx(() => [
+          renderSlot(_ctx.$slots, "default")
+        ]),
+        _: 3
+      }, 8, ["class", "style"]);
+    };
+  }
+});
+export {
+  _sfc_main as _,
+  makeEvSurfaceProps as a,
+  makeElevationClass as m
+};
+//# sourceMappingURL=EvSurface.vue_vue_type_script_setup_true_lang-BlKKIwv7.mjs.map

package/dist/esm/chunks/EvSurface.vue_vue_type_script_setup_true_lang-BlKKIwv7.mjs.map

@@ -0,0 +1 @@
+{"version":3,"file":"EvSurface.vue_vue_type_script_setup_true_lang-BlKKIwv7.mjs","sources":["../../../src/components/EvSurface/EvSurface.ts","../../../src/components/EvSurface/EvSurface.vue"],"sourcesContent":["import { makeClassName, propsFactory } from \"@/util\";\nimport { makeDimensionsProps } from \"@/composables/dimensions\";\nimport { PropType } from \"vue\";\nimport { makeTagProps } from \"@/composables/tag\";\nimport { makeComponentProps } from \"@/composables/component\";\n\n/**\n * # Surface Elevation\n *\n * Elevations are the layered surfaces that form the foundation of the UI.\n * They create a blank canvas containing other UI components.\n * Such as text, icons, backgrounds, and borders.\n *\n */\nexport type SurfaceElevation = \"default\" | \"panel\" | \"overlay\" | \"sunken\";\n\n/**\n * # Make Elevation Class\n */\nexport function makeElevationClass(elevation: string) {\n    return makeClassName(elevation, \"elevation\");\n}\n\n/**\n * # Make Surface Props\n */\nexport const makeEvSurfaceProps = propsFactory(\n    {\n        elevation: {\n            type: String as PropType<SurfaceElevation>,\n            default: \"default\",\n        },\n        // Rounded\n        rounded: {\n            type: [String, Number, Boolean],\n            default: undefined,\n        },\n        // Scrollable\n        scrollable: {\n            type: [String, Boolean],\n            default: undefined,\n        },\n        ...makeComponentProps(),\n        ...makeDimensionsProps(),\n        ...makeTagProps(),\n    },\n    \"EvSurface\",\n);\n","<script setup lang=\"ts\">\nimport \"./EvSurface.scss\";\nimport { makeElevationClass, makeEvSurfaceProps } from \"./EvSurface\";\nimport { isEmpty, isString, makeClassName } from \"@/util\";\nimport { useDimensions } from \"@/composables/dimensions\";\n\nconst props = defineProps({\n    ...makeEvSurfaceProps(),\n});\nconst dimensions = useDimensions(props);\n\n/**\n * @todo: this probably belongs in its own composable, if we expand on it or make it generic.\n *\n * @param rounded\n */\nfunction makeRoundedClass(rounded?: string | number | boolean) {\n    if (!rounded || isEmpty(rounded)) {\n        return undefined;\n    }\n    if (rounded === true) {\n        return \"is-rounded\";\n    }\n    if (!isString(rounded)) {\n        return undefined;\n    }\n    return makeClassName(rounded, \"is-rounded\");\n}\n\n/**\n * # Make Scrollable Class\n * @param scrollable\n */\nfunction makeScrollableClass(scrollable?: string | boolean) {\n    if (typeof scrollable === \"undefined\") {\n        return undefined;\n    }\n    if (scrollable === false) {\n        return \"is-overflow-hidden\";\n    }\n    switch (scrollable) {\n        case \"x\":\n            return \"is-scrollable-x\";\n        case \"y\":\n            return \"is-scrollable-y\";\n        default:\n            return \"is-scrollable\";\n    }\n}\n</script>\n\n<template>\n    <component\n        :is=\"props.tag\"\n        :class=\"[\n            'ev-surface',\n            makeElevationClass(props.elevation),\n            makeRoundedClass(props.rounded),\n            makeScrollableClass(props.scrollable),\n            props.class,\n        ]\"\n        :style=\"[dimensions, props.style]\">\n        <slot />\n    </component>\n</template>\n"],"names":[],"mappings":";;;;;;;;AAmBO,SAAS,mBAAmB,WAAmB;AAC3C,SAAA,cAAc,WAAW,WAAW;AAC/C;AAKO,MAAM,qBAAqB;AAAA,EAC9B;AAAA,IACI,WAAW;AAAA,MACP,MAAM;AAAA,MACN,SAAS;AAAA,IACb;AAAA;AAAA,IAEA,SAAS;AAAA,MACL,MAAM,CAAC,QAAQ,QAAQ,OAAO;AAAA,MAC9B,SAAS;AAAA,IACb;AAAA;AAAA,IAEA,YAAY;AAAA,MACR,MAAM,CAAC,QAAQ,OAAO;AAAA,MACtB,SAAS;AAAA,IACb;AAAA,IACA,GAAG,mBAAmB;AAAA,IACtB,GAAG,oBAAoB;AAAA,IACvB,GAAG,aAAa;AAAA,EACpB;AAAA,EACA;AACJ;;;;;;;;ACtCM,UAAA,aAAa,cAAc,KAAK;AAOtC,aAAS,iBAAiB,SAAqC;AAC3D,UAAI,CAAC,WAAW,QAAQ,OAAO,GAAG;AACvB,eAAA;AAAA,MAAA;AAEX,UAAI,YAAY,MAAM;AACX,eAAA;AAAA,MAAA;AAEP,UAAA,CAAC,SAAS,OAAO,GAAG;AACb,eAAA;AAAA,MAAA;AAEJ,aAAA,cAAc,SAAS,YAAY;AAAA,IAAA;AAO9C,aAAS,oBAAoB,YAA+B;AACpD,UAAA,OAAO,eAAe,aAAa;AAC5B,eAAA;AAAA,MAAA;AAEX,UAAI,eAAe,OAAO;AACf,eAAA;AAAA,MAAA;AAEX,cAAQ,YAAY;AAAA,QAChB,KAAK;AACM,iBAAA;AAAA,QACX,KAAK;AACM,iBAAA;AAAA,QACX;AACW,iBAAA;AAAA,MAAA;AAAA,IACf;;;;;;;;;;;;;;;;;;;;"}

package/dist/esm/chunks/EvSwitch.vue_vue_type_script_setup_true_lang-DOtq8GeB.mjs

@@ -0,0 +1,123 @@
+/*! Evance UI v1.0.36 | MIT License */
+import { defineComponent, useSlots, useAttrs, ref, createElementBlock, openBlock, mergeProps, unref, createElementVNode, createCommentVNode, createVNode, withCtx, renderSlot } from "vue";
+import { _ as _sfc_main$2 } from "./EvErrors.vue_vue_type_script_setup_true_lang-kHnT6vvI.mjs";
+import { _ as _sfc_main$1 } from "./EvLabel.vue_vue_type_script_setup_true_lang-BDoAg_AB.mjs";
+import { m as makeEvCheckboxProps, u as useToggleControl } from "./EvCheckbox-D5K79IDk.mjs";
+import { p as propsFactory } from "./props-2s59DNIa.mjs";
+import { u as useFormField } from "./validation-fXguSB2p.mjs";
+import { s as splitInputAttrs } from "./helpers-BU9eM0b_.mjs";
+const makeEvSwitchProps = propsFactory(
+  {
+    ...makeEvCheckboxProps()
+  },
+  "EvSwitch"
+);
+const _hoisted_1 = { class: "ev-switch--control" };
+const _hoisted_2 = /* @__PURE__ */ createElementVNode("div", { class: "ev-switch--track" }, null, -1);
+const _hoisted_3 = /* @__PURE__ */ createElementVNode("div", { class: "ev-switch--thumb" }, null, -1);
+const _hoisted_4 = ["id", "name", "disabled", "readonly", "checked", "value", "aria-disabled", "aria-checked"];
+const _hoisted_5 = {
+  key: 0,
+  class: "ev-switch--label"
+};
+const _hoisted_6 = {
+  key: 0,
+  class: "ev-switch--errors"
+};
+const _sfc_main = /* @__PURE__ */ defineComponent({
+  ...{
+    inheritAttrs: false
+  },
+  __name: "EvSwitch",
+  props: {
+    ...makeEvSwitchProps()
+  },
+  emits: ["update:focused", "update:modelValue"],
+  setup(__props, { expose: __expose }) {
+    const props = __props;
+    const slots = useSlots();
+    const attrs = useAttrs();
+    const containerRef = ref(null);
+    const inputRef = ref(null);
+    const [containerAttrs, inputAttrs] = splitInputAttrs(attrs);
+    const formField = useFormField(props);
+    const { trueValue, isChecked } = useToggleControl(formField.model, props);
+    function getInputElement() {
+      return inputRef.value;
+    }
+    function onInput(e) {
+      isChecked.value = e.target.checked;
+    }
+    __expose({
+      field: formField,
+      input: inputRef,
+      focus: () => {
+        var _a;
+        (_a = getInputElement()) == null ? void 0 : _a.focus();
+      }
+    });
+    return (_ctx, _cache) => {
+      return openBlock(), createElementBlock("div", mergeProps({
+        ref_key: "containerRef",
+        ref: containerRef,
+        class: ["ev-switch", [
+          {
+            "is-checked": unref(isChecked),
+            "is-labelled": props.label || unref(slots).label
+          },
+          unref(formField).classes,
+          props.class
+        ]],
+        style: props.style
+      }, unref(containerAttrs)), [
+        createElementVNode("div", _hoisted_1, [
+          _hoisted_2,
+          _hoisted_3,
+          createElementVNode("input", mergeProps({
+            id: unref(formField).id,
+            ref_key: "inputRef",
+            ref: inputRef,
+            type: "checkbox",
+            role: "switch",
+            name: unref(formField).name,
+            disabled: unref(formField).isDisabled,
+            readonly: unref(formField).isReadonly,
+            checked: unref(isChecked),
+            value: unref(trueValue),
+            "aria-disabled": unref(formField).isDisabled,
+            "aria-checked": unref(isChecked)
+          }, unref(inputAttrs), {
+            onInput,
+            onFocus: _cache[0] || (_cache[0] = //@ts-ignore
+            (...args) => unref(formField).focus && unref(formField).focus(...args)),
+            onBlur: _cache[1] || (_cache[1] = //@ts-ignore
+            (...args) => unref(formField).blur && unref(formField).blur(...args))
+          }), null, 16, _hoisted_4)
+        ]),
+        props.label || props.hint || unref(slots).label ? (openBlock(), createElementBlock("div", _hoisted_5, [
+          createVNode(unref(_sfc_main$1), {
+            clickable: "",
+            for: unref(formField).id,
+            title: props.label,
+            hint: props.hint
+          }, {
+            default: withCtx(() => [
+              renderSlot(_ctx.$slots, "label")
+            ]),
+            _: 3
+          }, 8, ["for", "title", "hint"]),
+          unref(formField).isShowErrorMessages ? (openBlock(), createElementBlock("div", _hoisted_6, [
+            createVNode(unref(_sfc_main$2), {
+              messages: unref(formField).errorMessages
+            }, null, 8, ["messages"])
+          ])) : createCommentVNode("", true)
+        ])) : createCommentVNode("", true)
+      ], 16);
+    };
+  }
+});
+export {
+  _sfc_main as _,
+  makeEvSwitchProps as m
+};
+//# sourceMappingURL=EvSwitch.vue_vue_type_script_setup_true_lang-DOtq8GeB.mjs.map

package/dist/esm/chunks/EvSwitch.vue_vue_type_script_setup_true_lang-DOtq8GeB.mjs.map

@@ -0,0 +1 @@
+{"version":3,"file":"EvSwitch.vue_vue_type_script_setup_true_lang-DOtq8GeB.mjs","sources":["../../../src/components/EvSwitch/EvSwitch.ts","../../../src/components/EvSwitch/EvSwitch.vue"],"sourcesContent":["import { propsFactory } from \"@/util\";\nimport { makeEvCheckboxProps } from \"@/components/EvCheckbox\";\n\nexport const makeEvSwitchProps = propsFactory(\n    {\n        ...makeEvCheckboxProps(),\n    },\n    \"EvSwitch\",\n);\n","<script setup lang=\"ts\">\n/**\n * # `<ev-switch>`\n */\nimport \"./EvSwitch.scss\";\nimport { ref, useAttrs } from \"vue\";\nimport { splitInputAttrs } from \"@/util\";\nimport { EvErrors } from \"@/components/EvErrors\";\nimport { EvLabel } from \"@/components/EvLabel\";\nimport { useToggleControl } from \"@/components/EvCheckbox\";\nimport { makeEvSwitchProps } from \"./EvSwitch\";\nimport { useFormField } from \"@/composables/validation\";\n\n/**\n * We want to pass attributes not defined as 'props'\n * to the `<input>` field, so we need to turn off `inheritAttrs`.\n */\ndefineOptions({\n    inheritAttrs: false,\n});\n\n// Props & slots\nconst props = defineProps({\n    ...makeEvSwitchProps(),\n});\nconst slots = defineSlots<{\n    label(): never;\n}>();\n\n// Emit\ndefineEmits([\"update:focused\", \"update:modelValue\"]);\n\nconst attrs = useAttrs();\nconst containerRef = ref<HTMLElement | null>(null);\nconst inputRef = ref<HTMLInputElement | null>(null);\nconst [containerAttrs, inputAttrs] = splitInputAttrs(attrs);\nconst formField = useFormField(props);\nconst { trueValue, isChecked } = useToggleControl(formField.model, props);\n\n/**\n * ## Get Input Element\n */\nfunction getInputElement(): HTMLInputElement | null {\n    return inputRef.value;\n}\n\n/**\n * ## On Input\n * @param e\n */\nfunction onInput(e: Event) {\n    isChecked.value = (e.target as HTMLInputElement).checked;\n}\n\n/**\n * ## Expose stuff\n */\ndefineExpose({\n    field: formField,\n    input: inputRef,\n    focus: () => {\n        getInputElement()?.focus();\n    },\n});\n</script>\n\n<template>\n    <div\n        ref=\"containerRef\"\n        class=\"ev-switch\"\n        :class=\"[\n            {\n                'is-checked': isChecked,\n                'is-labelled': props.label || slots.label,\n            },\n            formField.classes,\n            props.class,\n        ]\"\n        :style=\"props.style\"\n        v-bind=\"containerAttrs\">\n        <div class=\"ev-switch--control\">\n            <div class=\"ev-switch--track\"></div>\n            <div class=\"ev-switch--thumb\"></div>\n            <input\n                :id=\"formField.id\"\n                ref=\"inputRef\"\n                type=\"checkbox\"\n                role=\"switch\"\n                :name=\"formField.name\"\n                :disabled=\"formField.isDisabled\"\n                :readonly=\"formField.isReadonly\"\n                :checked=\"isChecked\"\n                :value=\"trueValue\"\n                :aria-disabled=\"formField.isDisabled\"\n                :aria-checked=\"isChecked\"\n                v-bind=\"inputAttrs\"\n                @input=\"onInput\"\n                @focus=\"formField.focus\"\n                @blur=\"formField.blur\" />\n        </div>\n\n        <div\n            v-if=\"props.label || props.hint || slots.label\"\n            class=\"ev-switch--label\">\n            <ev-label\n                clickable\n                :for=\"formField.id\"\n                :title=\"props.label\"\n                :hint=\"props.hint\">\n                <slot name=\"label\" />\n            </ev-label>\n\n            <div v-if=\"formField.isShowErrorMessages\" class=\"ev-switch--errors\">\n                <ev-errors :messages=\"formField.errorMessages\" />\n            </div>\n        </div>\n    </div>\n</template>\n"],"names":["_useSlots"],"mappings":";;;;;;;;AAGO,MAAM,oBAAoB;AAAA,EAC7B;AAAA,IACI,GAAG,oBAAoB;AAAA,EAC3B;AAAA,EACA;AACJ;;;;;;;;;;;;;;;;;;;;;;;;ACiBA,UAAM,QAAQA;AAOd,UAAM,QAAQ,SAAS;AACjB,UAAA,eAAe,IAAwB,IAAI;AAC3C,UAAA,WAAW,IAA6B,IAAI;AAClD,UAAM,CAAC,gBAAgB,UAAU,IAAI,gBAAgB,KAAK;AACpD,UAAA,YAAY,aAAa,KAAK;AACpC,UAAM,EAAE,WAAW,cAAc,iBAAiB,UAAU,OAAO,KAAK;AAKxE,aAAS,kBAA2C;AAChD,aAAO,SAAS;AAAA,IAAA;AAOpB,aAAS,QAAQ,GAAU;AACb,gBAAA,QAAS,EAAE,OAA4B;AAAA,IAAA;AAMxC,aAAA;AAAA,MACT,OAAO;AAAA,MACP,OAAO;AAAA,MACP,OAAO,MAAM;;AACT,8BAAA,MAAA,mBAAmB;AAAA,MAAM;AAAA,IAC7B,CACH;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;"}

package/dist/esm/chunks/EvTab.vue_vue_type_script_setup_true_lang-CRZpaHY4.mjs

@@ -0,0 +1,151 @@
+/*! Evance UI v1.0.36 | MIT License */
+import { defineComponent, useSlots, computed, ref, createBlock, openBlock, unref, mergeProps, createSlots, withCtx, createElementVNode, normalizeClass, renderSlot, createTextVNode, toDisplayString } from "vue";
+import { m as makeEvButtonProps, _ as _sfc_main$1 } from "./EvButton.vue_vue_type_script_setup_true_lang-CVG25jHH.mjs";
+import { p as propsFactory } from "./props-2s59DNIa.mjs";
+import { o as omit, f as filterComponentProps } from "./helpers-BU9eM0b_.mjs";
+import { m as makeTagProps } from "./tag-4PAUDCGP.mjs";
+import { m as makeEvSlideGroupProps } from "./EvSlideGroup-QcEGl4q6.mjs";
+import { u as useDefaults } from "./defaults-SKkFTMsW.mjs";
+import { a as animate, e as easingStandard } from "./animate-Bz27WCqr.mjs";
+const makeEvTabProps = propsFactory(
+  {
+    direction: {
+      type: String,
+      default: "horizontal"
+    },
+    ...omit(
+      makeEvButtonProps({
+        variant: "subtle",
+        selectedClass: "is-selected",
+        selectedAppearance: "primary",
+        selectedVariant: "subtle"
+      }),
+      ["active", "symbol"]
+    )
+  },
+  "EvTab"
+);
+const EvTabsSymbol = Symbol.for("ev:tabs");
+const makeEvTabsProps = propsFactory(
+  {
+    alignTabs: {
+      type: String,
+      default: "start"
+    },
+    grow: Boolean,
+    items: {
+      type: Array,
+      default: () => []
+    },
+    size: String,
+    ...makeEvSlideGroupProps({ mandatory: "force" }),
+    ...makeTagProps()
+  },
+  "EvTabs"
+);
+const _sfc_main = /* @__PURE__ */ defineComponent({
+  __name: "EvTab",
+  props: {
+    ...makeEvTabProps()
+  },
+  setup(__props) {
+    const definedProps = __props;
+    const slots = useSlots();
+    const props = useDefaults(definedProps);
+    const isSelected = computed(
+      () => {
+        var _a, _b;
+        return ((_b = (_a = rootEl.value) == null ? void 0 : _a.group) == null ? void 0 : _b.isSelected.value) ?? false;
+      }
+    );
+    const isHorizontal = computed(() => props.direction === "horizontal");
+    const buttonProps = computed(() => {
+      return filterComponentProps(_sfc_main$1, props);
+    });
+    const rootEl = ref();
+    const sliderEl = ref();
+    function updateSlider({ value }) {
+      var _a, _b;
+      if (!value) {
+        return;
+      }
+      const prevEl = (_b = (_a = rootEl.value) == null ? void 0 : _a.$el.parentElement) == null ? void 0 : _b.querySelector(
+        ".ev-tab.is-active .ev-tab--slider"
+      );
+      const nextEl = sliderEl.value;
+      if (!prevEl || !nextEl) {
+        return;
+      }
+      const color = getComputedStyle(prevEl).color;
+      const prevBox = prevEl.getBoundingClientRect();
+      const nextBox = nextEl.getBoundingClientRect();
+      const xy = isHorizontal.value ? "x" : "y";
+      const XY = isHorizontal.value ? "X" : "Y";
+      const rightBottom = isHorizontal.value ? "right" : "bottom";
+      const widthHeight = isHorizontal.value ? "width" : "height";
+      const prevPos = prevBox[xy];
+      const nextPos = nextBox[xy];
+      const delta = prevPos > nextPos ? prevBox[rightBottom] - nextBox[rightBottom] : prevBox[xy] - nextBox[xy];
+      const origin = Math.sign(delta) > 0 ? isHorizontal.value ? "right" : "bottom" : Math.sign(delta) < 0 ? isHorizontal.value ? "left" : "top" : "center";
+      const size = Math.abs(delta) + (Math.sign(delta) < 0 ? prevBox[widthHeight] : nextBox[widthHeight]);
+      const scale = size / Math.max(prevBox[widthHeight], nextBox[widthHeight]) || 0;
+      const initialScale = prevBox[widthHeight] / nextBox[widthHeight] || 0;
+      const sigma = 1.5;
+      animate(
+        nextEl,
+        {
+          backgroundColor: [color, "currentcolor"],
+          transform: [
+            `translate${XY}(${delta}px) scale${XY}(${initialScale})`,
+            `translate${XY}(${delta / sigma}px) scale${XY}(${(scale - 1) / sigma + 1})`,
+            "none"
+          ],
+          transformOrigin: Array(3).fill(origin)
+        },
+        {
+          duration: 225,
+          easing: easingStandard
+        }
+      );
+    }
+    return (_ctx, _cache) => {
+      return openBlock(), createBlock(unref(_sfc_main$1), mergeProps({
+        ref_key: "rootEl",
+        ref: rootEl,
+        role: "tab",
+        class: ["ev-tab", unref(props).class],
+        active: void 0,
+        "aria-selected": String(isSelected.value),
+        symbol: unref(EvTabsSymbol),
+        tabindex: isSelected.value ? 0 : -1,
+        style: unref(props).style
+      }, buttonProps.value, { "onGroup:selected": updateSlider }), createSlots({
+        additional: withCtx(() => [
+          createElementVNode("div", {
+            ref_key: "sliderEl",
+            ref: sliderEl,
+            class: normalizeClass(["ev-tab--slider"])
+          }, null, 512)
+        ]),
+        _: 2
+      }, [
+        unref(props).text || unref(slots).default ? {
+          name: "default",
+          fn: withCtx(() => [
+            renderSlot(_ctx.$slots, "default", {}, () => [
+              createTextVNode(toDisplayString(unref(props).text), 1)
+            ])
+          ]),
+          key: "0"
+        } : void 0
+      ]), 1040, ["class", "aria-selected", "symbol", "tabindex", "style"]);
+    };
+  }
+});
+export {
+  EvTabsSymbol as E,
+  _sfc_main as _,
+  makeEvTabsProps as a,
+  makeEvTabProps as m
+};
+//# sourceMappingURL=EvTab.vue_vue_type_script_setup_true_lang-CRZpaHY4.mjs.map

package/dist/esm/chunks/EvTab.vue_vue_type_script_setup_true_lang-CRZpaHY4.mjs.map

@@ -0,0 +1 @@
+{"version":3,"file":"EvTab.vue_vue_type_script_setup_true_lang-CRZpaHY4.mjs","sources":["../../../src/components/EvTabs/EvTab/EvTab.ts","../../../src/components/EvTabs/EvTabs.ts","../../../src/components/EvTabs/EvTab/EvTab.vue"],"sourcesContent":["import { omit, propsFactory } from \"@/util\";\nimport { EvButtonProps, makeEvButtonProps } from \"@/components/EvButton\";\nimport { PropType } from \"vue\";\n\nexport type TabDirection = \"horizontal\" | \"vertical\";\n\nexport interface EvTabProps extends Omit<EvButtonProps, \"active\" | \"symbol\"> {\n    direction?: TabDirection;\n}\n\n/**\n * # makeEvTabProps()\n */\nexport const makeEvTabProps = propsFactory(\n    {\n        direction: {\n            type: String as PropType<TabDirection>,\n            default: \"horizontal\",\n        },\n\n        ...omit(\n            makeEvButtonProps({\n                variant: \"subtle\" as const,\n                selectedClass: \"is-selected\",\n                selectedAppearance: \"primary\",\n                selectedVariant: \"subtle\",\n            }),\n            [\"active\", \"symbol\"],\n        ),\n    },\n    \"EvTab\",\n);\n","import { InjectionKey, PropType } from \"vue\";\nimport { GroupProvide } from \"@/composables/group\";\nimport { InputSizeProp, propsFactory } from \"@/util\";\nimport { makeEvSlideGroupProps } from \"@/components\";\nimport { makeTagProps } from \"@/composables/tag\";\n\nexport const EvTabsSymbol: InjectionKey<GroupProvide> = Symbol.for(\"ev:tabs\");\n\nexport type TabItem = string | number | Record<string, any>;\n\nexport const makeEvTabsProps = propsFactory(\n    {\n        alignTabs: {\n            type: String as PropType<\"start\" | \"center\" | \"end\">,\n            default: \"start\",\n        },\n        grow: Boolean,\n        items: {\n            type: Array as PropType<readonly TabItem[]>,\n            default: () => [],\n        },\n        size: String as PropType<InputSizeProp>,\n\n        ...makeEvSlideGroupProps({ mandatory: \"force\" as const }),\n        ...makeTagProps(),\n    },\n    \"EvTabs\",\n);\n","<script setup lang=\"ts\">\r\n/**\r\n * # EvTab\r\n */\r\nimport \"./EvTab.scss\";\r\nimport { makeEvTabProps } from \"./EvTab\";\r\nimport { EvButton } from \"@/components/EvButton\";\r\nimport { EvTabsSymbol } from \"@/components/EvTabs/EvTabs\";\r\nimport { computed, ref } from \"vue\";\r\nimport { animate, easingStandard, filterComponentProps } from \"@/util\";\r\nimport { useDefaults } from \"@/composables\";\r\n\r\nconst definedProps = defineProps({\r\n    ...makeEvTabProps(),\r\n});\r\nconst slots = defineSlots<{\r\n    default(): never;\r\n}>();\r\nconst props = useDefaults(definedProps);\r\nconst isSelected = computed(\r\n    () => rootEl.value?.group?.isSelected.value ?? false,\r\n);\r\nconst isHorizontal = computed(() => props.direction === \"horizontal\");\r\nconst buttonProps = computed(() => {\r\n    return filterComponentProps(EvButton, props);\r\n});\r\nconst rootEl = ref<typeof EvButton>();\r\nconst sliderEl = ref<HTMLElement>();\r\n\r\nfunction updateSlider({ value }: { value: boolean }) {\r\n    if (!value) {\r\n        return;\r\n    }\r\n\r\n    const prevEl: HTMLElement | undefined =\r\n        rootEl.value?.$el.parentElement?.querySelector(\r\n            \".ev-tab.is-active .ev-tab--slider\",\r\n        );\r\n    const nextEl = sliderEl.value;\r\n    if (!prevEl || !nextEl) {\r\n        return;\r\n    }\r\n\r\n    const color = getComputedStyle(prevEl).color;\r\n    const prevBox = prevEl.getBoundingClientRect();\r\n    const nextBox = nextEl.getBoundingClientRect();\r\n\r\n    const xy = isHorizontal.value ? \"x\" : \"y\";\r\n    const XY = isHorizontal.value ? \"X\" : \"Y\";\r\n    const rightBottom = isHorizontal.value ? \"right\" : \"bottom\";\r\n    const widthHeight = isHorizontal.value ? \"width\" : \"height\";\r\n\r\n    const prevPos = prevBox[xy];\r\n    const nextPos = nextBox[xy];\r\n    const delta =\r\n        prevPos > nextPos\r\n            ? prevBox[rightBottom] - nextBox[rightBottom]\r\n            : prevBox[xy] - nextBox[xy];\r\n\r\n    const origin =\r\n        Math.sign(delta) > 0\r\n            ? isHorizontal.value\r\n                ? \"right\"\r\n                : \"bottom\"\r\n            : Math.sign(delta) < 0\r\n              ? isHorizontal.value\r\n                  ? \"left\"\r\n                  : \"top\"\r\n              : \"center\";\r\n\r\n    const size =\r\n        Math.abs(delta) +\r\n        (Math.sign(delta) < 0 ? prevBox[widthHeight] : nextBox[widthHeight]);\r\n    const scale =\r\n        size / Math.max(prevBox[widthHeight], nextBox[widthHeight]) || 0;\r\n    const initialScale = prevBox[widthHeight] / nextBox[widthHeight] || 0;\r\n\r\n    const sigma = 1.5;\r\n    animate(\r\n        nextEl,\r\n        {\r\n            backgroundColor: [color, \"currentcolor\"],\r\n            transform: [\r\n                `translate${XY}(${delta}px) scale${XY}(${initialScale})`,\r\n                `translate${XY}(${delta / sigma}px) scale${XY}(${(scale - 1) / sigma + 1})`,\r\n                \"none\",\r\n            ],\r\n            transformOrigin: Array(3).fill(origin),\r\n        },\r\n        {\r\n            duration: 225,\r\n            easing: easingStandard,\r\n        },\r\n    );\r\n}\r\n\r\n</script>\r\n\r\n<template>\r\n    <ev-button\r\n        ref=\"rootEl\"\r\n        role=\"tab\"\r\n        :class=\"['ev-tab', props.class]\"\r\n        :active=\"undefined\"\r\n        :aria-selected=\"String(isSelected)\"\r\n        :symbol=\"EvTabsSymbol\"\r\n        :tabindex=\"isSelected ? 0 : -1\"\r\n        :style=\"props.style\"\r\n        v-bind=\"buttonProps\"\r\n        @group:selected=\"updateSlider\">\r\n        <template v-if=\"props.text || slots.default\" #default>\r\n            <slot name=\"default\">{{ props.text }}</slot>\r\n        </template>\r\n        <template #additional>\r\n            <div ref=\"sliderEl\" :class=\"['ev-tab--slider']\"></div>\r\n        </template>\r\n    </ev-button>\r\n</template>\r\n"],"names":["_useSlots","EvButton"],"mappings":"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"}

package/dist/esm/chunks/EvTabs.vue_vue_type_script_setup_true_lang-ChJ43sDX.mjs

@@ -0,0 +1,71 @@
+/*! Evance UI v1.0.36 | MIT License */
+import { defineComponent, computed, toRef, createBlock, openBlock, unref, mergeProps, isRef, withCtx, renderSlot, createElementBlock, Fragment, renderList } from "vue";
+import { a as makeEvTabsProps, E as EvTabsSymbol, _ as _sfc_main$2 } from "./EvTab.vue_vue_type_script_setup_true_lang-CRZpaHY4.mjs";
+import { _ as _sfc_main$1 } from "./EvSlideGroup.vue_vue_type_script_setup_true_lang-B-yoLcPJ.mjs";
+import { u as useModelProxy } from "./modelProxy-CZKYGR_7.mjs";
+import { p as provideDefaults } from "./defaults-SKkFTMsW.mjs";
+import { f as filterComponentProps } from "./helpers-BU9eM0b_.mjs";
+import { a as isObject } from "./is-functions-DV0o6XE9.mjs";
+const _sfc_main = /* @__PURE__ */ defineComponent({
+  __name: "EvTabs",
+  props: {
+    ...makeEvTabsProps()
+  },
+  setup(__props) {
+    const props = __props;
+    function parseItems(items) {
+      if (!items) {
+        return [];
+      }
+      return items.map((item) => {
+        return !isObject(item) ? { text: item, value: item } : item;
+      });
+    }
+    const model = useModelProxy(props, "modelValue");
+    const parsedItems = computed(() => parseItems(props.items));
+    provideDefaults({
+      EvTab: {
+        direction: toRef(props, "direction"),
+        size: toRef(props, "size"),
+        selectedAppearance: toRef(props, "selectedAppearance"),
+        selectedVariant: toRef(props, "selectedVariant")
+      }
+    });
+    const slideGroupProps = computed(
+      () => filterComponentProps(_sfc_main$1, props)
+    );
+    const alignTabsClass = computed(() => `is-align-tabs-${props.alignTabs}`);
+    return (_ctx, _cache) => {
+      return openBlock(), createBlock(unref(_sfc_main$1), mergeProps(slideGroupProps.value, {
+        modelValue: unref(model),
+        "onUpdate:modelValue": _cache[0] || (_cache[0] = ($event) => isRef(model) ? model.value = $event : null),
+        role: "tablist",
+        class: [
+          "ev-tabs",
+          alignTabsClass.value,
+          {
+            "is-grow": props.grow
+          },
+          props.class
+        ],
+        style: props.style,
+        symbol: unref(EvTabsSymbol)
+      }), {
+        default: withCtx(() => [
+          renderSlot(_ctx.$slots, "default", {}, () => [
+            (openBlock(true), createElementBlock(Fragment, null, renderList(parsedItems.value, (item) => {
+              return openBlock(), createBlock(unref(_sfc_main$2), mergeProps({
+                key: item.text
+              }, item), null, 16);
+            }), 128))
+          ])
+        ]),
+        _: 3
+      }, 16, ["modelValue", "class", "style", "symbol"]);
+    };
+  }
+});
+export {
+  _sfc_main as _
+};
+//# sourceMappingURL=EvTabs.vue_vue_type_script_setup_true_lang-ChJ43sDX.mjs.map

package/dist/esm/chunks/EvTabs.vue_vue_type_script_setup_true_lang-ChJ43sDX.mjs.map

@@ -0,0 +1 @@
+{"version":3,"file":"EvTabs.vue_vue_type_script_setup_true_lang-ChJ43sDX.mjs","sources":["../../../src/components/EvTabs/EvTabs.vue"],"sourcesContent":["<script setup lang=\"ts\">\n/**\n * EvTabs\n * ---\n */\nimport \"./EvTabs.scss\";\nimport { EvTabsSymbol, makeEvTabsProps, TabItem } from \"./EvTabs\";\nimport { EvSlideGroup } from \"@/components/EvSlideGroup\";\nimport { useModelProxy } from \"@/composables/modelProxy\";\nimport { computed, toRef } from \"vue\";\nimport { filterComponentProps, isObject } from \"@/util\";\nimport { provideDefaults } from \"@/composables/defaults\";\nimport { EvTab } from \"@/components\";\n\n/**\n * ## parseItems\n * @param items\n */\nfunction parseItems(items: readonly TabItem[] | undefined) {\n    if (!items) {\n        return [];\n    }\n    return items.map((item) => {\n        return !isObject(item) ? { text: item, value: item } : item;\n    });\n}\n\nconst props = defineProps({\n    ...makeEvTabsProps(),\n});\nconst model = useModelProxy(props, \"modelValue\");\nconst parsedItems = computed(() => parseItems(props.items));\n\nprovideDefaults({\n    EvTab: {\n        direction: toRef(props, \"direction\"),\n        size: toRef(props, \"size\"),\n        selectedAppearance: toRef(props, \"selectedAppearance\"),\n        selectedVariant: toRef(props, \"selectedVariant\"),\n    },\n});\n\nconst slideGroupProps = computed(() =>\n    filterComponentProps(EvSlideGroup, props),\n);\nconst alignTabsClass = computed(() => `is-align-tabs-${props.alignTabs}`);\n</script>\n\n<template>\n    <ev-slide-group\n        v-bind=\"slideGroupProps\"\n        v-model=\"model\"\n        role=\"tablist\"\n        :class=\"[\n            'ev-tabs',\n            alignTabsClass,\n            {\n                'is-grow': props.grow,\n            },\n            props.class,\n        ]\"\n        :style=\"props.style\"\n        :symbol=\"EvTabsSymbol\">\n        <slot>\n            <ev-tab\n                v-for=\"item in parsedItems\"\n                :key=\"item.text\"\n                v-bind=\"item\"></ev-tab>\n        </slot>\n    </ev-slide-group>\n</template>\n"],"names":["EvSlideGroup"],"mappings":";;;;;;;;;;;;;;;AAkBA,aAAS,WAAW,OAAuC;AACvD,UAAI,CAAC,OAAO;AACR,eAAO,CAAC;AAAA,MAAA;AAEL,aAAA,MAAM,IAAI,CAAC,SAAS;AAChB,eAAA,CAAC,SAAS,IAAI,IAAI,EAAE,MAAM,MAAM,OAAO,KAAA,IAAS;AAAA,MAAA,CAC1D;AAAA,IAAA;AAMC,UAAA,QAAQ,cAAc,OAAO,YAAY;AAC/C,UAAM,cAAc,SAAS,MAAM,WAAW,MAAM,KAAK,CAAC;AAE1C,oBAAA;AAAA,MACZ,OAAO;AAAA,QACH,WAAW,MAAM,OAAO,WAAW;AAAA,QACnC,MAAM,MAAM,OAAO,MAAM;AAAA,QACzB,oBAAoB,MAAM,OAAO,oBAAoB;AAAA,QACrD,iBAAiB,MAAM,OAAO,iBAAiB;AAAA,MAAA;AAAA,IACnD,CACH;AAED,UAAM,kBAAkB;AAAA,MAAS,MAC7B,qBAAqBA,aAAc,KAAK;AAAA,IAC5C;AACA,UAAM,iBAAiB,SAAS,MAAM,iBAAiB,MAAM,SAAS,EAAE;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;"}