@synergy-design-system/vue 2.6.0 → 2.7.1

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

@@ -7,50 +7,50 @@ declare const _default: import("vue").DefineComponent<__VLS_TypePropsToOption<{
   * The name of the icon to draw.
   * Available names depend on the icon library being used.
    */
-    name?: SynIconButton['name'];
+    name?: SynIconButton["name"];
     /**
   * The name of a registered custom icon library.
    */
-    library?: SynIconButton['library'];
+    library?: SynIconButton["library"];
     /**
   * An external URL of an SVG file.
   * Be sure you trust the content you are including, as it will be executed as code and
   can result in XSS attacks.
    */
-    src?: SynIconButton['src'];
+    src?: SynIconButton["src"];
     /**
   * When set, the underlying button will be rendered as an `<a>` with this `href` instead of a `<button>`.
    */
-    href?: SynIconButton['href'];
+    href?: SynIconButton["href"];
     /**
   * Tells the browser where to open the link.
   * Only used when `href` is set.
    */
-    target?: SynIconButton['target'];
+    target?: SynIconButton["target"];
     /**
   * Tells the browser to download the linked file as this filename.
   * Only used when `href` is set.
    */
-    download?: SynIconButton['download'];
+    download?: SynIconButton["download"];
     /**
   * A description that gets read by assistive devices.
   * For optimal accessibility, you should always include a label
   that describes what the icon button does.
    */
-    label?: string | undefined;
+    label?: SynIconButton["label"];
     /**
   * The icon button's size.
    */
-    size?: "medium" | "large" | "small" | "inherit" | undefined;
+    size?: SynIconButton["size"];
     /**
   * The color of the icon button.
   The default "currentColor" makes it possible to easily style the icon button from outside without any CSS variables.
    */
-    color?: "primary" | "neutral" | "currentColor" | undefined;
+    color?: SynIconButton["color"];
     /**
   * Disables the button.
    */
-    disabled?: boolean | undefined;
+    disabled?: SynIconButton["disabled"];
 }>, {
     nativeElement: import("vue").Ref<SynIconButton | undefined>;
 }, unknown, {}, {}, import("vue").ComponentOptionsMixin, import("vue").ComponentOptionsMixin, {
@@ -61,50 +61,50 @@ declare const _default: import("vue").DefineComponent<__VLS_TypePropsToOption<{
   * The name of the icon to draw.
   * Available names depend on the icon library being used.
    */
-    name?: SynIconButton['name'];
+    name?: SynIconButton["name"];
     /**
   * The name of a registered custom icon library.
    */
-    library?: SynIconButton['library'];
+    library?: SynIconButton["library"];
     /**
   * An external URL of an SVG file.
   * Be sure you trust the content you are including, as it will be executed as code and
   can result in XSS attacks.
    */
-    src?: SynIconButton['src'];
+    src?: SynIconButton["src"];
     /**
   * When set, the underlying button will be rendered as an `<a>` with this `href` instead of a `<button>`.
    */
-    href?: SynIconButton['href'];
+    href?: SynIconButton["href"];
     /**
   * Tells the browser where to open the link.
   * Only used when `href` is set.
    */
-    target?: SynIconButton['target'];
+    target?: SynIconButton["target"];
     /**
   * Tells the browser to download the linked file as this filename.
   * Only used when `href` is set.
    */
-    download?: SynIconButton['download'];
+    download?: SynIconButton["download"];
     /**
   * A description that gets read by assistive devices.
   * For optimal accessibility, you should always include a label
   that describes what the icon button does.
    */
-    label?: string | undefined;
+    label?: SynIconButton["label"];
     /**
   * The icon button's size.
    */
-    size?: "medium" | "large" | "small" | "inherit" | undefined;
+    size?: SynIconButton["size"];
     /**
   * The color of the icon button.
   The default "currentColor" makes it possible to easily style the icon button from outside without any CSS variables.
    */
-    color?: "primary" | "neutral" | "currentColor" | undefined;
+    color?: SynIconButton["color"];
     /**
   * Disables the button.
    */
-    disabled?: boolean | undefined;
+    disabled?: SynIconButton["disabled"];
 }>>> & {
     "onSyn-blur"?: ((e: SynBlurEvent) => any) | undefined;
     "onSyn-focus"?: ((e: SynFocusEvent) => any) | undefined;

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

@@ -7,66 +7,66 @@ export type { SynFocusEvent } from '@synergy-design-system/components';
 export type { SynInputEvent } from '@synergy-design-system/components';
 export type { SynInvalidEvent } from '@synergy-design-system/components';
 declare const _default: __VLS_WithTemplateSlots<import("vue").DefineComponent<__VLS_TypePropsToOption<{
-    title?: string | undefined;
+    title?: SynInput["title"];
     /**
   * The type of input.
   * Works the same as a native `<input>` element, but only a subset of types are supported.
   * Defaults
   to `text`.
    */
-    type?: "number" | "search" | "time" | "text" | "date" | "datetime-local" | "email" | "password" | "tel" | "url" | undefined;
+    type?: SynInput["type"];
     /**
   * The name of the input, submitted as a name/value pair with form data.
    */
-    name?: string | undefined;
+    name?: SynInput["name"];
     /**
   * The current value of the input, submitted as a name/value pair with form data.
    */
-    value?: string | undefined;
+    value?: SynInput["value"];
     /**
   * The input's size.
    */
-    size?: "medium" | "large" | "small" | undefined;
+    size?: SynInput["size"];
     /**
   * The input's label.
   * If you need to display HTML, use the `label` slot instead.
    */
-    label?: string | undefined;
+    label?: SynInput["label"];
     /**
   * The input's help text.
   * If you need to display HTML, use the `help-text` slot instead.
    */
-    helpText?: string | undefined;
+    helpText?: SynInput["helpText"];
     /**
   * Adds a clear button when the input is not empty.
    */
-    clearable?: boolean | undefined;
+    clearable?: SynInput["clearable"];
     /**
   * Disables the input.
    */
-    disabled?: boolean | undefined;
+    disabled?: SynInput["disabled"];
     /**
   * Placeholder text to show as a hint when the input is empty.
    */
-    placeholder?: string | undefined;
+    placeholder?: SynInput["placeholder"];
     /**
   * Makes the input readonly.
    */
-    readonly?: boolean | undefined;
+    readonly?: SynInput["readonly"];
     /**
   * Adds a button to toggle the password's visibility.
   * Only applies to password types.
    */
-    passwordToggle?: boolean | undefined;
+    passwordToggle?: SynInput["passwordToggle"];
     /**
   * Determines whether or not the password is currently visible.
   * Only applies to password input types.
    */
-    passwordVisible?: boolean | undefined;
+    passwordVisible?: SynInput["passwordVisible"];
     /**
   * Hides the increment/decrement spin buttons for number inputs.
    */
-    noSpinButtons?: boolean | undefined;
+    noSpinButtons?: SynInput["noSpinButtons"];
     /**
   * By default, form controls are associated with the nearest containing `<form>` element.
   * This attribute allows you
@@ -74,74 +74,74 @@ declare const _default: __VLS_WithTemplateSlots<import("vue").DefineComponent<__
   * The form must be in
   the same document or shadow root for this to work.
    */
-    form?: string | undefined;
+    form?: SynInput["form"];
     /**
   * Makes the input a required field.
    */
-    required?: boolean | undefined;
+    required?: SynInput["required"];
     /**
   * A regular expression pattern to validate input against.
    */
-    pattern?: string | undefined;
+    pattern?: SynInput["pattern"];
     /**
   * The minimum length of input that will be considered valid.
    */
-    minlength?: number | undefined;
+    minlength?: SynInput["minlength"];
     /**
   * The maximum length of input that will be considered valid.
    */
-    maxlength?: number | undefined;
+    maxlength?: SynInput["maxlength"];
     /**
   * The input's minimum value.
   * Only applies to date and number input types.
    */
-    min?: string | number | undefined;
+    min?: SynInput["min"];
     /**
   * The input's maximum value.
   * Only applies to date and number input types.
    */
-    max?: string | number | undefined;
+    max?: SynInput["max"];
     /**
   * Specifies the granularity that the value must adhere to, or the special value `any` which means no stepping is
   implied, allowing any numeric value.
   * Only applies to date and number input types.
    */
-    step?: number | "any" | undefined;
+    step?: SynInput["step"];
     /**
   * Controls whether and how text input is automatically capitalized as it is entered by the user.
    */
-    autocapitalize?: "off" | "none" | "on" | "sentences" | "words" | "characters" | undefined;
+    autocapitalize?: SynInput["autocapitalize"];
     /**
   * Indicates whether the browser's autocorrect feature is on or off.
    */
-    autocorrect?: "off" | "on" | undefined;
+    autocorrect?: SynInput["autocorrect"];
     /**
   * Specifies what permission the browser has to provide assistance in filling out form field values.
   * Refer to
   [this page on MDN](https://developer.mozilla.org/en-US/docs/Web/HTML/Attributes/autocomplete) for available values.
    */
-    autocomplete?: string | undefined;
+    autocomplete?: SynInput["autocomplete"];
     /**
   * Indicates that the input should receive focus on page load.
    */
-    autofocus?: boolean | undefined;
+    autofocus?: SynInput["autofocus"];
     /**
   * Used to customize the label or icon of the Enter key on virtual keyboards.
    */
-    enterkeyhint?: "done" | "search" | "enter" | "go" | "next" | "previous" | "send" | undefined;
+    enterkeyhint?: SynInput["enterkeyhint"];
     /**
   * Enables spell checking on the input.
    */
-    spellcheck?: boolean | undefined;
+    spellcheck?: SynInput["spellcheck"];
     /**
   * Tells the browser what type of data will be entered by the user, allowing it to display the appropriate virtual
   keyboard on supportive devices.
    */
-    inputmode?: "search" | "text" | "email" | "tel" | "url" | "none" | "decimal" | "numeric" | undefined;
+    inputmode?: SynInput["inputmode"];
     /**
   * Support for two way data binding
    */
-    modelValue?: string | undefined;
+    modelValue?: SynInput["value"];
 }>, {
     nativeElement: import("vue").Ref<SynInput | undefined>;
 }, unknown, {}, {}, import("vue").ComponentOptionsMixin, import("vue").ComponentOptionsMixin, {
@@ -153,66 +153,66 @@ declare const _default: __VLS_WithTemplateSlots<import("vue").DefineComponent<__
     "update:modelValue": (newValue: string) => void;
     "syn-clear": (e: SynClearEvent) => void;
 }, string, import("vue").PublicProps, Readonly<import("vue").ExtractPropTypes<__VLS_TypePropsToOption<{
-    title?: string | undefined;
+    title?: SynInput["title"];
     /**
   * The type of input.
   * Works the same as a native `<input>` element, but only a subset of types are supported.
   * Defaults
   to `text`.
    */
-    type?: "number" | "search" | "time" | "text" | "date" | "datetime-local" | "email" | "password" | "tel" | "url" | undefined;
+    type?: SynInput["type"];
     /**
   * The name of the input, submitted as a name/value pair with form data.
    */
-    name?: string | undefined;
+    name?: SynInput["name"];
     /**
   * The current value of the input, submitted as a name/value pair with form data.
    */
-    value?: string | undefined;
+    value?: SynInput["value"];
     /**
   * The input's size.
    */
-    size?: "medium" | "large" | "small" | undefined;
+    size?: SynInput["size"];
     /**
   * The input's label.
   * If you need to display HTML, use the `label` slot instead.
    */
-    label?: string | undefined;
+    label?: SynInput["label"];
     /**
   * The input's help text.
   * If you need to display HTML, use the `help-text` slot instead.
    */
-    helpText?: string | undefined;
+    helpText?: SynInput["helpText"];
     /**
   * Adds a clear button when the input is not empty.
    */
-    clearable?: boolean | undefined;
+    clearable?: SynInput["clearable"];
     /**
   * Disables the input.
    */
-    disabled?: boolean | undefined;
+    disabled?: SynInput["disabled"];
     /**
   * Placeholder text to show as a hint when the input is empty.
    */
-    placeholder?: string | undefined;
+    placeholder?: SynInput["placeholder"];
     /**
   * Makes the input readonly.
    */
-    readonly?: boolean | undefined;
+    readonly?: SynInput["readonly"];
     /**
   * Adds a button to toggle the password's visibility.
   * Only applies to password types.
    */
-    passwordToggle?: boolean | undefined;
+    passwordToggle?: SynInput["passwordToggle"];
     /**
   * Determines whether or not the password is currently visible.
   * Only applies to password input types.
    */
-    passwordVisible?: boolean | undefined;
+    passwordVisible?: SynInput["passwordVisible"];
     /**
   * Hides the increment/decrement spin buttons for number inputs.
    */
-    noSpinButtons?: boolean | undefined;
+    noSpinButtons?: SynInput["noSpinButtons"];
     /**
   * By default, form controls are associated with the nearest containing `<form>` element.
   * This attribute allows you
@@ -220,74 +220,74 @@ declare const _default: __VLS_WithTemplateSlots<import("vue").DefineComponent<__
   * The form must be in
   the same document or shadow root for this to work.
    */
-    form?: string | undefined;
+    form?: SynInput["form"];
     /**
   * Makes the input a required field.
    */
-    required?: boolean | undefined;
+    required?: SynInput["required"];
     /**
   * A regular expression pattern to validate input against.
    */
-    pattern?: string | undefined;
+    pattern?: SynInput["pattern"];
     /**
   * The minimum length of input that will be considered valid.
    */
-    minlength?: number | undefined;
+    minlength?: SynInput["minlength"];
     /**
   * The maximum length of input that will be considered valid.
    */
-    maxlength?: number | undefined;
+    maxlength?: SynInput["maxlength"];
     /**
   * The input's minimum value.
   * Only applies to date and number input types.
    */
-    min?: string | number | undefined;
+    min?: SynInput["min"];
     /**
   * The input's maximum value.
   * Only applies to date and number input types.
    */
-    max?: string | number | undefined;
+    max?: SynInput["max"];
     /**
   * Specifies the granularity that the value must adhere to, or the special value `any` which means no stepping is
   implied, allowing any numeric value.
   * Only applies to date and number input types.
    */
-    step?: number | "any" | undefined;
+    step?: SynInput["step"];
     /**
   * Controls whether and how text input is automatically capitalized as it is entered by the user.
    */
-    autocapitalize?: "off" | "none" | "on" | "sentences" | "words" | "characters" | undefined;
+    autocapitalize?: SynInput["autocapitalize"];
     /**
   * Indicates whether the browser's autocorrect feature is on or off.
    */
-    autocorrect?: "off" | "on" | undefined;
+    autocorrect?: SynInput["autocorrect"];
     /**
   * Specifies what permission the browser has to provide assistance in filling out form field values.
   * Refer to
   [this page on MDN](https://developer.mozilla.org/en-US/docs/Web/HTML/Attributes/autocomplete) for available values.
    */
-    autocomplete?: string | undefined;
+    autocomplete?: SynInput["autocomplete"];
     /**
   * Indicates that the input should receive focus on page load.
    */
-    autofocus?: boolean | undefined;
+    autofocus?: SynInput["autofocus"];
     /**
   * Used to customize the label or icon of the Enter key on virtual keyboards.
    */
-    enterkeyhint?: "done" | "search" | "enter" | "go" | "next" | "previous" | "send" | undefined;
+    enterkeyhint?: SynInput["enterkeyhint"];
     /**
   * Enables spell checking on the input.
    */
-    spellcheck?: boolean | undefined;
+    spellcheck?: SynInput["spellcheck"];
     /**
   * Tells the browser what type of data will be entered by the user, allowing it to display the appropriate virtual
   keyboard on supportive devices.
    */
-    inputmode?: "search" | "text" | "email" | "tel" | "url" | "none" | "decimal" | "numeric" | undefined;
+    inputmode?: SynInput["inputmode"];
     /**
   * Support for two way data binding
    */
-    modelValue?: string | undefined;
+    modelValue?: SynInput["value"];
 }>>> & {
     "onSyn-blur"?: ((e: SynBlurEvent) => any) | undefined;
     "onSyn-focus"?: ((e: SynFocusEvent) => any) | undefined;

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

@@ -1,28 +1,31 @@
 import '@synergy-design-system/components/components/menu-item/menu-item.js';
 import type { SynMenuItem } from '@synergy-design-system/components';
-declare const _default: __VLS_WithTemplateSlots<import("vue").DefineComponent<__VLS_TypePropsToOption<{
+declare function __VLS_template(): {
+    default?(_: {}): any;
+};
+declare const __VLS_component: import("vue").DefineComponent<__VLS_TypePropsToOption<{
     /**
   * The type of menu item to render.
   * To use `checked`, this value must be set to `checkbox`.
    */
-    type?: "normal" | "checkbox" | undefined;
+    type?: SynMenuItem["type"];
     /**
   * Draws the item in a checked state.
    */
-    checked?: boolean | undefined;
+    checked?: SynMenuItem["checked"];
     /**
   * A unique value to store in the menu item.
   * This can be used as a way to identify menu items when selected.
    */
-    value?: string | undefined;
+    value?: SynMenuItem["value"];
     /**
   * Draws the menu item in a loading state.
    */
-    loading?: boolean | undefined;
+    loading?: SynMenuItem["loading"];
     /**
   * Draws the menu item in a disabled state, preventing selection.
    */
-    disabled?: boolean | undefined;
+    disabled?: SynMenuItem["disabled"];
 }>, {
     nativeElement: import("vue").Ref<SynMenuItem | undefined>;
 }, unknown, {}, {}, import("vue").ComponentOptionsMixin, import("vue").ComponentOptionsMixin, {}, string, import("vue").PublicProps, Readonly<import("vue").ExtractPropTypes<__VLS_TypePropsToOption<{
@@ -30,27 +33,26 @@ declare const _default: __VLS_WithTemplateSlots<import("vue").DefineComponent<__
   * The type of menu item to render.
   * To use `checked`, this value must be set to `checkbox`.
    */
-    type?: "normal" | "checkbox" | undefined;
+    type?: SynMenuItem["type"];
     /**
   * Draws the item in a checked state.
    */
-    checked?: boolean | undefined;
+    checked?: SynMenuItem["checked"];
     /**
   * A unique value to store in the menu item.
   * This can be used as a way to identify menu items when selected.
    */
-    value?: string | undefined;
+    value?: SynMenuItem["value"];
     /**
   * Draws the menu item in a loading state.
    */
-    loading?: boolean | undefined;
+    loading?: SynMenuItem["loading"];
     /**
   * Draws the menu item in a disabled state, preventing selection.
    */
-    disabled?: boolean | undefined;
-}>>>, {}, {}>, {
-    default?(_: {}): any;
-}>;
+    disabled?: SynMenuItem["disabled"];
+}>>>, {}, {}>;
+declare const _default: __VLS_WithTemplateSlots<typeof __VLS_component, ReturnType<typeof __VLS_template>>;
 export default _default;
 type __VLS_WithTemplateSlots<T, S> = T & {
     new (): {

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

@@ -1,10 +1,12 @@
 import '@synergy-design-system/components/components/menu-label/menu-label.js';
 import type { SynMenuLabel } from '@synergy-design-system/components';
-declare const _default: __VLS_WithTemplateSlots<import("vue").DefineComponent<{}, {
-    nativeElement: import("vue").Ref<SynMenuLabel | undefined>;
-}, {}, {}, {}, import("vue").ComponentOptionsMixin, import("vue").ComponentOptionsMixin, {}, string, import("vue").PublicProps, Readonly<import("vue").ExtractPropTypes<{}>>, {}, {}>, {
+declare function __VLS_template(): {
     default?(_: {}): any;
-}>;
+};
+declare const __VLS_component: import("vue").DefineComponent<{}, {
+    nativeElement: import("vue").Ref<SynMenuLabel | undefined>;
+}, {}, {}, {}, import("vue").ComponentOptionsMixin, import("vue").ComponentOptionsMixin, {}, string, import("vue").PublicProps, Readonly<import("vue").ExtractPropTypes<{}>>, {}, {}>;
+declare const _default: __VLS_WithTemplateSlots<typeof __VLS_component, ReturnType<typeof __VLS_template>>;
 export default _default;
 type __VLS_WithTemplateSlots<T, S> = T & {
     new (): {

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

@@ -12,31 +12,31 @@ declare const _default: __VLS_WithTemplateSlots<import("vue").DefineComponent<__
   If the 'children' slot is provided, the navigation item will ignore the 'href' and use
   accordion behavior.
    */
-    href?: string | undefined;
-    current?: boolean | undefined;
+    href?: SynNavItem["href"];
+    current?: SynNavItem["current"];
     /**
   * Disables the navigation item.
    */
-    disabled?: boolean | undefined;
+    disabled?: SynNavItem["disabled"];
     /**
   * The navigation item's orientation.
    */
-    horizontal?: boolean | undefined;
+    horizontal?: SynNavItem["horizontal"];
     /**
   * Appends a chevron to the right side of a navigation item.
   Only used if `horizontal` is false.
    */
-    chevron?: boolean | undefined;
+    chevron?: SynNavItem["chevron"];
     /**
   * Reflects HTML details element state and allows control from parent.
   Only used if `horizontal` is false and `children` is defined.
    */
-    open?: boolean | undefined;
+    open?: SynNavItem["open"];
     /**
   * Toggle to true to show a divider above the element.
   Only available when horizontal is false.
    */
-    divider?: boolean | undefined;
+    divider?: SynNavItem["divider"];
 }>, {
     nativeElement: import("vue").Ref<SynNavItem | undefined>;
 }, unknown, {}, {}, import("vue").ComponentOptionsMixin, import("vue").ComponentOptionsMixin, {
@@ -52,31 +52,31 @@ declare const _default: __VLS_WithTemplateSlots<import("vue").DefineComponent<__
   If the 'children' slot is provided, the navigation item will ignore the 'href' and use
   accordion behavior.
    */
-    href?: string | undefined;
-    current?: boolean | undefined;
+    href?: SynNavItem["href"];
+    current?: SynNavItem["current"];
     /**
   * Disables the navigation item.
    */
-    disabled?: boolean | undefined;
+    disabled?: SynNavItem["disabled"];
     /**
   * The navigation item's orientation.
    */
-    horizontal?: boolean | undefined;
+    horizontal?: SynNavItem["horizontal"];
     /**
   * Appends a chevron to the right side of a navigation item.
   Only used if `horizontal` is false.
    */
-    chevron?: boolean | undefined;
+    chevron?: SynNavItem["chevron"];
     /**
   * Reflects HTML details element state and allows control from parent.
   Only used if `horizontal` is false and `children` is defined.
    */
-    open?: boolean | undefined;
+    open?: SynNavItem["open"];
     /**
   * Toggle to true to show a divider above the element.
   Only available when horizontal is false.
    */
-    divider?: boolean | undefined;
+    divider?: SynNavItem["divider"];
 }>>> & {
     "onSyn-show"?: ((e: SynShowEvent) => any) | undefined;
     "onSyn-hide"?: ((e: SynHideEvent) => any) | undefined;