@nmorph/nmorph-ui-kit 2.2.41 → 2.2.42

package/dist/src/components/form/nmorph-file-upload/NmorphFileUpload.vue.d.ts

@@ -12,12 +12,15 @@ declare const _default: __VLS_WithTemplateSlots< DefineComponent<INmorphFileUplo
     "onOn-unsupported-file-type-error"?: (val: string) => any;
     "onOn-file-validation-error"?: (val: INmorphFileUploadValidationError) => any;
 }>, {
-    disabled: boolean;
     modelValue: INmorphCustomFileData[];
+    disabled: boolean;
     allowedTypes: string[];
     multiple: boolean;
     photoWithPreview: boolean;
     buttonText: string;
+    compact: boolean;
+    layout: "list" | "grid" | "inline";
+    fileNameWidth: string | number;
 }, {}, {}, {}, string, ComponentProvideOptions, true, {
     inputDOMRef: HTMLInputElement;
 }, HTMLDivElement>, {

package/dist/src/components/form/nmorph-file-upload/types.d.ts

@@ -6,11 +6,15 @@ export declare enum NmorphImageResolution {
     'svg-xml' = "image/svg+xml",
     webp = "image/webp"
 }
-export declare enum NmorphVideoResolution {
-    mp4 = "video/mp4",
-    webm = "video/webm",
-    'wideo-ogg' = "video/ogg"
-}
+export declare const NmorphVideoResolution: {
+    readonly mp4: "video/mp4";
+    readonly webm: "video/webm";
+    readonly 'video-ogg': "video/ogg";
+    /**
+     * @deprecated Use `video-ogg` instead.
+     */
+    readonly 'wideo-ogg': "video/ogg";
+};
 export declare enum NmorphAudioResolution {
     mpeg = "audio/mpeg",
     'audio-ogg' = "audio/ogg",
@@ -44,9 +48,10 @@ export declare const resolution: {
     mpeg: NmorphAudioResolution.mpeg;
     'audio-ogg': (typeof NmorphAudioResolution)["audio-ogg"];
     wav: NmorphAudioResolution.wav;
-    mp4: NmorphVideoResolution.mp4;
-    webm: NmorphVideoResolution.webm;
-    'wideo-ogg': (typeof NmorphVideoResolution)["wideo-ogg"];
+    mp4: "video/mp4";
+    webm: "video/webm";
+    'video-ogg': "video/ogg";
+    'wideo-ogg': "video/ogg";
     jpeg: NmorphImageResolution.jpeg;
     jpg: NmorphImageResolution.jpg;
     png: NmorphImageResolution.png;
@@ -74,6 +79,9 @@ export interface INmorphFileUploadProps {
     allowedTypes?: Array<NmorphResolutionType | string>;
     photoWithPreview?: boolean;
     buttonText?: string;
+    compact?: boolean;
+    layout?: 'list' | 'grid' | 'inline';
+    fileNameWidth?: number | string;
 }
 export interface INmorphFileUploadEmit {
     (e: 'update:model-value', val: INmorphCustomFileData[]): void;

package/dist/src/components/form/nmorph-number-input/NmorphNumberInput.vue.d.ts

@@ -7,9 +7,9 @@ declare const _default: DefineComponent<INmorphNumberInputProps, {
 }, string, PublicProps, Readonly<INmorphNumberInputProps> & Readonly<{
     "onUpdate:model-value"?: (val: number) => any;
 }>, {
+    modelValue: number;
     height: "basic" | "thick" | "thin";
     disabled: boolean;
-    modelValue: number;
     max: number;
     min: number;
     step: number;

package/dist/src/components/form/nmorph-otp-input/NmorphOTPInput.vue.d.ts

@@ -16,9 +16,9 @@ declare const _default: DefineComponent<INmorphOTPInputProps, {
     onComplete?: (val: string) => any;
 }>, {
     length: number;
+    modelValue: string;
     height: "basic" | "thick" | "thin";
     disabled: boolean;
-    modelValue: string;
     mode: NmorphOtpInputMode;
     autofocus: boolean;
     autocapitalize: string;

package/dist/src/components/form/nmorph-radio-group/NmorphRadioGroup.vue.d.ts

@@ -6,9 +6,9 @@ declare const _default: __VLS_WithTemplateSlots< DefineComponent<INmorphRadioGro
     "onUpdate:model-value"?: (val: string) => any;
 }>, {
     styleType: "button" | "radio-style";
+    modelValue: string;
     height: "basic" | "thick" | "thin" | "extra-thin";
     disabled: boolean;
-    modelValue: string;
     direction: "row" | "column";
     options: NmorphListRadioOptionElementType[];
 }, {}, {}, {}, string, ComponentProvideOptions, true, {}, HTMLDivElement>, {

package/dist/src/components/form/nmorph-select/NmorphSelect.vue.d.ts

@@ -1,17 +1,18 @@
-import { NmorphSelectModelValueType, INmorphSelectOption } from '../..';
 import { INmorphSelectProps } from './types';
 import { DefineComponent, ComponentOptionsMixin, PublicProps, ComponentProvideOptions } from 'vue';
-declare const _default: __VLS_WithTemplateSlots< DefineComponent<INmorphSelectProps, {}, {}, {}, {}, ComponentOptionsMixin, ComponentOptionsMixin, {} & {
-    "update:model-value": (val: NmorphSelectModelValueType) => any;
-}, string, PublicProps, Readonly<INmorphSelectProps> & Readonly<{
-    "onUpdate:model-value"?: (val: NmorphSelectModelValueType) => any;
+import { NmorphSelectMultipleModelValueType, INmorphSelectOption } from '../..';
+type __VLS_Props = INmorphSelectProps;
+declare const _default: __VLS_WithTemplateSlots< DefineComponent<__VLS_Props, {}, {}, {}, {}, ComponentOptionsMixin, ComponentOptionsMixin, {} & {
+    "update:model-value": (val: string | NmorphSelectMultipleModelValueType) => any;
+}, string, PublicProps, Readonly<__VLS_Props> & Readonly<{
+    "onUpdate:model-value"?: (val: string | NmorphSelectMultipleModelValueType) => any;
 }>, {
     fill: boolean;
     loading: boolean;
+    modelValue: string | NmorphSelectMultipleModelValueType;
     height: "basic" | "thick" | "thin";
     disabled: boolean;
     width: string | number;
-    modelValue: NmorphSelectModelValueType;
     zIndex: number;
     open: boolean;
     virtual: boolean;
@@ -20,9 +21,11 @@ declare const _default: __VLS_WithTemplateSlots< DefineComponent<INmorphSelectPr
     options: INmorphSelectOption[];
     virtualItemHeight: number;
     virtualMaxHeight: string | number;
+    multiple: boolean;
     noElementPlaceholder: string;
     valueRequired: boolean;
     optionsMap: INmorphSelectOption[];
+    nullable: boolean;
     optionsWidth: "auto" | "truncate";
 }, {}, {}, {}, string, ComponentProvideOptions, true, {
     nmorphSelectDOMRef: HTMLDivElement;

package/dist/src/components/form/nmorph-select/types.d.ts

@@ -1,6 +1,9 @@
 import { INmorphCommonInputProps } from '../../../types';
 import { Ref } from 'vue';
-export type NmorphSelectModelValueType = string | string[];
+export type NmorphSelectSingleModelValueType = string;
+export type NmorphSelectMultipleModelValueType = string[];
+export type NmorphSelectEmptyValueType = '' | null;
+export type NmorphSelectModelValueType<TMultiple extends boolean = boolean> = TMultiple extends true ? NmorphSelectMultipleModelValueType : TMultiple extends false ? NmorphSelectSingleModelValueType | NmorphSelectEmptyValueType : NmorphSelectSingleModelValueType | NmorphSelectMultipleModelValueType | NmorphSelectEmptyValueType;
 export type NmorphSelectSelectedValueInjectionType = Ref<NmorphSelectModelValueType>;
 export type NmorphSelectChangeSelectedValue = (value: string) => void;
 export interface INmorphSelectOption extends INmorphCommonInputProps {
@@ -10,12 +13,14 @@ export interface INmorphSelectOption extends INmorphCommonInputProps {
     hoverBackground?: string;
     hoverColor?: string;
 }
-export interface INmorphSelectProps extends INmorphCommonInputProps {
+export interface INmorphSelectProps<TMultiple extends boolean = boolean> extends INmorphCommonInputProps {
     noElementPlaceholder?: string;
     valueRequired?: boolean;
     options?: INmorphSelectOption[];
     optionsMap?: INmorphSelectOption[];
-    modelValue?: NmorphSelectModelValueType;
+    modelValue?: NmorphSelectModelValueType<TMultiple>;
+    multiple?: TMultiple;
+    nullable?: boolean;
     loading?: boolean;
     open?: boolean;
     fill?: boolean;
@@ -28,6 +33,6 @@ export interface INmorphSelectProps extends INmorphCommonInputProps {
     virtualDynamicHeight?: boolean;
     width?: number | string;
 }
-export interface INmorphSelectEmit {
-    (e: 'update:model-value', val: NmorphSelectModelValueType): void;
+export interface INmorphSelectEmit<TMultiple extends boolean = boolean> {
+    (e: 'update:model-value', val: NmorphSelectModelValueType<TMultiple>): void;
 }

package/dist/src/components/form/nmorph-select-button/NmorphSelectButton.vue.d.ts

@@ -7,9 +7,9 @@ declare const _default: __VLS_WithTemplateSlots< DefineComponent<INmorphSelectBu
     "onUpdate:model-value"?: (val: string) => any;
 }>, {
     fill: boolean;
+    modelValue: string;
     height: "basic" | "thick" | "thin";
     disabled: boolean;
-    modelValue: string;
     options: INmorphSelectButtonOption[];
     trackPadding: string | number;
     itemSize: string | number;

package/dist/src/components/form/nmorph-slider/NmorphSlider.vue.d.ts

@@ -1,7 +1,7 @@
 import { INmorphSliderProps } from './types';
 import { DefineComponent, ComponentOptionsMixin, PublicProps, ComponentProvideOptions, ComponentInternalInstance, VNodeProps, AllowedComponentProps, ComponentCustomProps, Attrs, Slot, ComponentPublicInstance, ComponentOptionsBase, Ref, GlobalComponents, GlobalDirectives, DebuggerEvent, nextTick, WatchOptions, WatchStopHandle, ComponentCustomProperties } from 'vue';
 import { NmorphPlacementType, INmorphCoords } from '../../../types';
-import { INmorphTooltipProps } from '../../feedback/nmorph-tooltip/types';
+import { NmorphTooltipTrigger, NmorphTooltipTouchBehavior, INmorphTooltipProps, INmorphTooltipSlots } from '../../feedback/nmorph-tooltip/types';
 import { OnCleanup } from '@vue/reactivity';
 declare const _default: DefineComponent<INmorphSliderProps, {}, {}, {}, {}, ComponentOptionsMixin, ComponentOptionsMixin, {} & {
     "update:model-value": (val: number) => any;
@@ -9,12 +9,12 @@ declare const _default: DefineComponent<INmorphSliderProps, {}, {}, {}, {}, Comp
     "onUpdate:model-value"?: (val: number) => any;
 }>, {
     fill: boolean;
-    disabled: boolean;
     modelValue: number;
+    disabled: boolean;
     max: number;
-    showTooltip: boolean;
     min: number;
     step: number;
+    showTooltip: boolean;
     thumbWidth: number;
     sliderHeight: string | number;
     valueFixedContainerHeight: string | number;
@@ -26,22 +26,32 @@ declare const _default: DefineComponent<INmorphSliderProps, {}, {}, {}, {}, Comp
         $props: Partial<{
             text: string;
             height: string | number;
+            disabled: boolean;
             width: string | number;
             zIndex: number;
+            openDelay: number;
+            closeDelay: number;
             position: NmorphPlacementType;
             forceShow: boolean;
             forceCoordinate: Partial< INmorphCoords<string>>;
+            trigger: NmorphTooltipTrigger;
+            touch: NmorphTooltipTouchBehavior;
             maxWidth: string | number;
         }> & Omit<{
             readonly text?: string;
             readonly position?: NmorphPlacementType;
             readonly forceShow?: boolean;
             readonly forceCoordinate?: Partial< INmorphCoords<string>>;
+            readonly disabled?: boolean;
+            readonly trigger?: NmorphTooltipTrigger;
+            readonly touch?: NmorphTooltipTouchBehavior;
+            readonly openDelay?: number;
+            readonly closeDelay?: number;
             readonly zIndex?: number;
             readonly width?: string | number;
             readonly maxWidth?: string | number;
             readonly height?: string | number;
-        } & VNodeProps & AllowedComponentProps & ComponentCustomProps, "text" | "height" | "width" | "zIndex" | "position" | "forceShow" | "forceCoordinate" | "maxWidth">;
+        } & VNodeProps & AllowedComponentProps & ComponentCustomProps, "text" | "height" | "disabled" | "width" | "zIndex" | "openDelay" | "closeDelay" | "position" | "forceShow" | "forceCoordinate" | "trigger" | "touch" | "maxWidth">;
         $attrs: Attrs;
         $refs: {
             [x: string]: unknown;
@@ -60,14 +70,22 @@ declare const _default: DefineComponent<INmorphSliderProps, {}, {}, {}, {}, Comp
         $el: HTMLDivElement;
         $options: ComponentOptionsBase<Readonly< INmorphTooltipProps> & Readonly<{}>, {
             tooltipBody: Ref<HTMLElement, HTMLElement>;
+            open: () => void;
+            close: () => void;
+            toggle: () => void;
         }, {}, {}, {}, ComponentOptionsMixin, ComponentOptionsMixin, {}, string, {
             text: string;
             height: string | number;
+            disabled: boolean;
             width: string | number;
             zIndex: number;
+            openDelay: number;
+            closeDelay: number;
             position: NmorphPlacementType;
             forceShow: boolean;
             forceCoordinate: Partial< INmorphCoords<string>>;
+            trigger: NmorphTooltipTrigger;
+            touch: NmorphTooltipTouchBehavior;
             maxWidth: string | number;
         }, {}, string, {}, GlobalComponents, GlobalDirectives, string, ComponentProvideOptions> & {
             beforeCreate?: (() => void) | (() => void)[];
@@ -92,19 +110,24 @@ declare const _default: DefineComponent<INmorphSliderProps, {}, {}, {}, {}, Comp
     } & Readonly<{
         text: string;
         height: string | number;
+        disabled: boolean;
         width: string | number;
         zIndex: number;
+        openDelay: number;
+        closeDelay: number;
         position: NmorphPlacementType;
         forceShow: boolean;
         forceCoordinate: Partial< INmorphCoords<string>>;
+        trigger: NmorphTooltipTrigger;
+        touch: NmorphTooltipTouchBehavior;
         maxWidth: string | number;
-    }> & Omit<Readonly< INmorphTooltipProps> & Readonly<{}>, "tooltipBody" | ("text" | "height" | "width" | "zIndex" | "position" | "forceShow" | "forceCoordinate" | "maxWidth")> & {
+    }> & Omit<Readonly< INmorphTooltipProps> & Readonly<{}>, "toggle" | "close" | "open" | "tooltipBody" | ("text" | "height" | "disabled" | "width" | "zIndex" | "openDelay" | "closeDelay" | "position" | "forceShow" | "forceCoordinate" | "trigger" | "touch" | "maxWidth")> & {
         tooltipBody: HTMLElement;
+        open: () => void;
+        close: () => void;
+        toggle: () => void;
     } & {} & ComponentCustomProperties & {} & {
-        $slots: {
-            default?(_: {}): any;
-            content?(_: {}): any;
-        };
+        $slots: Readonly< INmorphTooltipSlots> & INmorphTooltipSlots;
     };
     sliderFirst: HTMLDivElement;
 }, HTMLDivElement>;

package/dist/src/components/form/nmorph-switch/NmorphSwitch.vue.d.ts

@@ -8,10 +8,10 @@ declare const _default: __VLS_WithTemplateSlots< DefineComponent<INmorphSwitchPr
     "onUpdate:model-value"?: (val: string | number | boolean) => any;
 }>, {
     loading: boolean;
+    modelValue: NmorphSwitchModelType;
     height: string | number;
     disabled: boolean;
     width: string | number;
-    modelValue: NmorphSwitchModelType;
     activeValue: NmorphSwitchModelType;
     inactiveValue: NmorphSwitchModelType;
     offset: string | number;

package/dist/src/components/form/nmorph-text-input/NmorphTextInput.vue.d.ts

@@ -18,10 +18,10 @@ declare const _default: __VLS_WithTemplateSlots< DefineComponent<INmorphTextInpu
     onKeydown?: (event: KeyboardEvent) => any;
     "onOn-enter"?: () => any;
 }>, {
+    modelValue: string;
     height: "basic" | "thick" | "thin";
     disabled: boolean;
     placeholder: string;
-    modelValue: string;
     clearable: boolean;
     typePassword: boolean;
     indentation: string;

package/dist/src/components/form/nmorph-textarea/NmorphTextarea.vue.d.ts

@@ -19,11 +19,11 @@ declare const _default: DefineComponent<INmorphTextareaProps, {
     onKeydown?: (event: KeyboardEvent) => any;
     "onOn-enter"?: () => any;
 }>, {
+    modelValue: string;
     height: "basic" | "thick" | "thin";
     disabled: boolean;
     resize: NmorphTextareaResizeType;
     placeholder: string;
-    modelValue: string;
     rows: number;
     indentation: string;
     minRows: number;

package/dist/src/components/form/nmorph-time-picker/NmorphTimePicker.vue.d.ts

@@ -11,11 +11,11 @@ declare const _default: DefineComponent<INmorphTimePickerProps, {
     onBlur?: () => any;
     onFocus?: () => any;
 }>, {
+    modelValue: string;
     height: "basic" | "thick" | "thin";
     disabled: boolean;
     width: string | number;
     placeholder: string;
-    modelValue: string;
     zIndex: number;
     clearable: boolean;
     hourStep: number;

package/dist/src/components/navigation/nmorph-context-menu/NmorphContextMenu.vue.d.ts

@@ -1,5 +1,6 @@
-import { INmorphContextMenuProps, NmorphContextMenuOpenEvent, NmorphContextMenuOption, NmorphContextMenuTrigger } from './types';
+import { INmorphContextMenuProps, INmorphContextMenuSlots, NmorphContextMenuOpenEvent } from './types';
 import { DefineComponent, ComponentOptionsMixin, PublicProps, ComponentProvideOptions } from 'vue';
+import { NmorphContextMenuOption, NmorphContextMenuTrigger, NmorphContextMenuMobileMode } from '../..';
 import { NmorphPlacementType } from '../../../types';
 declare const _default: __VLS_WithTemplateSlots< DefineComponent<INmorphContextMenuProps, {
     openAt: (x: number, y: number, event?: NmorphContextMenuOpenEvent) => void;
@@ -20,9 +21,9 @@ declare const _default: __VLS_WithTemplateSlots< DefineComponent<INmorphContextM
     "onOn-escape-keydown"?: () => any;
     onOpen?: (event?: NmorphContextMenuOpenEvent) => any;
 }>, {
+    modelValue: boolean;
     disabled: boolean;
     width: string | number;
-    modelValue: boolean;
     minWidth: string | number;
     zIndex: number;
     closeOnEscape: boolean;
@@ -33,19 +34,15 @@ declare const _default: __VLS_WithTemplateSlots< DefineComponent<INmorphContextM
     placement: NmorphPlacementType;
     yOffset: number;
     xOffset: number;
+    trigger: NmorphContextMenuTrigger;
     maxWidth: string | number;
     fillWidth: boolean;
     hideShadow: boolean;
-    trigger: NmorphContextMenuTrigger;
     closeOnScroll: boolean;
+    mobileMode: NmorphContextMenuMobileMode;
 }, {}, {}, {}, string, ComponentProvideOptions, true, {
     triggerDOMRef: HTMLDivElement;
-}, HTMLDivElement>, {
-    default?(_: {}): any;
-    menu?(_: {
-        close: () => void;
-    }): any;
-}>;
+}, HTMLDivElement>, Readonly<INmorphContextMenuSlots> & INmorphContextMenuSlots>;
 export default _default;
 type __VLS_WithTemplateSlots<T, S> = T & {
     new (): {

package/dist/src/components/navigation/nmorph-context-menu/types.d.ts

@@ -1,9 +1,16 @@
 import { NmorphPlacementType } from '../../../types';
 import { Component } from 'vue';
 export type NmorphContextMenuOptionPrimitive = string | number;
+export type NmorphContextMenuOptionType = 'item' | 'divider' | 'section';
+export type NmorphContextMenuMobileMode = 'dropdown' | 'bottom-sheet';
 export interface INmorphContextMenuOption {
+    type?: NmorphContextMenuOptionType;
     label?: string | number;
     value?: unknown;
+    icon?: Component;
+    iconProps?: Record<string, unknown>;
+    shortcut?: string;
+    description?: string;
     component?: Component;
     componentProps?: Record<string, unknown>;
     disabled?: boolean;
@@ -16,8 +23,13 @@ export type NmorphContextMenuAnchorType = 'point' | 'element';
 export type NmorphContextMenuOpenEvent = MouseEvent | KeyboardEvent | PointerEvent | Event;
 export interface INmorphNormalizedContextMenuOption {
     key: string;
+    type: NmorphContextMenuOptionType;
     label?: string | number;
     value: unknown;
+    icon?: Component;
+    iconProps?: Record<string, unknown>;
+    shortcut?: string;
+    description?: string;
     component?: Component;
     componentProps?: Record<string, unknown>;
     disabled: boolean;
@@ -44,6 +56,7 @@ export interface INmorphContextMenuProps {
     role?: string;
     ariaLabel?: string;
     hideShadow?: boolean;
+    mobileMode?: NmorphContextMenuMobileMode;
 }
 export interface INmorphContextMenuEmit {
     (e: 'update:model-value', value: boolean): void;
@@ -58,3 +71,14 @@ export interface INmorphContextMenuExpose {
     openAtElement: (element: HTMLElement, event?: NmorphContextMenuOpenEvent) => void;
     close: () => void;
 }
+export interface INmorphContextMenuSlots {
+    default?: (props: Record<string, never>) => unknown;
+    menu?: (props: {
+        close: () => void;
+    }) => unknown;
+    item?: (props: {
+        option: INmorphNormalizedContextMenuOption;
+        active: boolean;
+        disabled: boolean;
+    }) => unknown;
+}

package/dist/src/components/navigation/nmorph-dropdown/NmorphDropdown.vue.d.ts

@@ -14,8 +14,8 @@ declare const _default: __VLS_WithTemplateSlots< DefineComponent<INmorphDropdown
     closeOnEscape: boolean;
     trapFocus: boolean;
     restoreFocus: boolean;
-    contentClass: string;
     role: string;
+    contentClass: string;
     ariaLabel: string;
     placement: NmorphPlacementType;
     yOffset: number;

package/dist/src/types/app.types.d.ts

@@ -9,9 +9,14 @@ export interface INmorphInstance {
     browser: ReturnType<typeof useNmorphBrowser>;
     zIndex: ReturnType<typeof useNmorphZIndex>;
 }
-export interface INmorphFromDataExpose {
+export interface INmorphFormDataExpose {
     formData: NmorphFormValidationDataType;
 }
+/**
+ * @deprecated Use `INmorphFormDataExpose` instead.
+ */
+export interface INmorphFromDataExpose extends INmorphFormDataExpose {
+}
 export interface INmorphOptions {
     theme?: INmorphThemeOptions;
     i18n?: INmorphApplyTranslation;

package/dist/src/utils/file-types.d.ts

@@ -1,7 +1,7 @@
 import { NmorphResolutionType } from '../components/form/nmorph-file-upload/types';
 export declare const getPlainFileType: (mimeType: string) => string;
 export declare const getFileExtension: (fileName: string) => string;
-export declare const getKnownResolutionByMime: (mimeType: string) => "" | "zip" | "rar" | "7z" | "pdf" | "msword" | "docx" | "xlsx" | "pptx" | "json" | "xml" | "mpeg" | "audio-ogg" | "wav" | "mp4" | "webm" | "wideo-ogg" | "jpeg" | "jpg" | "png" | "gif" | "svg-xml" | "webp";
+export declare const getKnownResolutionByMime: (mimeType: string) => "" | "zip" | "rar" | "7z" | "pdf" | "msword" | "docx" | "xlsx" | "pptx" | "json" | "xml" | "mpeg" | "audio-ogg" | "wav" | "mp4" | "webm" | "video-ogg" | "wideo-ogg" | "jpeg" | "jpg" | "png" | "gif" | "svg-xml" | "webp";
 export declare const getFileTypeCandidates: (file: File) => string[];
 export declare const isKnownFileType: <T extends Record<string, string>>(fileType: string, fileTypeMap: T) => any;
 export declare const isFileAllowedByTypes: (file: File, allowedTypes: Array<NmorphResolutionType | string>) => boolean;