@nmorph/nmorph-ui-kit 2.2.59 → 3.0.0

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

@@ -1,43 +1,99 @@
 import { CSSProperties } from 'vue';
-export declare enum NmorphComponentHeight {
-    thick = "thick-component",
-    basic = "basic-component",
-    thin = "thin-component"
-}
-export declare const NmorphSelectionControlHeight: {
+export declare const NmorphComponentThickness: {
+    readonly thick: "thick-component";
+    readonly basic: "basic-component";
+    readonly thin: "thin-component";
+};
+export type NmorphComponentThickness = keyof typeof NmorphComponentThickness;
+export declare const NmorphSelectionControlThickness: {
     readonly 'extra-thin': "extra-thin-component";
-    readonly thick: NmorphComponentHeight.thick;
-    readonly basic: NmorphComponentHeight.basic;
-    readonly thin: NmorphComponentHeight.thin;
-};
-export type NmorphSelectionControlHeightType = keyof typeof NmorphSelectionControlHeight;
-export declare enum NmorphComponentDirection {
-    row = "row",
-    column = "column"
-}
-export declare enum NmorphShadowType {
-    inset = "shadow-inset",
-    outset = "shadow-outset",
-    combined = "shadow-combined",
-    'not-defined' = "shadow-not-defined"
-}
-export declare enum NmorphColor {
-    accent = "accent",
-    success = "success",
-    error = "error",
-    warning = "warning"
-}
-export declare enum NmorphComponentPosition {
-    left = "left",
-    right = "right",
-    top = "top",
-    bottom = "bottom"
-}
+    readonly thick: "thick-component";
+    readonly basic: "basic-component";
+    readonly thin: "thin-component";
+};
+export type NmorphSelectionControlThicknessType = keyof typeof NmorphSelectionControlThickness;
+export type NmorphSelectionControlPlainThicknessType = NmorphSelectionControlThicknessType;
+export type NmorphSelectionControlNmorphThicknessType = NmorphComponentThickness;
+export declare const NmorphComponentDirection: {
+    readonly row: "row";
+    readonly column: "column";
+};
+export type NmorphComponentDirection = keyof typeof NmorphComponentDirection;
+export declare const NmorphShadowType: {
+    readonly inset: "shadow-inset";
+    readonly outset: "shadow-outset";
+    readonly combined: "shadow-combined";
+    readonly 'not-defined': "shadow-not-defined";
+};
+export type NmorphShadowType = keyof typeof NmorphShadowType;
+export declare const NmorphColor: {
+    readonly accent: "accent";
+    readonly success: "success";
+    readonly error: "error";
+    readonly warning: "warning";
+};
+export type NmorphColor = keyof typeof NmorphColor;
+export declare const NmorphComponentPosition: {
+    readonly left: "left";
+    readonly right: "right";
+    readonly top: "top";
+    readonly bottom: "bottom";
+};
+export type NmorphComponentPosition = keyof typeof NmorphComponentPosition;
 export type NmorphPlacementSideType = keyof typeof NmorphComponentPosition;
 export type NmorphPlacementAlignType = 'start' | 'center' | 'end';
 export type NmorphPlacementType = NmorphPlacementSideType | `${NmorphPlacementSideType}-${NmorphPlacementAlignType}`;
 export type NmorphDomElementType = HTMLElement | null;
-export type NmorphElementDesignType = 'nmorph' | 'common';
+export declare const NmorphElementDesign: {
+    readonly nmorph: "nmorph";
+    readonly plain: "plain";
+};
+export type NmorphElementDesignType = keyof typeof NmorphElementDesign;
+export declare const NmorphTypographyVariant: {
+    readonly 'display-large': "display-large";
+    readonly 'display-medium': "display-medium";
+    readonly 'title-large': "title-large";
+    readonly title: "title";
+    readonly 'title-small': "title-small";
+    readonly 'body-large': "body-large";
+    readonly body: "body";
+    readonly 'body-small': "body-small";
+    readonly caption: "caption";
+    readonly label: "label";
+    readonly 'control-large': "control-large";
+    readonly control: "control";
+    readonly 'control-small': "control-small";
+    readonly 'control-tiny': "control-tiny";
+};
+export type NmorphTypographyVariantType = keyof typeof NmorphTypographyVariant;
+export declare const NmorphTypographyWeight: {
+    readonly regular: "regular";
+    readonly medium: "medium";
+    readonly semibold: "semibold";
+    readonly bold: "bold";
+    readonly extrabold: "extrabold";
+};
+export type NmorphTypographyWeightType = keyof typeof NmorphTypographyWeight;
+export declare const NmorphTypographyColor: {
+    readonly text: "text";
+    readonly 'semi-contrast': "semi-contrast";
+    readonly placeholder: "placeholder";
+    readonly focus: "focus";
+    readonly accent: "accent";
+    readonly success: "success";
+    readonly warning: "warning";
+    readonly error: "error";
+    readonly white: "white";
+};
+export type NmorphTypographyColorType = keyof typeof NmorphTypographyColor;
+export declare const NmorphTextAlign: {
+    readonly left: "left";
+    readonly center: "center";
+    readonly right: "right";
+    readonly justify: "justify";
+    readonly inherit: "inherit";
+};
+export type NmorphTextAlignType = keyof typeof NmorphTextAlign;
 export interface INmorphCoords<T> {
     x: T;
     y: T;
@@ -56,7 +112,7 @@ export interface INmorphCommonInputProps {
     id?: string;
     name?: string;
     autocomplete?: string;
-    height?: keyof typeof NmorphComponentHeight;
+    thickness?: NmorphComponentThickness;
     disabled?: boolean;
     tabindex?: number;
 }

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

@@ -1,7 +1,8 @@
-export declare enum NmorphSelectionDateType {
-    'date' = "date",
-    'dates' = "dates",
-    'daterange' = "daterange"
-}
+export declare const NmorphSelectionDateType: {
+    readonly date: "date";
+    readonly dates: "dates";
+    readonly daterange: "daterange";
+};
+export type NmorphSelectionDateType = keyof typeof NmorphSelectionDateType;
 export type NmorphInnerPickerType = 'calendar' | 'year' | 'month';
 export type NmorphDatePickerControlsType = 'decrease' | 'increase';

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

@@ -1,17 +1,21 @@
-export declare enum AvatarShapeType {
-    circle = "circle",
-    square = "square"
-}
-export declare enum NmorphImageFit {
-    fill = "fill",
-    contain = "contain",
-    cover = "cover",
-    none = "none",
-    'scale-down' = "scale-down"
-}
+export declare const AvatarShapeType: {
+    readonly circle: "circle";
+    readonly square: "square";
+};
+export type AvatarShapeType = keyof typeof AvatarShapeType;
+export declare const NmorphImageFit: {
+    readonly fill: "fill";
+    readonly contain: "contain";
+    readonly cover: "cover";
+    readonly none: "none";
+    readonly 'scale-down': "scale-down";
+};
+export type NmorphImageFit = keyof typeof NmorphImageFit;
 export interface INmorphImage {
     src?: string;
     srcSet?: string;
-    fit?: keyof typeof NmorphImageFit;
+    width?: number | string;
+    height?: number | string;
+    fit?: NmorphImageFit;
     alt?: string;
 }

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

@@ -1,26 +1,31 @@
 import { Ref } from 'vue';
-import { NmorphSelectionControlHeightType } from './common.types';
-export interface INmorphCheckboxOption {
+import { NmorphSelectionControlNmorphThicknessType, NmorphSelectionControlPlainThicknessType } from './common.types';
+export type NmorphSelectionControlDesignProps = {
+    design: 'plain';
+    thickness?: NmorphSelectionControlPlainThicknessType;
+} | {
+    design?: 'nmorph';
+    thickness?: NmorphSelectionControlNmorphThicknessType;
+};
+type INmorphCheckboxOptionBase = {
     id?: string;
     disabled?: boolean;
     modelValue?: boolean;
     label?: string;
-    design?: NmorphCheckboxDesignType;
-    height?: NmorphSelectionControlHeightType;
-}
-export type NmorphCheckboxDesignType = 'button' | 'checkbox';
+};
+export type INmorphCheckboxOption = INmorphCheckboxOptionBase & NmorphSelectionControlDesignProps;
+export type INmorphCheckboxGroupOption = Omit<INmorphCheckboxOptionBase, 'modelValue'> & {
+    id: string;
+} & NmorphSelectionControlDesignProps;
 export type NmorphCheckboxGroupSelectedValueInjectionType = Ref<string[]>;
-export type NmorphCheckboxGroupChangeCheckboxValueHandlerInjectionType = (value: string, currentState: string[]) => void;
-export interface INmorphRadioOption {
+export type NmorphCheckboxGroupChangeCheckboxValueHandlerInjectionType = (value: string) => void;
+type INmorphRadioOptionBase = {
     disabled?: boolean;
     label?: string;
     value: string;
     tabindex?: number;
-    height?: NmorphSelectionControlHeightType;
-}
-export declare enum NmorphRadioStyleType {
-    'radio-style' = "radio-style",
-    'button' = "button"
-}
+};
+export type INmorphRadioOption = INmorphRadioOptionBase & NmorphSelectionControlDesignProps;
 export type NmorphRadioGroupSelectedValueInjectionType = Ref<string>;
 export type NmorphRadioChangeRadioButtonValueHandlerInjectionType = (value: string) => void;
+export {};

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

@@ -1,5 +1,6 @@
-export type NmorphSortOrderType = keyof typeof NmorphSortOrder | undefined;
-export declare enum NmorphSortOrder {
-    ascending = "ascending",
-    descending = "descending"
-}
+export type NmorphSortOrderType = NmorphSortOrder | undefined;
+export declare const NmorphSortOrder: {
+    readonly ascending: "ascending";
+    readonly descending: "descending";
+};
+export type NmorphSortOrder = keyof typeof NmorphSortOrder;

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

@@ -1,9 +1,10 @@
 import { I18n } from 'vue-i18n';
-export declare enum Locale {
-    en = "en",
-    ru = "ru",
-    zh = "zh"
-}
+export declare const Locale: {
+    readonly en: "en";
+    readonly ru: "ru";
+    readonly zh: "zh";
+};
+export type Locale = keyof typeof Locale;
 export type TranslateType = Partial<Record<keyof typeof Locale, TranslateMessages>> & {
     en: TranslateMessages;
 };
@@ -16,5 +17,5 @@ export interface LibraryOptions {
 export interface INmorphApplyTranslation {
     outsideMessagesMerge?: boolean;
     messages?: TranslateType;
-    locale?: keyof typeof Locale;
+    locale?: Locale;
 }

package/dist/src/utils/common.d.ts

@@ -4,8 +4,8 @@ export declare const toCssSize: (value?: number | string) => string;
 export type NmorphCssVariableValue = string | number | null | undefined | false;
 export declare const createCssVariables: (variables: Record<`--${string}`, NmorphCssVariableValue>) => Record<string, string | number>;
 export declare const createCssSizeVariables: (variables: Record<`--${string}`, number | string | null | undefined | false>) => Record<string, string | number>;
-type NmorphOptionHeightType = 'basic' | 'thick' | 'thin';
-export declare const getNmorphOptionHeight: (height?: NmorphOptionHeightType) => number;
+type NmorphOptionThicknessType = 'basic' | 'thick' | 'thin';
+export declare const getNmorphOptionHeight: (thickness?: NmorphOptionThicknessType) => number;
 export declare const resolveDomElement: (element: unknown) => Element | null;
 export declare const generateUUID: () => string;
 export {};

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" | "xls" | "xlsx" | "ppt" | "pptx" | "json" | "xml" | "mpeg" | "audio-ogg" | "wav" | "mp4" | "webm" | "video-ogg" | "wideo-ogg" | "jpeg" | "jpg" | "png" | "gif" | "svg-xml" | "webp";
+export declare const getKnownResolutionByMime: (mimeType: string) => "" | "zip" | "rar" | "7z" | "pdf" | "msword" | "docx" | "xls" | "xlsx" | "ppt" | "pptx" | "json" | "xml" | "mpeg" | "audio-ogg" | "wav" | "mp4" | "webm" | "video-ogg" | "jpeg" | "jpg" | "png" | "gif" | "svg-xml" | "webp";
 export declare const getTypeCandidates: (mimeType: string, fileName?: string) => string[];
 export declare const getFileTypeCandidates: (file: File) => string[];
 export declare const isKnownFileType: <T extends Record<string, string>>(fileType: string, fileTypeMap: T) => any;

package/dist/src/utils/theme-style.d.ts

@@ -1,3 +1,4 @@
+export declare const typography: (variant?: string) => string;
 export declare const body4: () => string;
 export declare const body3: () => string;
 export declare const body2: () => string;
@@ -10,6 +11,7 @@ export declare const nmorphOutset: () => string;
 export declare const nmorphInset: () => string;
 export declare const nmorphBorder: (borderWidth: number) => string;
 export declare const nmorphCombined: (borderWidth?: number, isInsetDark?: boolean) => string;
+export declare const nmorphPlainSurface: () => string;
 export declare const disabled: () => string;
 export declare const ellipsis: () => string;
 export declare const focusOutline: () => string;