@synergy-design-system/vue 2.11.6 → 2.11.8

package/dist/components/SynVueDivider.vue.js

@@ -0,0 +1,29 @@
+import { defineComponent, ref, computed, openBlock, createElementBlock, mergeProps } from "vue";
+import "@synergy-design-system/components/components/divider/divider.js";
+const _sfc_main = /* @__PURE__ */ defineComponent({
+  __name: "SynVueDivider",
+  props: {
+    vertical: {}
+  },
+  setup(__props, { expose: __expose }) {
+    const nativeElement = ref();
+    __expose({
+      nativeElement
+    });
+    const props = __props;
+    const visibleProps = computed(
+      () => Object.fromEntries(
+        Object.entries(props).filter(([, value]) => typeof value !== "undefined")
+      )
+    );
+    return (_ctx, _cache) => {
+      return openBlock(), createElementBlock("syn-divider", mergeProps(visibleProps.value, {
+        ref_key: "nativeElement",
+        ref: nativeElement
+      }), null, 16);
+    };
+  }
+});
+export {
+  _sfc_main as default
+};

package/dist/components/SynVueDivider.vue2.js

@@ -0,0 +1,4 @@
+import _sfc_main from "./SynVueDivider.vue.js";
+export {
+  _sfc_main as default
+};

package/dist/components/SynVueDrawer.vue.d.ts

@@ -1,18 +1,11 @@
-import '@synergy-design-system/components/components/drawer/drawer.js';
-import type { SynShowEvent } from '@synergy-design-system/components';
-import type { SynAfterShowEvent } from '@synergy-design-system/components';
-import type { SynHideEvent } from '@synergy-design-system/components';
-import type { SynAfterHideEvent } from '@synergy-design-system/components';
-import type { SynInitialFocusEvent } from '@synergy-design-system/components';
-import type { SynRequestCloseEvent } from '@synergy-design-system/components';
-import type { SynDrawer } from '@synergy-design-system/components';
+import { SynShowEvent, SynAfterShowEvent, SynHideEvent, SynAfterHideEvent, SynInitialFocusEvent, SynRequestCloseEvent, SynDrawer } from '@synergy-design-system/components';
 export type { SynShowEvent } from '@synergy-design-system/components';
 export type { SynAfterShowEvent } from '@synergy-design-system/components';
 export type { SynHideEvent } from '@synergy-design-system/components';
 export type { SynAfterHideEvent } from '@synergy-design-system/components';
 export type { SynInitialFocusEvent } from '@synergy-design-system/components';
 export type { SynRequestCloseEvent } from '@synergy-design-system/components';
-declare const _default: __VLS_WithTemplateSlots<import("vue").DefineComponent<{
+declare const _default: __VLS_WithTemplateSlots<import('vue').DefineComponent<{
     /**
   * Indicates whether or not the drawer is open.
   * You can toggle this attribute to show and hide the drawer, or you can
@@ -43,15 +36,15 @@ declare const _default: __VLS_WithTemplateSlots<import("vue").DefineComponent<{
    */
     noHeader?: SynDrawer["noHeader"];
 }, {
-    nativeElement: import("vue").Ref<SynDrawer | undefined, SynDrawer | undefined>;
-}, {}, {}, {}, import("vue").ComponentOptionsMixin, import("vue").ComponentOptionsMixin, {
-    "syn-after-hide": (e: SynAfterHideEvent) => any;
+    nativeElement: import('vue').Ref<SynDrawer | undefined, SynDrawer | undefined>;
+}, {}, {}, {}, import('vue').ComponentOptionsMixin, import('vue').ComponentOptionsMixin, {
+    "syn-show": (e: SynShowEvent) => any;
     "syn-after-show": (e: SynAfterShowEvent) => any;
     "syn-hide": (e: SynHideEvent) => any;
+    "syn-after-hide": (e: SynAfterHideEvent) => any;
     "syn-initial-focus": (e: SynInitialFocusEvent) => any;
     "syn-request-close": (e: SynRequestCloseEvent) => any;
-    "syn-show": (e: SynShowEvent) => any;
-}, string, import("vue").PublicProps, Readonly<{
+}, string, import('vue').PublicProps, Readonly<{
     /**
   * Indicates whether or not the drawer is open.
   * You can toggle this attribute to show and hide the drawer, or you can
@@ -82,13 +75,13 @@ declare const _default: __VLS_WithTemplateSlots<import("vue").DefineComponent<{
    */
     noHeader?: SynDrawer["noHeader"];
 }> & Readonly<{
-    "onSyn-after-hide"?: ((e: SynAfterHideEvent) => any) | undefined;
+    "onSyn-show"?: ((e: SynShowEvent) => any) | undefined;
     "onSyn-after-show"?: ((e: SynAfterShowEvent) => any) | undefined;
     "onSyn-hide"?: ((e: SynHideEvent) => any) | undefined;
+    "onSyn-after-hide"?: ((e: SynAfterHideEvent) => any) | undefined;
     "onSyn-initial-focus"?: ((e: SynInitialFocusEvent) => any) | undefined;
     "onSyn-request-close"?: ((e: SynRequestCloseEvent) => any) | undefined;
-    "onSyn-show"?: ((e: SynShowEvent) => any) | undefined;
-}>, {}, {}, {}, {}, string, import("vue").ComponentProvideOptions, false, {}, any>, {
+}>, {}, {}, {}, {}, string, import('vue').ComponentProvideOptions, false, {}, any>, {
     default?(_: {}): any;
 }>;
 export default _default;

package/dist/components/SynVueDrawer.vue.js

@@ -0,0 +1,43 @@
+import { defineComponent, ref, computed, openBlock, createElementBlock, mergeProps, renderSlot } from "vue";
+import "@synergy-design-system/components/components/drawer/drawer.js";
+const _sfc_main = /* @__PURE__ */ defineComponent({
+  __name: "SynVueDrawer",
+  props: {
+    open: {},
+    label: {},
+    placement: {},
+    contained: {},
+    noHeader: {}
+  },
+  emits: ["syn-show", "syn-after-show", "syn-hide", "syn-after-hide", "syn-initial-focus", "syn-request-close"],
+  setup(__props, { expose: __expose }) {
+    const nativeElement = ref();
+    __expose({
+      nativeElement
+    });
+    const props = __props;
+    const visibleProps = computed(
+      () => Object.fromEntries(
+        Object.entries(props).filter(([, value]) => typeof value !== "undefined")
+      )
+    );
+    return (_ctx, _cache) => {
+      return openBlock(), createElementBlock("syn-drawer", mergeProps({
+        onSynShow: _cache[0] || (_cache[0] = ($event) => _ctx.$emit("syn-show", $event)),
+        onSynAfterShow: _cache[1] || (_cache[1] = ($event) => _ctx.$emit("syn-after-show", $event)),
+        onSynHide: _cache[2] || (_cache[2] = ($event) => _ctx.$emit("syn-hide", $event)),
+        onSynAfterHide: _cache[3] || (_cache[3] = ($event) => _ctx.$emit("syn-after-hide", $event)),
+        onSynInitialFocus: _cache[4] || (_cache[4] = ($event) => _ctx.$emit("syn-initial-focus", $event)),
+        onSynRequestClose: _cache[5] || (_cache[5] = ($event) => _ctx.$emit("syn-request-close", $event))
+      }, visibleProps.value, {
+        ref_key: "nativeElement",
+        ref: nativeElement
+      }), [
+        renderSlot(_ctx.$slots, "default")
+      ], 16);
+    };
+  }
+});
+export {
+  _sfc_main as default
+};

package/dist/components/SynVueDrawer.vue2.js

@@ -0,0 +1,4 @@
+import _sfc_main from "./SynVueDrawer.vue.js";
+export {
+  _sfc_main as default
+};

package/dist/components/SynVueDropdown.vue.d.ts

@@ -1,14 +1,9 @@
-import '@synergy-design-system/components/components/dropdown/dropdown.js';
-import type { SynShowEvent } from '@synergy-design-system/components';
-import type { SynAfterShowEvent } from '@synergy-design-system/components';
-import type { SynHideEvent } from '@synergy-design-system/components';
-import type { SynAfterHideEvent } from '@synergy-design-system/components';
-import type { SynDropdown } from '@synergy-design-system/components';
+import { SynShowEvent, SynAfterShowEvent, SynHideEvent, SynAfterHideEvent, SynDropdown } from '@synergy-design-system/components';
 export type { SynShowEvent } from '@synergy-design-system/components';
 export type { SynAfterShowEvent } from '@synergy-design-system/components';
 export type { SynHideEvent } from '@synergy-design-system/components';
 export type { SynAfterHideEvent } from '@synergy-design-system/components';
-declare const _default: __VLS_WithTemplateSlots<import("vue").DefineComponent<{
+declare const _default: __VLS_WithTemplateSlots<import('vue').DefineComponent<{
     /**
   * Indicates whether or not the dropdown is open.
   * You can toggle this attribute to show and hide the dropdown, or you
@@ -58,13 +53,13 @@ declare const _default: __VLS_WithTemplateSlots<import("vue").DefineComponent<{
    */
     containingElement?: SynDropdown["containingElement"];
 }, {
-    nativeElement: import("vue").Ref<SynDropdown | undefined, SynDropdown | undefined>;
-}, {}, {}, {}, import("vue").ComponentOptionsMixin, import("vue").ComponentOptionsMixin, {
-    "syn-after-hide": (e: SynAfterHideEvent) => any;
+    nativeElement: import('vue').Ref<SynDropdown | undefined, SynDropdown | undefined>;
+}, {}, {}, {}, import('vue').ComponentOptionsMixin, import('vue').ComponentOptionsMixin, {
+    "syn-show": (e: SynShowEvent) => any;
     "syn-after-show": (e: SynAfterShowEvent) => any;
     "syn-hide": (e: SynHideEvent) => any;
-    "syn-show": (e: SynShowEvent) => any;
-}, string, import("vue").PublicProps, Readonly<{
+    "syn-after-hide": (e: SynAfterHideEvent) => any;
+}, string, import('vue').PublicProps, Readonly<{
     /**
   * Indicates whether or not the dropdown is open.
   * You can toggle this attribute to show and hide the dropdown, or you
@@ -114,11 +109,11 @@ declare const _default: __VLS_WithTemplateSlots<import("vue").DefineComponent<{
    */
     containingElement?: SynDropdown["containingElement"];
 }> & Readonly<{
-    "onSyn-after-hide"?: ((e: SynAfterHideEvent) => any) | undefined;
+    "onSyn-show"?: ((e: SynShowEvent) => any) | undefined;
     "onSyn-after-show"?: ((e: SynAfterShowEvent) => any) | undefined;
     "onSyn-hide"?: ((e: SynHideEvent) => any) | undefined;
-    "onSyn-show"?: ((e: SynShowEvent) => any) | undefined;
-}>, {}, {}, {}, {}, string, import("vue").ComponentProvideOptions, false, {}, any>, {
+    "onSyn-after-hide"?: ((e: SynAfterHideEvent) => any) | undefined;
+}>, {}, {}, {}, {}, string, import('vue').ComponentProvideOptions, false, {}, any>, {
     default?(_: {}): any;
 }>;
 export default _default;

package/dist/components/SynVueDropdown.vue.js

@@ -0,0 +1,45 @@
+import { defineComponent, ref, computed, openBlock, createElementBlock, mergeProps, renderSlot } from "vue";
+import "@synergy-design-system/components/components/dropdown/dropdown.js";
+const _sfc_main = /* @__PURE__ */ defineComponent({
+  __name: "SynVueDropdown",
+  props: {
+    open: {},
+    placement: {},
+    disabled: {},
+    stayOpenOnSelect: {},
+    distance: {},
+    skidding: {},
+    hoist: {},
+    sync: {},
+    containingElement: {}
+  },
+  emits: ["syn-show", "syn-after-show", "syn-hide", "syn-after-hide"],
+  setup(__props, { expose: __expose }) {
+    const nativeElement = ref();
+    __expose({
+      nativeElement
+    });
+    const props = __props;
+    const visibleProps = computed(
+      () => Object.fromEntries(
+        Object.entries(props).filter(([, value]) => typeof value !== "undefined")
+      )
+    );
+    return (_ctx, _cache) => {
+      return openBlock(), createElementBlock("syn-dropdown", mergeProps({
+        onSynShow: _cache[0] || (_cache[0] = ($event) => _ctx.$emit("syn-show", $event)),
+        onSynAfterShow: _cache[1] || (_cache[1] = ($event) => _ctx.$emit("syn-after-show", $event)),
+        onSynHide: _cache[2] || (_cache[2] = ($event) => _ctx.$emit("syn-hide", $event)),
+        onSynAfterHide: _cache[3] || (_cache[3] = ($event) => _ctx.$emit("syn-after-hide", $event))
+      }, visibleProps.value, {
+        ref_key: "nativeElement",
+        ref: nativeElement
+      }), [
+        renderSlot(_ctx.$slots, "default")
+      ], 16);
+    };
+  }
+});
+export {
+  _sfc_main as default
+};

package/dist/components/SynVueDropdown.vue2.js

@@ -0,0 +1,4 @@
+import _sfc_main from "./SynVueDropdown.vue.js";
+export {
+  _sfc_main as default
+};

package/dist/components/SynVueFile.vue.d.ts

@@ -1,16 +1,10 @@
-import '@synergy-design-system/components/components/file/file.js';
-import type { SynBlurEvent } from '@synergy-design-system/components';
-import type { SynChangeEvent } from '@synergy-design-system/components';
-import type { SynErrorEvent } from '@synergy-design-system/components';
-import type { SynFocusEvent } from '@synergy-design-system/components';
-import type { SynInputEvent } from '@synergy-design-system/components';
-import type { SynFile } from '@synergy-design-system/components';
+import { SynBlurEvent, SynChangeEvent, SynErrorEvent, SynFocusEvent, SynInputEvent, SynFile } from '@synergy-design-system/components';
 export type { SynBlurEvent } from '@synergy-design-system/components';
 export type { SynChangeEvent } from '@synergy-design-system/components';
 export type { SynErrorEvent } from '@synergy-design-system/components';
 export type { SynFocusEvent } from '@synergy-design-system/components';
 export type { SynInputEvent } from '@synergy-design-system/components';
-declare const _default: __VLS_WithTemplateSlots<import("vue").DefineComponent<{
+declare const _default: __VLS_WithTemplateSlots<import('vue').DefineComponent<{
     /**
   * The selected files as a FileList object containing a list of File objects.
   The FileList behaves like an array, so you can get the number of selected files
@@ -99,15 +93,15 @@ declare const _default: __VLS_WithTemplateSlots<import("vue").DefineComponent<{
      */
     modelValue?: SynFile["files"];
 }, {
-    nativeElement: import("vue").Ref<SynFile | undefined, SynFile | undefined>;
-}, {}, {}, {}, import("vue").ComponentOptionsMixin, import("vue").ComponentOptionsMixin, {
+    nativeElement: import('vue').Ref<SynFile | undefined, SynFile | undefined>;
+}, {}, {}, {}, import('vue').ComponentOptionsMixin, import('vue').ComponentOptionsMixin, {
     "syn-blur": (e: SynBlurEvent) => any;
-    "syn-change": (e: SynChangeEvent) => any;
-    "syn-error": (e: SynErrorEvent) => any;
     "syn-focus": (e: SynFocusEvent) => any;
+    "syn-change": (e: SynChangeEvent) => any;
     "syn-input": (e: SynInputEvent) => any;
     "update:modelValue": (newValue: FileList | null) => any;
-}, string, import("vue").PublicProps, Readonly<{
+    "syn-error": (e: SynErrorEvent) => any;
+}, string, import('vue').PublicProps, Readonly<{
     /**
   * The selected files as a FileList object containing a list of File objects.
   The FileList behaves like an array, so you can get the number of selected files
@@ -197,12 +191,12 @@ declare const _default: __VLS_WithTemplateSlots<import("vue").DefineComponent<{
     modelValue?: SynFile["files"];
 }> & Readonly<{
     "onSyn-blur"?: ((e: SynBlurEvent) => any) | undefined;
-    "onSyn-change"?: ((e: SynChangeEvent) => any) | undefined;
-    "onSyn-error"?: ((e: SynErrorEvent) => any) | undefined;
     "onSyn-focus"?: ((e: SynFocusEvent) => any) | undefined;
+    "onSyn-change"?: ((e: SynChangeEvent) => any) | undefined;
     "onSyn-input"?: ((e: SynInputEvent) => any) | undefined;
     "onUpdate:modelValue"?: ((newValue: FileList | null) => any) | undefined;
-}>, {}, {}, {}, {}, string, import("vue").ComponentProvideOptions, false, {}, any>, {
+    "onSyn-error"?: ((e: SynErrorEvent) => any) | undefined;
+}>, {}, {}, {}, {}, string, import('vue').ComponentProvideOptions, false, {}, any>, {
     default?(_: {}): any;
 }>;
 export default _default;

package/dist/components/SynVueFile.vue.js

@@ -0,0 +1,58 @@
+import { defineComponent, ref, computed, openBlock, createElementBlock, mergeProps, renderSlot } from "vue";
+import "@synergy-design-system/components/components/file/file.js";
+const _hoisted_1 = ["files"];
+const _sfc_main = /* @__PURE__ */ defineComponent({
+  __name: "SynVueFile",
+  props: {
+    files: {},
+    name: {},
+    value: {},
+    size: {},
+    label: {},
+    helpText: {},
+    disabled: {},
+    droparea: {},
+    accept: {},
+    capture: {},
+    multiple: {},
+    webkitdirectory: {},
+    form: {},
+    required: {},
+    hideValue: {},
+    modelValue: {}
+  },
+  emits: ["syn-blur", "syn-change", "syn-error", "syn-focus", "syn-input", "update:modelValue"],
+  setup(__props, { expose: __expose }) {
+    const nativeElement = ref();
+    __expose({
+      nativeElement
+    });
+    const props = __props;
+    const visibleProps = computed(
+      () => Object.fromEntries(
+        Object.entries(props).filter(([, value]) => typeof value !== "undefined")
+      )
+    );
+    return (_ctx, _cache) => {
+      return openBlock(), createElementBlock("syn-file", mergeProps({
+        onSynBlur: _cache[0] || (_cache[0] = ($event) => _ctx.$emit("syn-blur", $event)),
+        onSynChange: _cache[1] || (_cache[1] = ($event) => _ctx.$emit("syn-change", $event)),
+        onSynError: _cache[2] || (_cache[2] = ($event) => _ctx.$emit("syn-error", $event)),
+        onSynFocus: _cache[3] || (_cache[3] = ($event) => _ctx.$emit("syn-focus", $event)),
+        onSynInput: _cache[4] || (_cache[4] = ($event) => {
+          _ctx.$emit("update:modelValue", $event.target.files);
+          _ctx.$emit("syn-input", $event);
+        }),
+        files: typeof props.modelValue !== "undefined" ? props.modelValue : typeof props.files !== "undefined" ? props.files : void 0
+      }, visibleProps.value, {
+        ref_key: "nativeElement",
+        ref: nativeElement
+      }), [
+        renderSlot(_ctx.$slots, "default")
+      ], 16, _hoisted_1);
+    };
+  }
+});
+export {
+  _sfc_main as default
+};

package/dist/components/SynVueFile.vue2.js

@@ -0,0 +1,4 @@
+import _sfc_main from "./SynVueFile.vue.js";
+export {
+  _sfc_main as default
+};

package/dist/components/SynVueHeader.vue.d.ts

@@ -1,12 +1,8 @@
-import '@synergy-design-system/components/components/header/header.js';
-import type { SynBurgerMenuClosedEvent } from '@synergy-design-system/components';
-import type { SynBurgerMenuHiddenEvent } from '@synergy-design-system/components';
-import type { SynBurgerMenuOpenEvent } from '@synergy-design-system/components';
-import type { SynHeader } from '@synergy-design-system/components';
+import { SynBurgerMenuClosedEvent, SynBurgerMenuHiddenEvent, SynBurgerMenuOpenEvent, SynHeader } from '@synergy-design-system/components';
 export type { SynBurgerMenuClosedEvent } from '@synergy-design-system/components';
 export type { SynBurgerMenuHiddenEvent } from '@synergy-design-system/components';
 export type { SynBurgerMenuOpenEvent } from '@synergy-design-system/components';
-declare const _default: __VLS_WithTemplateSlots<import("vue").DefineComponent<{
+declare const _default: __VLS_WithTemplateSlots<import('vue').DefineComponent<{
     /**
      * The headers label.
      * If you need to display HTML, use the `label` slot instead.
@@ -22,12 +18,12 @@ declare const _default: __VLS_WithTemplateSlots<import("vue").DefineComponent<{
    */
     burgerMenu?: SynHeader["burgerMenu"];
 }, {
-    nativeElement: import("vue").Ref<SynHeader | undefined, SynHeader | undefined>;
-}, {}, {}, {}, import("vue").ComponentOptionsMixin, import("vue").ComponentOptionsMixin, {
+    nativeElement: import('vue').Ref<SynHeader | undefined, SynHeader | undefined>;
+}, {}, {}, {}, import('vue').ComponentOptionsMixin, import('vue').ComponentOptionsMixin, {
     "syn-burger-menu-closed": (e: SynBurgerMenuClosedEvent) => any;
     "syn-burger-menu-hidden": (e: SynBurgerMenuHiddenEvent) => any;
     "syn-burger-menu-open": (e: SynBurgerMenuOpenEvent) => any;
-}, string, import("vue").PublicProps, Readonly<{
+}, string, import('vue').PublicProps, Readonly<{
     /**
      * The headers label.
      * If you need to display HTML, use the `label` slot instead.
@@ -46,7 +42,7 @@ declare const _default: __VLS_WithTemplateSlots<import("vue").DefineComponent<{
     "onSyn-burger-menu-closed"?: ((e: SynBurgerMenuClosedEvent) => any) | undefined;
     "onSyn-burger-menu-hidden"?: ((e: SynBurgerMenuHiddenEvent) => any) | undefined;
     "onSyn-burger-menu-open"?: ((e: SynBurgerMenuOpenEvent) => any) | undefined;
-}>, {}, {}, {}, {}, string, import("vue").ComponentProvideOptions, false, {}, any>, {
+}>, {}, {}, {}, {}, string, import('vue').ComponentProvideOptions, false, {}, any>, {
     default?(_: {}): any;
 }>;
 export default _default;

package/dist/components/SynVueHeader.vue.js

@@ -0,0 +1,37 @@
+import { defineComponent, ref, computed, openBlock, createElementBlock, mergeProps, renderSlot } from "vue";
+import "@synergy-design-system/components/components/header/header.js";
+const _sfc_main = /* @__PURE__ */ defineComponent({
+  __name: "SynVueHeader",
+  props: {
+    label: {},
+    burgerMenu: {}
+  },
+  emits: ["syn-burger-menu-closed", "syn-burger-menu-hidden", "syn-burger-menu-open"],
+  setup(__props, { expose: __expose }) {
+    const nativeElement = ref();
+    __expose({
+      nativeElement
+    });
+    const props = __props;
+    const visibleProps = computed(
+      () => Object.fromEntries(
+        Object.entries(props).filter(([, value]) => typeof value !== "undefined")
+      )
+    );
+    return (_ctx, _cache) => {
+      return openBlock(), createElementBlock("syn-header", mergeProps({
+        onSynBurgerMenuClosed: _cache[0] || (_cache[0] = ($event) => _ctx.$emit("syn-burger-menu-closed", $event)),
+        onSynBurgerMenuHidden: _cache[1] || (_cache[1] = ($event) => _ctx.$emit("syn-burger-menu-hidden", $event)),
+        onSynBurgerMenuOpen: _cache[2] || (_cache[2] = ($event) => _ctx.$emit("syn-burger-menu-open", $event))
+      }, visibleProps.value, {
+        ref_key: "nativeElement",
+        ref: nativeElement
+      }), [
+        renderSlot(_ctx.$slots, "default")
+      ], 16);
+    };
+  }
+});
+export {
+  _sfc_main as default
+};

package/dist/components/SynVueHeader.vue2.js

@@ -0,0 +1,4 @@
+import _sfc_main from "./SynVueHeader.vue.js";
+export {
+  _sfc_main as default
+};

package/dist/components/SynVueIcon.vue.d.ts

@@ -1,10 +1,7 @@
-import '@synergy-design-system/components/components/icon/icon.js';
-import type { SynLoadEvent } from '@synergy-design-system/components';
-import type { SynErrorEvent } from '@synergy-design-system/components';
-import type { SynIcon } from '@synergy-design-system/components';
+import { SynLoadEvent, SynErrorEvent, SynIcon } from '@synergy-design-system/components';
 export type { SynLoadEvent } from '@synergy-design-system/components';
 export type { SynErrorEvent } from '@synergy-design-system/components';
-declare const _default: import("vue").DefineComponent<{
+declare const _default: import('vue').DefineComponent<{
     /**
      * The name of the icon to draw.
      * Available names depend on the icon library being used.
@@ -27,11 +24,11 @@ declare const _default: import("vue").DefineComponent<{
      */
     library?: SynIcon["library"];
 }, {
-    nativeElement: import("vue").Ref<SynIcon | undefined, SynIcon | undefined>;
-}, {}, {}, {}, import("vue").ComponentOptionsMixin, import("vue").ComponentOptionsMixin, {
+    nativeElement: import('vue').Ref<SynIcon | undefined, SynIcon | undefined>;
+}, {}, {}, {}, import('vue').ComponentOptionsMixin, import('vue').ComponentOptionsMixin, {
     "syn-error": (e: SynErrorEvent) => any;
     "syn-load": (e: SynLoadEvent) => any;
-}, string, import("vue").PublicProps, Readonly<{
+}, string, import('vue').PublicProps, Readonly<{
     /**
      * The name of the icon to draw.
      * Available names depend on the icon library being used.
@@ -56,5 +53,5 @@ declare const _default: import("vue").DefineComponent<{
 }> & Readonly<{
     "onSyn-error"?: ((e: SynErrorEvent) => any) | undefined;
     "onSyn-load"?: ((e: SynLoadEvent) => any) | undefined;
-}>, {}, {}, {}, {}, string, import("vue").ComponentProvideOptions, false, {}, any>;
+}>, {}, {}, {}, {}, string, import('vue').ComponentProvideOptions, false, {}, any>;
 export default _default;

package/dist/components/SynVueIcon.vue.js

@@ -0,0 +1,36 @@
+import { defineComponent, ref, computed, openBlock, createElementBlock, mergeProps } from "vue";
+import "@synergy-design-system/components/components/icon/icon.js";
+const _sfc_main = /* @__PURE__ */ defineComponent({
+  __name: "SynVueIcon",
+  props: {
+    name: {},
+    src: {},
+    label: {},
+    library: {}
+  },
+  emits: ["syn-load", "syn-error"],
+  setup(__props, { expose: __expose }) {
+    const nativeElement = ref();
+    __expose({
+      nativeElement
+    });
+    const props = __props;
+    const visibleProps = computed(
+      () => Object.fromEntries(
+        Object.entries(props).filter(([, value]) => typeof value !== "undefined")
+      )
+    );
+    return (_ctx, _cache) => {
+      return openBlock(), createElementBlock("syn-icon", mergeProps({
+        onSynLoad: _cache[0] || (_cache[0] = ($event) => _ctx.$emit("syn-load", $event)),
+        onSynError: _cache[1] || (_cache[1] = ($event) => _ctx.$emit("syn-error", $event))
+      }, visibleProps.value, {
+        ref_key: "nativeElement",
+        ref: nativeElement
+      }), null, 16);
+    };
+  }
+});
+export {
+  _sfc_main as default
+};

package/dist/components/SynVueIcon.vue2.js

@@ -0,0 +1,4 @@
+import _sfc_main from "./SynVueIcon.vue.js";
+export {
+  _sfc_main as default
+};

package/dist/components/SynVueIconButton.vue.d.ts

@@ -1,10 +1,7 @@
-import '@synergy-design-system/components/components/icon-button/icon-button.js';
-import type { SynBlurEvent } from '@synergy-design-system/components';
-import type { SynFocusEvent } from '@synergy-design-system/components';
-import type { SynIconButton } from '@synergy-design-system/components';
+import { SynBlurEvent, SynFocusEvent, SynIconButton } from '@synergy-design-system/components';
 export type { SynBlurEvent } from '@synergy-design-system/components';
 export type { SynFocusEvent } from '@synergy-design-system/components';
-declare const _default: import("vue").DefineComponent<{
+declare const _default: import('vue').DefineComponent<{
     /**
      * The name of the icon to draw.
      * Available names depend on the icon library being used.
@@ -54,11 +51,11 @@ declare const _default: import("vue").DefineComponent<{
      */
     disabled?: SynIconButton["disabled"];
 }, {
-    nativeElement: import("vue").Ref<SynIconButton | undefined, SynIconButton | undefined>;
-}, {}, {}, {}, import("vue").ComponentOptionsMixin, import("vue").ComponentOptionsMixin, {
+    nativeElement: import('vue').Ref<SynIconButton | undefined, SynIconButton | undefined>;
+}, {}, {}, {}, import('vue').ComponentOptionsMixin, import('vue').ComponentOptionsMixin, {
     "syn-blur": (e: SynBlurEvent) => any;
     "syn-focus": (e: SynFocusEvent) => any;
-}, string, import("vue").PublicProps, Readonly<{
+}, string, import('vue').PublicProps, Readonly<{
     /**
      * The name of the icon to draw.
      * Available names depend on the icon library being used.
@@ -110,5 +107,5 @@ declare const _default: import("vue").DefineComponent<{
 }> & Readonly<{
     "onSyn-blur"?: ((e: SynBlurEvent) => any) | undefined;
     "onSyn-focus"?: ((e: SynFocusEvent) => any) | undefined;
-}>, {}, {}, {}, {}, string, import("vue").ComponentProvideOptions, false, {}, any>;
+}>, {}, {}, {}, {}, string, import('vue').ComponentProvideOptions, false, {}, any>;
 export default _default;

package/dist/components/SynVueIconButton.vue.js

@@ -0,0 +1,42 @@
+import { defineComponent, ref, computed, openBlock, createElementBlock, mergeProps } from "vue";
+import "@synergy-design-system/components/components/icon-button/icon-button.js";
+const _sfc_main = /* @__PURE__ */ defineComponent({
+  __name: "SynVueIconButton",
+  props: {
+    name: {},
+    library: {},
+    src: {},
+    href: {},
+    target: {},
+    download: {},
+    label: {},
+    size: {},
+    color: {},
+    disabled: {}
+  },
+  emits: ["syn-blur", "syn-focus"],
+  setup(__props, { expose: __expose }) {
+    const nativeElement = ref();
+    __expose({
+      nativeElement
+    });
+    const props = __props;
+    const visibleProps = computed(
+      () => Object.fromEntries(
+        Object.entries(props).filter(([, value]) => typeof value !== "undefined")
+      )
+    );
+    return (_ctx, _cache) => {
+      return openBlock(), createElementBlock("syn-icon-button", mergeProps({
+        onSynBlur: _cache[0] || (_cache[0] = ($event) => _ctx.$emit("syn-blur", $event)),
+        onSynFocus: _cache[1] || (_cache[1] = ($event) => _ctx.$emit("syn-focus", $event))
+      }, visibleProps.value, {
+        ref_key: "nativeElement",
+        ref: nativeElement
+      }), null, 16);
+    };
+  }
+});
+export {
+  _sfc_main as default
+};

package/dist/components/SynVueIconButton.vue2.js

@@ -0,0 +1,4 @@
+import _sfc_main from "./SynVueIconButton.vue.js";
+export {
+  _sfc_main as default
+};