@muenchen/muc-patternlab-vue 2.1.2-beta.1 → 3.0.0-beta.2

package/components/Calendar/MucCalendar.stories.d.ts

@@ -3,9 +3,12 @@ declare const _default: {
         modelValue?: import('./MucCalendarType').MucCalendarSelected;
     } & {
         viewMonth?: Date;
+        min?: Date;
+        max?: Date;
         showAdjacentMonths?: boolean;
         variant?: import('./MucCalendarType').CalendarTypes;
         disabled?: boolean;
+        disableViewChange?: boolean;
         noAnimation?: boolean;
         allowedDates?: import('./MucCalendarType').AllowedDateFunction;
     }, {}, {}, {}, {}, import('vue').ComponentOptionsMixin, import('vue').ComponentOptionsMixin, {
@@ -14,9 +17,12 @@ declare const _default: {
         modelValue?: import('./MucCalendarType').MucCalendarSelected;
     } & {
         viewMonth?: Date;
+        min?: Date;
+        max?: Date;
         showAdjacentMonths?: boolean;
         variant?: import('./MucCalendarType').CalendarTypes;
         disabled?: boolean;
+        disableViewChange?: boolean;
         noAnimation?: boolean;
         allowedDates?: import('./MucCalendarType').AllowedDateFunction;
     }> & Readonly<{
@@ -34,24 +40,68 @@ declare const _default: {
 };
 export default _default;
 export declare const Single: {
+    argTypes: {
+        viewMonth: {
+            control: string;
+        };
+        min: {
+            control: string;
+        };
+        max: {
+            control: string;
+        };
+    };
     args: {
         variant: string;
         showAdjacentMonths: boolean;
     };
 };
 export declare const MultipleWithSelectedViewMonth: {
+    argTypes: {
+        viewMonth: {
+            control: string;
+        };
+        min: {
+            control: string;
+        };
+        max: {
+            control: string;
+        };
+    };
     args: {
         variant: string;
         viewMonth: Date;
     };
 };
 export declare const Range: {
+    argTypes: {
+        viewMonth: {
+            control: string;
+        };
+        min: {
+            control: string;
+        };
+        max: {
+            control: string;
+        };
+    };
     args: {
         variant: string;
         showAdjacentMonths: boolean;
     };
 };
 export declare const DisabledWithPreSelectedDate: {
+    argTypes: {
+        viewMonth: {
+            control: string;
+        };
+        min: {
+            control: string;
+        };
+        max: {
+            control: string;
+        };
+    };
     args: {
         disabled: boolean;
         showAdjacentMonths: boolean;
@@ -59,15 +109,74 @@ export declare const DisabledWithPreSelectedDate: {
     };
 };
 export declare const AllowedDatesWithNoAnimation: {
+    argTypes: {
+        viewMonth: {
+            control: string;
+        };
+        min: {
+            control: string;
+        };
+        max: {
+            control: string;
+        };
+    };
     args: {
         noAnimation: boolean;
         allowedDates: (date: Date) => boolean;
     };
 };
 export declare const DisabledPreSelectedViewMonth: {
+    argTypes: {
+        viewMonth: {
+            control: string;
+        };
+        min: {
+            control: string;
+        };
+        max: {
+            control: string;
+        };
+    };
     args: {
         disabled: boolean;
         showAdjacentMonths: boolean;
         viewMonth: Date;
     };
 };
+export declare const DisableViewChange: {
+    argTypes: {
+        viewMonth: {
+            control: string;
+        };
+        min: {
+            control: string;
+        };
+        max: {
+            control: string;
+        };
+    };
+    args: {
+        variant: string;
+        showAdjacentMonths: boolean;
+        disableViewChange: boolean;
+    };
+};
+export declare const MinAndMax: {
+    argTypes: {
+        viewMonth: {
+            control: string;
+        };
+        min: {
+            control: string;
+        };
+        max: {
+            control: string;
+        };
+    };
+    args: {
+        variant: string;
+        viewMonth: Date;
+        min: Date;
+        max: Date;
+    };
+};

package/components/Calendar/MucCalendar.vue.d.ts

@@ -4,6 +4,14 @@ type __VLS_Props = {
      * Initial date to be displayed on the selection screen
      */
     viewMonth?: Date;
+    /**
+     * Earliest selectable date
+     */
+    min?: Date;
+    /**
+     * Latest selectable date
+     */
+    max?: Date;
     /**
      * Select if adjacent (before and after) month should be shown in the selection of the day. Defaults to false
      */
@@ -16,6 +24,10 @@ type __VLS_Props = {
      * Disable the selection of dates by the user. Defaults to false
      */
     disabled?: boolean;
+    /**
+     * Disables the change of the calendar view. Only show month view. Defaults to false
+     */
+    disableViewChange?: boolean;
     /**
      * Disables the animation
      */

package/components/Calendar/MucCalendarType.d.ts

@@ -1,4 +1,4 @@
-import { InjectionKey, Ref } from 'vue';
+import { ComputedRef, InjectionKey, Ref } from 'vue';
 /**
  * Different possible types of date selection for the calendar
  */
@@ -24,6 +24,8 @@ type MucCalendarSelected = null | Date | Date[] | MucDateRange;
  */
 type MucCalendarInjection = {
     viewDate: Readonly<Ref<Date>>;
+    minDate: ComputedRef<Date | undefined>;
+    maxDate: ComputedRef<Date | undefined>;
     selectedDate: Readonly<Ref<MucCalendarSelected>>;
     variant: Readonly<Ref<CalendarTypes>>;
     showAdjacentMonths: Readonly<Ref<boolean>>;

package/components/Calendar/MucMonthTile.vue.d.ts

@@ -0,0 +1,12 @@
+type __VLS_Props = {
+    /**
+     * Date of for this tile to be displayed
+     */
+    date: Date;
+};
+declare const _default: import('vue').DefineComponent<__VLS_Props, {}, {}, {}, {}, import('vue').ComponentOptionsMixin, import('vue').ComponentOptionsMixin, {
+    click: (date: Date) => any;
+}, string, import('vue').PublicProps, Readonly<__VLS_Props> & Readonly<{
+    onClick?: ((date: Date) => any) | undefined;
+}>, {}, {}, {}, {}, string, import('vue').ComponentProvideOptions, false, {}, HTMLDivElement>;
+export default _default;

package/components/Calendar/MucYearTile.vue.d.ts

@@ -0,0 +1,12 @@
+type __VLS_Props = {
+    /**
+     * Date of for this tile to be displayed
+     */
+    date: Date;
+};
+declare const _default: import('vue').DefineComponent<__VLS_Props, {}, {}, {}, {}, import('vue').ComponentOptionsMixin, import('vue').ComponentOptionsMixin, {
+    click: (date: Date) => any;
+}, string, import('vue').PublicProps, Readonly<__VLS_Props> & Readonly<{
+    onClick?: ((date: Date) => any) | undefined;
+}>, {}, {}, {}, {}, string, import('vue').ComponentProvideOptions, false, {}, HTMLDivElement>;
+export default _default;

package/components/Form/MucCheckbox.stories.d.ts

@@ -2,6 +2,7 @@ declare const _default: {
     component: import('vue').DefineComponent<{
         modelValue?: boolean;
     } & {
+        id: string;
         label: string;
     }, {}, {}, {}, {}, import('vue').ComponentOptionsMixin, import('vue').ComponentOptionsMixin, {
         "update:modelValue": (value: boolean) => any;
@@ -10,6 +11,7 @@ declare const _default: {
     }, string, import('vue').PublicProps, Readonly<{
         modelValue?: boolean;
     } & {
+        id: string;
         label: string;
     }> & Readonly<{
         onClick?: (() => any) | undefined;
@@ -28,6 +30,7 @@ declare const _default: {
 export default _default;
 export declare const Default: {
     args: {
+        id: string;
         label: string;
     };
 };

package/components/Form/MucCheckbox.vue.d.ts

@@ -1,4 +1,8 @@
 type __VLS_Props = {
+    /**
+     *  Unique identifier for the checkbox. Required property used to associate the checkbox with its label and hint text for accessibility.
+     */
+    id: string;
     /**
      * Label is displayed to the right of the checkbox as information for the user.
      */

package/components/Form/MucCheckboxGroup.stories.d.ts

@@ -30,6 +30,7 @@ declare const _default: {
         MucCheckbox: import('vue').DefineComponent<{
             modelValue?: boolean;
         } & {
+            id: string;
             label: string;
         }, {}, {}, {}, {}, import('vue').ComponentOptionsMixin, import('vue').ComponentOptionsMixin, {
             "update:modelValue": (value: boolean) => any;
@@ -38,6 +39,7 @@ declare const _default: {
         }, string, import('vue').PublicProps, Readonly<{
             modelValue?: boolean;
         } & {
+            id: string;
             label: string;
         }> & Readonly<{
             onClick?: (() => any) | undefined;
@@ -87,6 +89,7 @@ export declare const NotCollapsable: () => {
         MucCheckbox: import('vue').DefineComponent<{
             modelValue?: boolean;
         } & {
+            id: string;
             label: string;
         }, {}, {}, {}, {}, import('vue').ComponentOptionsMixin, import('vue').ComponentOptionsMixin, {
             "update:modelValue": (value: boolean) => any;
@@ -95,6 +98,7 @@ export declare const NotCollapsable: () => {
         }, string, import('vue').PublicProps, Readonly<{
             modelValue?: boolean;
         } & {
+            id: string;
             label: string;
         }> & Readonly<{
             onClick?: (() => any) | undefined;
@@ -135,6 +139,7 @@ export declare const Collapsable: () => {
         MucCheckbox: import('vue').DefineComponent<{
             modelValue?: boolean;
         } & {
+            id: string;
             label: string;
         }, {}, {}, {}, {}, import('vue').ComponentOptionsMixin, import('vue').ComponentOptionsMixin, {
             "update:modelValue": (value: boolean) => any;
@@ -143,6 +148,7 @@ export declare const Collapsable: () => {
         }, string, import('vue').PublicProps, Readonly<{
             modelValue?: boolean;
         } & {
+            id: string;
             label: string;
         }> & Readonly<{
             onClick?: (() => any) | undefined;

package/components/Form/MucInput.stories.d.ts

@@ -3,6 +3,7 @@ declare const _default: {
         new (...args: any[]): import('vue').CreateComponentPublicInstanceWithMixins<Readonly<{
             modelValue?: string;
         } & {
+            id: string;
             errorMsg?: string;
             placeholder?: string;
             required?: boolean;
@@ -28,6 +29,7 @@ declare const _default: {
         }, Readonly<{
             modelValue?: string;
         } & {
+            id: string;
             errorMsg?: string;
             placeholder?: string;
             required?: boolean;
@@ -46,6 +48,7 @@ declare const _default: {
     } & import('vue').ComponentOptionsBase<Readonly<{
         modelValue?: string;
     } & {
+        id: string;
         errorMsg?: string;
         placeholder?: string;
         required?: boolean;
@@ -81,11 +84,13 @@ declare const _default: {
 export default _default;
 export declare const Default: {
     args: {
+        id: string;
         placeholder: string;
     };
 };
 export declare const HintAndLabel: {
     args: {
+        id: string;
         hint: string;
         label: string;
         placeholder: string;
@@ -93,6 +98,7 @@ export declare const HintAndLabel: {
 };
 export declare const Password: {
     args: {
+        id: string;
         type: string;
         modelValue: string;
         hint: string;
@@ -101,6 +107,7 @@ export declare const Password: {
 };
 export declare const Error: {
     args: {
+        id: string;
         errorMsg: string;
         hint: string;
         placeholder: string;
@@ -108,18 +115,21 @@ export declare const Error: {
 };
 export declare const Prefix: {
     args: {
+        id: string;
         prefix: string;
         placeholder: string;
     };
 };
 export declare const SuffixIcon: {
     args: {
+        id: string;
         suffixIcon: string;
         placeholder: string;
     };
 };
 export declare const Search: {
     args: {
+        id: string;
         type: string;
         dataList: string[];
         placeholder: string;
@@ -127,16 +137,19 @@ export declare const Search: {
 };
 export declare const Color: {
     args: {
+        id: string;
         type: string;
     };
 };
 export declare const Date: {
     args: {
+        id: string;
         type: string;
     };
 };
 export declare const Datetime_Local: {
     args: {
+        id: string;
         type: string;
     };
 };

package/components/Form/MucInput.vue.d.ts

@@ -3,6 +3,10 @@
  */
 type InputType = "text" | "password" | "color" | "search" | "date" | "datetime-local";
 type __VLS_Props = {
+    /**
+     *  Unique identifier for the input. Required property used to associate the input with its label and hint text for accessibility.
+     */
+    id: string;
     /**
      * Displays error message and highlights the input form with a red border.
      */

package/components/Form/MucRadioButton.stories.d.ts

@@ -1,10 +1,12 @@
 declare const _default: {
     component: import('vue').DefineComponent<{
+        id: string;
         value: string;
         label?: string;
         hint?: string;
         disabled?: boolean;
     }, {}, {}, {}, {}, import('vue').ComponentOptionsMixin, import('vue').ComponentOptionsMixin, {}, string, import('vue').PublicProps, Readonly<{
+        id: string;
         value: string;
         label?: string;
         hint?: string;
@@ -24,11 +26,13 @@ export default _default;
 export declare const Default: () => {
     components: {
         MucRadioButton: import('vue').DefineComponent<{
+            id: string;
             value: string;
             label?: string;
             hint?: string;
             disabled?: boolean;
         }, {}, {}, {}, {}, import('vue').ComponentOptionsMixin, import('vue').ComponentOptionsMixin, {}, string, import('vue').PublicProps, Readonly<{
+            id: string;
             value: string;
             label?: string;
             hint?: string;

package/components/Form/MucRadioButton.vue.d.ts

@@ -1,4 +1,8 @@
 type __VLS_Props = {
+    /**
+     *  Unique identifier for the radiobutton. Required property used to associate the radiobutton with its label and hint text for accessibility.
+     */
+    id: string;
     /**
      * value for this radiobutton
      */

package/components/Form/MucSelect.stories.d.ts

@@ -2,6 +2,7 @@ declare const _default: {
     component: import('vue').DefineComponent<{
         modelValue?: import('./MucSelectTypes').MucSelectItemTypes | import('./MucSelectTypes').MucSelectItemTypes[];
     } & {
+        id: string;
         items: import('./MucSelectTypes').MucSelectItemTypes[];
         label?: string;
         hint?: string;
@@ -13,6 +14,7 @@ declare const _default: {
     }, string, import('vue').PublicProps, Readonly<{
         modelValue?: import('./MucSelectTypes').MucSelectItemTypes | import('./MucSelectTypes').MucSelectItemTypes[];
     } & {
+        id: string;
         items: import('./MucSelectTypes').MucSelectItemTypes[];
         label?: string;
         hint?: string;
@@ -37,6 +39,7 @@ declare const _default: {
 export default _default;
 export declare const Default: {
     args: {
+        id: string;
         modelValue: {
             id: string;
             name: string;
@@ -54,6 +57,7 @@ export declare const Default: {
 };
 export declare const MultiSelect: {
     args: {
+        id: string;
         label: string;
         multiple: boolean;
         modelValue: {
@@ -72,6 +76,7 @@ export declare const MultiSelect: {
 };
 export declare const StringSelect: {
     args: {
+        id: string;
         modelValue: string;
         items: string[];
         label: string;

package/components/Form/MucSelect.vue.d.ts

@@ -1,5 +1,9 @@
 import { MucSelectItemTypes } from './MucSelectTypes';
 type __VLS_Props = {
+    /**
+     * Unique identifier for the select. Required property used to associate the select with its label and hint text for accessibility.
+     */
+    id: string;
     /**
      * List of items to be available
      */

package/components/Form/MucTextArea.stories.d.ts

@@ -2,6 +2,7 @@ declare const _default: {
     component: import('vue').DefineComponent<{
         modelValue?: string;
     } & {
+        id: string;
         errorMsg?: string;
         rows?: number;
         placeholder?: string;
@@ -13,6 +14,7 @@ declare const _default: {
     }, string, import('vue').PublicProps, Readonly<{
         modelValue?: string;
     } & {
+        id: string;
         errorMsg?: string;
         rows?: number;
         placeholder?: string;
@@ -35,17 +37,20 @@ declare const _default: {
 export default _default;
 export declare const Default: {
     args: {
+        id: string;
         placeholder: string;
     };
 };
 export declare const Error: {
     args: {
+        id: string;
         errorMsg: string;
         placeholder: string;
     };
 };
 export declare const Required: {
     args: {
+        id: string;
         required: boolean;
         placeholder: string;
         label: string;
@@ -53,6 +58,7 @@ export declare const Required: {
 };
 export declare const BigTextArea: {
     args: {
+        id: string;
         rows: number;
         label: string;
         hint: string;

package/components/Form/MucTextArea.vue.d.ts

@@ -1,4 +1,8 @@
 type __VLS_Props = {
+    /**
+     * Unique identifier for the textarea. Required property used  to associate the textarea with its label and hint text for accessibility.
+     */
+    id: string;
     /**
      * Displays error message and highlights the input form with a red border.
      */