@max-ts/components 0.1.1 → 0.2.1

package/lib/components/DataGridActionCell/useLogic/useLogic.mjs

@@ -0,0 +1,49 @@
+import { useContext as s, useEffect as l, useCallback as d } from "react";
+import "../../../_virtual/jsx-runtime.mjs";
+import "../../ConfigProvider/ConfigProvider.mjs";
+import "clsx";
+import "../../Button/styles.mjs";
+import "@mui/material";
+import "../../ErrorBoundary/ErrorBoundary.mjs";
+import "../../Placeholder/Image/Image.mjs";
+import "../../Placeholder/styles.mjs";
+import "../../Typography/styles.mjs";
+import "../../ContentState/styles.mjs";
+import "../../Checkbox/Checkbox.mjs";
+import "../../Tooltip/styles.mjs";
+import "../../DataGrid/Row/NestedChildren/NestedChildren.mjs";
+import "../../DataGrid/Row/styles.mjs";
+import "../../DataGrid/DataGridContext/DataGridContext.mjs";
+import { RowContext as f } from "../../DataGrid/Row/RowContext/RowContext.mjs";
+import "../../DataGrid/Body/styles.mjs";
+import "lucide-react";
+import "../../DataGrid/HeadCell/styles.mjs";
+import "../../DataGrid/Head/styles.mjs";
+import "../../DataGrid/Loader/styles.mjs";
+import "../../DataGrid/styles.mjs";
+import "remeda";
+const H = ({
+  row: i,
+  actions: r
+}) => {
+  const { main: p, secondary: m } = r, { addDisabledRow: n, removeDisabledRow: e } = s(f), t = [...p, ...m || []].find(
+    (o) => o.isBlockingOperation && o.loading
+  ), a = !!t;
+  l(() => {
+    if (t)
+      return n(t?.loadingNote);
+    e();
+  }, [t]);
+  const c = d(
+    (o) => () => {
+      o?.(i);
+    },
+    [i]
+  );
+  return { isDisabledAction: a, handleActionClick: c, handleWrapperClick: (o) => {
+    o.stopPropagation();
+  } };
+};
+export {
+  H as useLogic
+};

package/lib/components/DataGridOld/Body/Body.d.ts

@@ -0,0 +1,13 @@
+import { DataGridColumn } from '../types';
+export type BodyProps<TRow> = {
+    noDataText?: string;
+    noDataImgSrc?: string;
+    isLoading?: boolean;
+    isEmpty?: boolean;
+    columns: DataGridColumn<TRow>[];
+    rows: TRow[];
+    rowHeight: number;
+    keyId: keyof TRow;
+    onRowClick?: (row: TRow) => void;
+};
+export declare function Body<TRow>({ isEmpty, isLoading, noDataText, noDataImgSrc, columns, rows, rowHeight, keyId, onRowClick, }: BodyProps<TRow>): import("react/jsx-runtime").JSX.Element;

package/lib/components/DataGridOld/Body/styles.d.ts

@@ -0,0 +1 @@
+export declare const StyledBody: import('@emotion/styled').StyledComponent<import('@mui/system').MUIStyledCommonProps<import('@mui/material').Theme>, Pick<import('react').DetailedHTMLProps<import('react').HTMLAttributes<HTMLUListElement>, HTMLUListElement>, keyof import('react').ClassAttributes<HTMLUListElement> | keyof import('react').HTMLAttributes<HTMLUListElement>>, {}>;

package/lib/components/DataGridOld/Cell/Cell.d.ts

@@ -0,0 +1,7 @@
+import { DataGridColumn } from '../types';
+export type CellProps<TRow> = {
+    row: TRow;
+    column: DataGridColumn<TRow>;
+    rowIndex: number;
+};
+export declare function Cell<TRow>({ row, column, rowIndex }: CellProps<TRow>): import("react/jsx-runtime").JSX.Element;

package/lib/components/DataGridOld/Cell/styles.d.ts

@@ -0,0 +1,4 @@
+export declare const StyledCell: import('@emotion/styled').StyledComponent<import('@mui/system').MUIStyledCommonProps<import('@mui/material').Theme> & {
+    $align?: "left" | "center" | "right" | "justify";
+    $disabled?: boolean;
+}, Pick<import('react').DetailedHTMLProps<import('react').HTMLAttributes<HTMLDivElement>, HTMLDivElement>, keyof import('react').HTMLAttributes<HTMLDivElement> | keyof import('react').ClassAttributes<HTMLDivElement>>, {}>;

package/lib/components/DataGridOld/DataGridOld.d.ts

@@ -0,0 +1,20 @@
+import { CSSProperties, ReactNode } from 'react';
+import { DataGridColumn } from './types';
+export type DataGridProps<TRow> = {
+    rows: TRow[];
+    columns: DataGridColumn<TRow>[];
+    className?: string;
+    height?: CSSProperties['height'];
+    noDataText?: string;
+    noDataImgSrc?: string;
+    rowHeight?: number;
+    keyId: keyof TRow;
+    isLoading?: boolean;
+    isDisabled?: boolean;
+    isEmpty?: boolean;
+    onSelectRow?: (row: TRow[]) => void;
+    onRowClick?: (row: TRow) => void;
+    minDisplayRows?: number;
+    footer?: ReactNode;
+};
+export declare function DataGrid<TRow>({ rows, columns, height, className, noDataText, rowHeight, keyId, onRowClick, isLoading, isDisabled, isEmpty, noDataImgSrc, footer, }: DataGridProps<TRow>): import("react/jsx-runtime").JSX.Element;

package/lib/components/DataGridOld/Head/Head.d.ts

@@ -0,0 +1,7 @@
+import { DataGridColumn } from '../types';
+type DataGridHeaderProps<TRow> = {
+    columns: DataGridColumn<TRow>[];
+    height: number;
+};
+export declare function Head<TRow>({ columns, height }: DataGridHeaderProps<TRow>): import("react/jsx-runtime").JSX.Element;
+export {};

package/lib/components/DataGridOld/Head/styles.d.ts

@@ -0,0 +1,4 @@
+export declare const StyledHead: import('@emotion/styled').StyledComponent<import('@mui/system').MUIStyledCommonProps<import('@mui/material').Theme> & {
+    $height: number;
+    $gridTemplateColumns: string;
+}, Pick<import('react').DetailedHTMLProps<import('react').HTMLAttributes<HTMLElement>, HTMLElement>, keyof import('react').HTMLAttributes<HTMLElement> | keyof import('react').ClassAttributes<HTMLElement>>, {}>;

package/lib/components/DataGridOld/HeadCell/HeadCell.d.ts

@@ -0,0 +1,5 @@
+import { DataGridColumn } from '../types';
+export type HeadCellProps<T> = {
+    column: DataGridColumn<T>;
+};
+export declare function HeadCell<TData>({ column }: HeadCellProps<TData>): import("react/jsx-runtime").JSX.Element;

package/lib/components/DataGridOld/HeadCell/styles.d.ts

@@ -0,0 +1,3 @@
+export declare const StyledHeadCell: import('@emotion/styled').StyledComponent<import('@mui/system').MUIStyledCommonProps<import('@mui/material').Theme> & {
+    $align?: "left" | "center" | "right" | "justify";
+}, Pick<import('react').DetailedHTMLProps<import('react').HTMLAttributes<HTMLDivElement>, HTMLDivElement>, keyof import('react').HTMLAttributes<HTMLDivElement> | keyof import('react').ClassAttributes<HTMLDivElement>>, {}>;

package/lib/components/DataGridOld/Row/Row.d.ts

@@ -0,0 +1,11 @@
+import { DataGridColumn } from '../types';
+type RowProps<TRow> = {
+    row: TRow;
+    columns: DataGridColumn<TRow>[];
+    rowIndex: number;
+    rowId: string;
+    rowHeight: number;
+    onRowClick?: (row: TRow) => void;
+};
+export declare function Row<TRow>({ row, rowHeight, onRowClick, columns, rowIndex, rowId, }: RowProps<TRow>): import("react/jsx-runtime").JSX.Element;
+export {};

package/lib/components/DataGridOld/Row/styles.d.ts

@@ -0,0 +1,5 @@
+export declare const StyledRow: import('@emotion/styled').StyledComponent<import('@mui/system').MUIStyledCommonProps<import('@mui/material').Theme> & {
+    $height: number;
+    $gridTemplateColumns: string;
+    $selectable: boolean;
+}, Pick<import('react').DetailedHTMLProps<import('react').LiHTMLAttributes<HTMLLIElement>, HTMLLIElement>, keyof import('react').ClassAttributes<HTMLLIElement> | keyof import('react').LiHTMLAttributes<HTMLLIElement>>, {}>;

package/lib/components/DataGridOld/State/styles.d.ts

@@ -0,0 +1 @@
+export declare const Container: import('@emotion/styled').StyledComponent<import('@mui/system').MUIStyledCommonProps<import('@mui/material').Theme>, import('react').DetailedHTMLProps<import('react').HTMLAttributes<HTMLDivElement>, HTMLDivElement>, {}>;

package/lib/components/DataGridOld/styles.d.ts

@@ -0,0 +1,7 @@
+import { CSSProperties } from 'react';
+export declare const Container: import('@emotion/styled').StyledComponent<import('@mui/system').MUIStyledCommonProps<import('@mui/material').Theme> & {
+    $height: CSSProperties["height"];
+}, import('react').DetailedHTMLProps<import('react').HTMLAttributes<HTMLDivElement>, HTMLDivElement>, {}>;
+export declare const Wrapper: import('@emotion/styled').StyledComponent<import('@mui/system').MUIStyledCommonProps<import('@mui/material').Theme> & {
+    $disabled?: boolean;
+}, import('react').DetailedHTMLProps<import('react').HTMLAttributes<HTMLDivElement>, HTMLDivElement>, {}>;

package/lib/components/DataGridOld/types.d.ts

@@ -0,0 +1,15 @@
+import { ReactNode } from 'react';
+export type DataGridColumn<TRow> = {
+    title: string;
+    key?: keyof TRow;
+    width?: number | string;
+    align?: 'left' | 'center' | 'right' | 'justify';
+    isDisabled?: boolean;
+    headComponent?: ReactNode;
+    component?: (row: TRow, index: number) => ReactNode;
+    getCellValue?: (row: TRow) => string | number | null | undefined;
+    cellClassName?: (row: TRow) => string;
+    cellColor?: (row: TRow) => string;
+};
+export type DataGridColumns<TRow> = DataGridColumn<TRow>[];
+export type AlignVariant = 'left' | 'center' | 'right' | 'justify';

package/lib/components/DataGridPagination/DataGridPagination.d.ts

@@ -0,0 +1,25 @@
+import { PaginationProps } from '../Pagination';
+export type DataGridPaginationProps = Omit<PaginationProps, 'count'> & {
+    /**
+     * Количество всех записей
+     */
+    totalCount: number;
+    /**
+     * Текущая страница
+     */
+    page: number;
+    /**
+     * Максимальное количество записей на страницу
+     */
+    rowsPerPage?: number;
+    /**
+     * Конфигурация списка кол-ва элементов, отображаемых на одной странице
+     */
+    rowsPerPageOptions?: number[];
+    isForceCounter?: boolean;
+    /**
+     * Коллбэк для установки количества отображаемых элементов на странице
+     */
+    onSetCountPerPage?: (rowsPerPage: number) => void;
+};
+export declare const DataGridPagination: (props: DataGridPaginationProps) => import("react/jsx-runtime").JSX.Element | null;

package/lib/components/DataGridPagination/DataGridPagination.mjs

@@ -0,0 +1,57 @@
+import { j as e } from "../../_virtual/jsx-runtime.mjs";
+import { MenuItem as h } from "../MenuItem/MenuItem.mjs";
+import { Pagination as f } from "../Pagination/Pagination.mjs";
+import { Select as x } from "../Select/Select.mjs";
+import { Typography as j } from "../Typography/Typography.mjs";
+import { DEFAULT_ROWS_PER_PAGE as R, DEFAULT_ROWS_PER_PAGE_OPTION as C } from "./constants.mjs";
+import { PaginationWrapper as E, RangeWrapper as _, Range as O } from "./styles.mjs";
+import { useLogic as S } from "./useLogic/useLogic.mjs";
+const D = (a) => {
+  const {
+    isVisiblePagination: o,
+    pageCount: t,
+    formattedRange: i,
+    handleChangeRowsPerPage: s
+  } = S(a), {
+    page: m,
+    totalCount: l,
+    className: g,
+    rowsPerPage: P = R,
+    rowsPerPageOptions: p = C,
+    isForceCounter: c,
+    disabled: n,
+    onSetCountPerPage: u,
+    ...d
+  } = a;
+  return !o && !c || !l ? null : /* @__PURE__ */ e.jsxs(E, { className: g, children: [
+    /* @__PURE__ */ e.jsxs(_, { children: [
+      u && /* @__PURE__ */ e.jsxs(e.Fragment, { children: [
+        /* @__PURE__ */ e.jsx(j, { variant: "body1", children: "Строк на странице:" }),
+        /* @__PURE__ */ e.jsx(
+          x,
+          {
+            size: "small",
+            value: P,
+            disabled: n,
+            isShowClearButton: !1,
+            onChange: s,
+            children: p.map((r) => /* @__PURE__ */ e.jsx(h, { value: r, children: r }, r))
+          }
+        )
+      ] }),
+      /* @__PURE__ */ e.jsx(O, { variant: "h6", children: i() })
+    ] }),
+    o && /* @__PURE__ */ e.jsx(
+      f,
+      {
+        disabled: n,
+        count: t,
+        page: m,
+        ...d
+      }
+    )
+  ] });
+};
+export {
+  D as DataGridPagination
+};

package/lib/components/DataGridPagination/constants.mjs

@@ -0,0 +1,5 @@
+const _ = 20, E = [20, 50, 100];
+export {
+  _ as DEFAULT_ROWS_PER_PAGE,
+  E as DEFAULT_ROWS_PER_PAGE_OPTION
+};

package/lib/components/DataGridPagination/faker.d.ts

@@ -0,0 +1,3 @@
+import { CellValue, DataGridRowOptions, DataGridRowWithOptions } from '../DataGrid';
+export declare const makeRandomDate: () => string;
+export declare const makeDataList: <TData extends Record<string, CellValue>>(dataObjTemplate: TData, options?: DataGridRowOptions<TData>) => DataGridRowWithOptions<TData>[];

package/lib/components/DataGridPagination/styles.d.ts

@@ -0,0 +1,16 @@
+export declare const PaginationWrapper: import('@emotion/styled').StyledComponent<import('@mui/system').MUIStyledCommonProps<import('@mui/material').Theme>, import('react').DetailedHTMLProps<import('react').HTMLAttributes<HTMLDivElement>, HTMLDivElement>, {}>;
+export declare const Range: import('@emotion/styled').StyledComponent<{
+    ref?: import('react').Ref<HTMLSpanElement> | undefined;
+    children?: import('react').ReactNode;
+    align?: "inherit" | "left" | "center" | "right" | "justify" | undefined;
+    gutterBottom?: boolean | undefined;
+    noWrap?: boolean | undefined;
+    paragraph?: boolean | undefined;
+} & {
+    color?: import('../Typography').TypographyColor;
+    variant?: import('../Typography').TypographyVariant;
+    colorIntensity?: import('../Typography').Intensity;
+    component?: "symbol" | "object" | "style" | "clipPath" | "filter" | "mask" | "path" | import('react').ComponentType<any> | "map" | "search" | "big" | "link" | "small" | "sub" | "sup" | "marker" | "svg" | "a" | "abbr" | "address" | "area" | "article" | "aside" | "audio" | "b" | "base" | "bdi" | "bdo" | "blockquote" | "body" | "br" | "button" | "canvas" | "caption" | "center" | "cite" | "code" | "col" | "colgroup" | "data" | "datalist" | "dd" | "del" | "details" | "dfn" | "dialog" | "div" | "dl" | "dt" | "em" | "embed" | "fieldset" | "figcaption" | "figure" | "footer" | "form" | "h1" | "h2" | "h3" | "h4" | "h5" | "h6" | "head" | "header" | "hgroup" | "hr" | "html" | "i" | "iframe" | "img" | "input" | "ins" | "kbd" | "keygen" | "label" | "legend" | "li" | "main" | "mark" | "menu" | "menuitem" | "meta" | "meter" | "nav" | "noindex" | "noscript" | "ol" | "optgroup" | "option" | "output" | "p" | "param" | "picture" | "pre" | "progress" | "q" | "rp" | "rt" | "ruby" | "s" | "samp" | "slot" | "script" | "section" | "select" | "source" | "span" | "strong" | "summary" | "table" | "template" | "tbody" | "td" | "textarea" | "tfoot" | "th" | "thead" | "time" | "title" | "tr" | "track" | "u" | "ul" | "var" | "video" | "wbr" | "webview" | "animate" | "animateMotion" | "animateTransform" | "circle" | "defs" | "desc" | "ellipse" | "feBlend" | "feColorMatrix" | "feComponentTransfer" | "feComposite" | "feConvolveMatrix" | "feDiffuseLighting" | "feDisplacementMap" | "feDistantLight" | "feDropShadow" | "feFlood" | "feFuncA" | "feFuncB" | "feFuncG" | "feFuncR" | "feGaussianBlur" | "feImage" | "feMerge" | "feMergeNode" | "feMorphology" | "feOffset" | "fePointLight" | "feSpecularLighting" | "feSpotLight" | "feTile" | "feTurbulence" | "foreignObject" | "g" | "image" | "line" | "linearGradient" | "metadata" | "mpath" | "pattern" | "polygon" | "polyline" | "radialGradient" | "rect" | "set" | "stop" | "switch" | "text" | "textPath" | "tspan" | "use" | "view";
+    isUpperCase?: boolean;
+} & import('react').HTMLAttributes<HTMLParagraphElement> & import('@mui/system').MUIStyledCommonProps<import('@mui/material').Theme>, {}, {}>;
+export declare const RangeWrapper: import('@emotion/styled').StyledComponent<import('@mui/system').MUIStyledCommonProps<import('@mui/material').Theme>, import('react').DetailedHTMLProps<import('react').HTMLAttributes<HTMLDivElement>, HTMLDivElement>, {}>;

package/lib/components/DataGridPagination/styles.mjs

@@ -0,0 +1,25 @@
+import { styled as t, formControlClasses as n } from "@mui/material";
+import { Typography as o } from "../Typography/Typography.mjs";
+const a = t("div")`
+  display: flex;
+  align-items: center;
+  justify-content: space-between;
+
+  height: 48px;
+  padding-top: ${({ theme: e }) => e.spacing(4)};
+`, r = t(o)`
+  color: ${({ theme: e }) => e.palette.grey[700]};
+`, s = t("div")`
+  display: flex;
+  gap: ${({ theme: e }) => e.spacing(3)};
+  align-items: center;
+
+  .${n.root} {
+    flex-direction: unset;
+  }
+`;
+export {
+  a as PaginationWrapper,
+  r as Range,
+  s as RangeWrapper
+};

package/lib/components/DataGridPagination/useLogic/useLogic.d.ts

@@ -0,0 +1,10 @@
+import { SelectChangeEvent } from '@mui/material';
+import { DataGridPaginationProps } from '../DataGridPagination';
+type UseLogicParams = DataGridPaginationProps;
+export declare const useLogic: ({ totalCount, rowsPerPage, page, onSetCountPerPage, }: UseLogicParams) => {
+    isVisiblePagination: boolean;
+    pageCount: number;
+    formattedRange: () => string;
+    handleChangeRowsPerPage: (event: SelectChangeEvent<unknown>) => void;
+};
+export {};

package/lib/components/DataGridPagination/useLogic/useLogic.mjs

@@ -0,0 +1,28 @@
+import { useRef as g, useEffect as R } from "react";
+import { DEFAULT_ROWS_PER_PAGE as l } from "../constants.mjs";
+const p = ({
+  totalCount: e,
+  rowsPerPage: t = l,
+  page: c,
+  onSetCountPerPage: s
+}) => {
+  const a = g(0);
+  R(() => {
+    e && (a.current = e);
+  }, [e]);
+  const n = e || a.current, i = Math.ceil(n / t), o = (c - 1) * t + 1, u = () => {
+    const r = c * t;
+    return r < n ? r : n;
+  }, f = () => `${o} — ${u()} из ${n} записей`;
+  return {
+    isVisiblePagination: !(!s && n <= t),
+    pageCount: i,
+    formattedRange: f,
+    handleChangeRowsPerPage: (r) => {
+      s?.(Number(r.target.value));
+    }
+  };
+};
+export {
+  p as useLogic
+};

package/lib/components/Description/Description.d.ts

@@ -0,0 +1,34 @@
+import { ReactNode } from 'react';
+export type DescriptionProps = {
+    /**
+     * Элементы Description.Name и Description.Value
+     */
+    children: ReactNode;
+    /**
+     * Позиционирует элементы либо по разным краям, либо по левому краю
+     */
+    justifyContent?: 'space-between' | 'start';
+    /**
+     * Добавляет dashed разделитель, заполняющего свободное пространство между Name Value
+     */
+    leader?: boolean;
+    /**
+     * Определяет разделитель между Name Value
+     * @default ':'
+     */
+    separator?: string;
+    /**
+     * Определяет тип корневого HTML-элемента
+     */
+    component?: 'div' | 'dl';
+    /**
+     * Определяет перенос строк
+     * @default 'default'
+     */
+    direction?: 'default' | 'column' | 'row';
+};
+export declare const Description: {
+    (props: DescriptionProps): import("react/jsx-runtime").JSX.Element;
+    Name: ({ children, color, ...props }: import('./Name').NameProps) => import("react/jsx-runtime").JSX.Element;
+    Value: (props: import('./Value').ValueProps) => import("react/jsx-runtime").JSX.Element;
+};

package/lib/components/Description/Description.mjs

@@ -0,0 +1,39 @@
+import { j as t } from "../../_virtual/jsx-runtime.mjs";
+import "./DescriptionContext/DescriptionContext.mjs";
+import { DescriptionContextProvider as c } from "./DescriptionContext/DescriptionContextProvider/DescriptionContextProvider.mjs";
+import { Name as a } from "./Name/Name.mjs";
+import { Value as f } from "./Value/Value.mjs";
+import { DESCRIPTION_ROOT_CLASSNAME as d } from "./constants.mjs";
+import { Wrapper as l } from "./styles.mjs";
+import { useLogic as u } from "./useLogic/useLogic.mjs";
+const e = (o) => {
+  const { descriptionContextProviderProps: i, direction: r } = u(o), {
+    justifyContent: m = "start",
+    component: n = "dl",
+    children: s,
+    leader: p = !1
+  } = o;
+  return /* @__PURE__ */ t.jsx(
+    c,
+    {
+      leader: p,
+      direction: r,
+      ...i,
+      children: /* @__PURE__ */ t.jsx(
+        l,
+        {
+          $justifyContent: m,
+          className: d,
+          $direction: r,
+          as: n,
+          children: s
+        }
+      )
+    }
+  );
+};
+e.Name = a;
+e.Value = f;
+export {
+  e as Description
+};

package/lib/components/Description/DescriptionContext/DescriptionContext.d.ts

@@ -0,0 +1,6 @@
+export type DescriptionContextProps = {
+    leader: boolean;
+    separator: string;
+    direction: string;
+};
+export declare const DescriptionContext: import('react').Context<DescriptionContextProps>;

package/lib/components/Description/DescriptionContext/DescriptionContext.mjs

@@ -0,0 +1,10 @@
+import { createContext as t } from "react";
+import { DEFAULT_SEPARATOR as e } from "../constants.mjs";
+const a = t({
+  leader: !1,
+  separator: e,
+  direction: "default"
+});
+export {
+  a as DescriptionContext
+};

package/lib/components/Description/DescriptionContext/DescriptionContextProvider/DescriptionContextProvider.d.ts

@@ -0,0 +1,7 @@
+import { ReactNode } from 'react';
+import { DescriptionContextProps } from '../DescriptionContext';
+type Props = DescriptionContextProps & {
+    children: ReactNode;
+};
+export declare const DescriptionContextProvider: ({ children, leader, separator, direction, }: Props) => import("react/jsx-runtime").JSX.Element;
+export {};

package/lib/components/Description/DescriptionContext/DescriptionContextProvider/DescriptionContextProvider.mjs

@@ -0,0 +1,11 @@
+import { j as i } from "../../../../_virtual/jsx-runtime.mjs";
+import { DescriptionContext as s } from "../DescriptionContext.mjs";
+const x = ({
+  children: o,
+  leader: r,
+  separator: t,
+  direction: e
+}) => /* @__PURE__ */ i.jsx(s.Provider, { value: { leader: r, separator: t, direction: e }, children: o });
+export {
+  x as DescriptionContextProvider
+};

package/lib/components/Description/Name/Name.d.ts

@@ -0,0 +1,3 @@
+import { TypographyProps } from '../../Typography';
+export type NameProps = Pick<TypographyProps, 'color' | 'variant' | 'children'>;
+export declare const Name: ({ children, color, ...props }: NameProps) => import("react/jsx-runtime").JSX.Element;

package/lib/components/Description/Name/Name.mjs

@@ -0,0 +1,22 @@
+import { j as r } from "../../../_virtual/jsx-runtime.mjs";
+import { useContext as a } from "react";
+import { Typography as m } from "../../Typography/Typography.mjs";
+import { DescriptionContext as n } from "../DescriptionContext/DescriptionContext.mjs";
+import { Wrapper as i, DashedSeparator as x } from "./styles.mjs";
+const l = ({
+  children: o,
+  color: t = "textSecondary",
+  ...s
+}) => {
+  const { leader: e, separator: p } = a(n);
+  return /* @__PURE__ */ r.jsxs(r.Fragment, { children: [
+    /* @__PURE__ */ r.jsx(i, { $leader: e, children: /* @__PURE__ */ r.jsxs(m, { ...s, color: t, children: [
+      o,
+      !e && p
+    ] }) }),
+    e && /* @__PURE__ */ r.jsx(x, {})
+  ] });
+};
+export {
+  l as Name
+};

package/lib/components/Description/Name/styles.d.ts

@@ -0,0 +1,6 @@
+type WrapperProps = {
+    $leader?: boolean;
+};
+export declare const Wrapper: import('@emotion/styled').StyledComponent<import('@mui/system').MUIStyledCommonProps<import('@mui/material').Theme> & WrapperProps, import('react').DetailedHTMLProps<import('react').HTMLAttributes<HTMLElement>, HTMLElement>, {}>;
+export declare const DashedSeparator: import('@emotion/styled').StyledComponent<import('@mui/system').MUIStyledCommonProps<import('@mui/material').Theme>, import('react').DetailedHTMLProps<import('react').HTMLAttributes<HTMLDivElement>, HTMLDivElement>, {}>;
+export {};

package/lib/components/Description/Name/styles.mjs

@@ -0,0 +1,25 @@
+import { styled as a } from "@mui/material";
+const t = a("dt", {
+  shouldForwardProp: (r) => r !== "$leader"
+})`
+  flex-shrink: 0;
+
+  max-width: ${({ $leader: r }) => r ? "calc(100% - 36px)" : "calc(100% - 12px)"};
+  margin-right: ${({ theme: r }) => r.spacing(2)};
+`, p = a("div")`
+  flex: 1;
+
+  min-width: 12px;
+  height: 4px;
+  margin-right: ${({ theme: r }) => r.spacing(2)};
+
+  border-bottom: 1px dashed ${({ theme: r }) => r.palette.grey[400]};
+
+  ${({ theme: r }) => r.breakpoints.down("sm")} {
+    display: none;
+  }
+`;
+export {
+  p as DashedSeparator,
+  t as Wrapper
+};

package/lib/components/Description/Value/Value.d.ts

@@ -0,0 +1,22 @@
+import { ReactNode } from 'react';
+import { TypographyProps } from '../../Typography';
+export type ValueProps = Pick<TypographyProps, 'color' | 'variant' | 'children'> & {
+    /**
+     * @example <Description.Item stub="нет значения">value</Description.Item>
+     * Заглушка, отображающаяся, если нет значения
+     */
+    stub?: ReactNode;
+    /**
+     * Добавляет возможность копирования
+     */
+    canCopy?: boolean;
+    /**
+     * Позиционирует иконку "копировать" (слева / справа от текста)
+     */
+    copyPosition?: 'left' | 'right';
+    /**
+     * Текст, который будет скопирован. Перекрывает обычное копирование если children является строкой
+     */
+    copyText?: string;
+};
+export declare const Value: (props: ValueProps) => import("react/jsx-runtime").JSX.Element;

package/lib/components/Description/Value/Value.mjs

@@ -0,0 +1,37 @@
+import { j as e } from "../../../_virtual/jsx-runtime.mjs";
+import { StyledTypography as s, Wrapper as l, StyledCopyTypography as a } from "./styles.mjs";
+import { useLogic as y } from "./useLogic/useLogic.mjs";
+const g = (r) => {
+  const { valueToRender: o, isDefaultValueRender: d, leader: t, direction: i } = y(r), {
+    copyPosition: c = "right",
+    copyText: p,
+    canCopy: m,
+    children: u,
+    stub: h,
+    ...n
+  } = r;
+  return d ? /* @__PURE__ */ e.jsx(
+    s,
+    {
+      $direction: i,
+      component: "dd",
+      $leader: t,
+      ...n,
+      children: o
+    }
+  ) : /* @__PURE__ */ e.jsx(l, { children: /* @__PURE__ */ e.jsx(
+    a,
+    {
+      copyPosition: c,
+      copyText: p,
+      $direction: i,
+      $leader: t,
+      component: "div",
+      ...n,
+      children: o
+    }
+  ) });
+};
+export {
+  g as Value
+};