@itcase/ui 1.1.5 → 1.1.7

package/dist/cjs/Text-CfBPhwqK.js

@@ -0,0 +1,88 @@
+'use strict';
+
+var jsxRuntime = require('./jsx-runtime-BCmQOGxJ.js');
+var clsx = require('clsx');
+var useDeviceTargetClass = require('./hooks/useDeviceTargetClass.js');
+var useStyles = require('./hooks/useStyles.js');
+
+function _interopDefault (e) { return e && e.__esModule ? e : { default: e }; }
+
+var clsx__default = /*#__PURE__*/_interopDefault(clsx);
+
+var textConfig = {
+    appearance: {},
+    setAppearance: function (newComponent) {
+        textConfig.appearance = newComponent;
+    },
+};
+function Text(props) {
+    var _a, _b;
+    var after = props.after, appearance = props.appearance, dataTestId = props.dataTestId, before = props.before, children = props.children, className = props.className, cursor = props.cursor, dataTour = props.dataTour, htmlFor = props.htmlFor, mode = props.mode, _c = props.tag, Tag = _c === void 0 ? 'span' : _c, type = props.type, onClick = props.onClick;
+    var cursorClass = useDeviceTargetClass.useDeviceTargetClass(props, {
+        prefix: 'cursor_',
+        propsKey: 'cursor',
+    });
+    var sizeClass = useDeviceTargetClass.useDeviceTargetClass(props, {
+        prefix: 'text_size_',
+        propsKey: 'size',
+    });
+    var weightClass = useDeviceTargetClass.useDeviceTargetClass(props, {
+        prefix: 'text-weight_',
+        propsKey: 'textWeight',
+    });
+    var textColorClass = useDeviceTargetClass.useDeviceTargetClass(props, {
+        prefix: 'text-color_',
+        propsKey: 'textColor',
+    });
+    var textAlignClass = useDeviceTargetClass.useDeviceTargetClass(props, {
+        prefix: 'text-align_',
+        propsKey: 'textAlign',
+    });
+    var textColorActiveClass = useDeviceTargetClass.useDeviceTargetClass(props, {
+        prefix: 'text-color_active_',
+        propsKey: 'textColorActive',
+    });
+    var textColorHoverClass = useDeviceTargetClass.useDeviceTargetClass(props, {
+        prefix: 'text-color_hover_',
+        propsKey: 'textColorHover',
+    });
+    var textGradientClass = useDeviceTargetClass.useDeviceTargetClass(props, {
+        prefix: 'text-gradient_',
+        propsKey: 'textColorGradient',
+    });
+    var textTruncateClass = useDeviceTargetClass.useDeviceTargetClass(props, {
+        prefix: 'text-truncate_',
+        propsKey: 'textTruncate',
+    });
+    var textStyleClass = useDeviceTargetClass.useDeviceTargetClass(props, {
+        prefix: 'text-style_',
+        propsKey: 'textStyle',
+    });
+    var textWrapClass = useDeviceTargetClass.useDeviceTargetClass(props, {
+        prefix: 'word-wrap_',
+        propsKey: 'textWrap',
+    });
+    var widthClass = useDeviceTargetClass.useDeviceTargetClass(props, {
+        prefix: 'width_',
+        propsKey: 'width',
+    });
+    // @ts-expect-error
+    var textStyles = useStyles.useStyles(props).styles;
+    return (jsxRuntime.jsxRuntimeExports.jsxs(Tag, { className: clsx__default.default(className, 'text', sizeClass ||
+            (appearance &&
+                ((_a = textConfig.appearance[appearance]) === null || _a === void 0 ? void 0 : _a.size) &&
+                "text_size_".concat(textConfig.appearance[appearance].size)
+                    .replace(/([A-Z])/g, '-$1')
+                    .toLowerCase()), weightClass, textAlignClass, textColorClass ||
+            (appearance &&
+                ((_b = textConfig.appearance[appearance]) === null || _b === void 0 ? void 0 : _b.textColor) &&
+                "text-color_".concat(textConfig.appearance[appearance].textColor)
+                    .replace(/([A-Z])/g, '-$1')
+                    .toLowerCase()), textColorActiveClass, textColorHoverClass, textGradientClass, textStyleClass, textTruncateClass, textWrapClass, type && "text_type_".concat(type), mode && "text_mode_".concat(mode), widthClass, cursorClass, onClick && (cursor || 'cursor_type_pointer')), "data-tour": dataTour, htmlFor: htmlFor, style: textStyles, onClick: onClick, "data-test-id": dataTestId, children: [before, children, after] }));
+}
+Text.defaultProps = {
+    tag: 'span',
+};
+
+exports.Text = Text;
+exports.textConfig = textConfig;

package/dist/cjs/components/Accordion/Accordion.d.ts

@@ -0,0 +1,8 @@
+import { IAccordionProps } from './Accordion.interface';
+declare function Accordion(props: IAccordionProps): import("react/jsx-runtime").JSX.Element;
+declare namespace Accordion {
+    var defaultProps: {
+        initial: never[];
+    };
+}
+export { Accordion };

package/dist/cjs/components/Accordion/Accordion.interface.d.ts

@@ -0,0 +1,68 @@
+import React from 'react';
+import { borderColorPropsType, directionPropsType, fillHoverPropsType, fillPropsType, heightPropsType, shapePropsType, sizePropsType, textColorPropsType, textWeightPropsType, widthPropsType } from '../../constants-ts';
+import { TypeStyleAttributes } from '../../hooks/styleAttributes.interface';
+export interface IAccordionProps extends TypeStyleAttributes {
+    children?: React.ReactNode;
+    items?: {
+        content: React.ReactNode;
+        id: number | string;
+        title: string;
+    }[];
+    className: string;
+    initial: any;
+    isMultiple: boolean;
+    onClickItem?: ({}: {
+        id: number | string;
+    }) => void;
+    borderColor?: borderColorPropsType;
+    direction?: directionPropsType;
+    fill?: fillPropsType;
+    shape?: shapePropsType;
+    height?: heightPropsType;
+    width?: widthPropsType;
+}
+export interface IAccordionItemProps extends TypeStyleAttributes {
+    children?: React.ReactNode;
+    id: number | string;
+    title?: string;
+    icon?: React.ReactNode;
+    content?: React.ReactNode;
+    afterContent?: React.ReactNode;
+    beforeContent?: React.ReactNode;
+    className?: string;
+    titleTextSize?: sizePropsType;
+    titleTextColor?: textColorPropsType;
+    titleTextWeight?: textWeightPropsType;
+    contentTextSize?: sizePropsType;
+    contentTextColor?: textColorPropsType;
+    contentTextWeight?: textWeightPropsType;
+    size?: sizePropsType;
+    isExpanded?: boolean;
+    onClick?: ({}: {
+        id: number | string;
+        title?: string;
+        content?: React.ReactNode;
+        isExpanded?: boolean;
+    }) => void;
+    fillDesktop?: fillPropsType;
+    fillMobile?: fillPropsType;
+    fillTablet?: fillPropsType;
+    iconFill?: fillPropsType;
+    iconFillDesktop?: fillPropsType;
+    iconFillMobile?: fillPropsType;
+    iconFillTablet?: fillPropsType;
+    shapeDesktop?: shapePropsType;
+    shapeMobile?: shapePropsType;
+    shapeTablet?: shapePropsType;
+    borderColor?: borderColorPropsType;
+    contentBorderColor?: borderColorPropsType;
+    titleBorderColor?: borderColorPropsType;
+    fill?: fillPropsType;
+    fillHover?: fillHoverPropsType;
+    contentFill?: fillPropsType;
+    titleFill?: fillPropsType;
+    titleFillHover?: fillHoverPropsType;
+    shape?: shapePropsType;
+    width?: widthPropsType;
+    height?: heightPropsType;
+}

package/dist/cjs/components/Accordion/AccordionItem.d.ts

@@ -0,0 +1,8 @@
+import { IAccordionItemProps } from './Accordion.interface';
+declare function AccordionItem(props: IAccordionItemProps): import("react/jsx-runtime").JSX.Element;
+declare namespace AccordionItem {
+    var defaultProps: {
+        iconFill: string;
+    };
+}
+export { AccordionItem };

package/dist/cjs/components/Accordion/index.d.ts

@@ -0,0 +1,3 @@
+import { Accordion } from './Accordion';
+import { AccordionItem } from './AccordionItem';
+export { Accordion, AccordionItem };

package/dist/cjs/components/Accordion.js

@@ -0,0 +1,45 @@
+'use strict';
+
+var Accordion = require('../Accordion-BDTE-Lkj.js');
+require('../jsx-runtime-BCmQOGxJ.js');
+require('react');
+require('clsx');
+require('lodash/castArray');
+require('../hooks/useDeviceTargetClass.js');
+require('lodash/camelCase');
+require('../context/UIContext.js');
+require('prop-types');
+require('../hooks/useMediaQueries.js');
+require('react-responsive');
+require('../hooks/useStyles.js');
+require('lodash/maxBy');
+require('lodash/upperFirst');
+require('../hooks/styleAttributes.js');
+require('./Icon.js');
+require('react-inlinesvg');
+require('./Link.js');
+require('../constants/componentProps/fill.js');
+require('../constants/componentProps/size.js');
+require('../constants/componentProps/textColor.js');
+require('../constants/componentProps/textGradient.js');
+require('../constants/componentProps/textStyle.js');
+require('../constants/componentProps/textWeight.js');
+require('../constants/componentProps/type.js');
+require('../constants/componentProps/underline.js');
+require('../constants/componentProps/borderColor.js');
+require('../constants/componentProps/borderType.js');
+require('../constants/componentProps/iconSize.js');
+require('../constants/componentProps/shape.js');
+require('../constants/componentProps/strokeColor.js');
+require('./Tooltip.js');
+require('../Text-CfBPhwqK.js');
+require('./Title.js');
+require('../constants/componentProps/textAlign.js');
+require('../constants/componentProps/titleSize.js');
+require('../constants/componentProps/wrap.js');
+require('../constants/componentProps/textSize.js');
+
+
+
+exports.Accordion = Accordion.Accordion;
+exports.AccordionItem = Accordion.AccordionItem;

package/dist/cjs/components/Avatar.js

@@ -0,0 +1,270 @@
+'use strict';
+
+var React = require('react');
+var PropTypes = require('prop-types');
+var clsx = require('clsx');
+var shape = require('../constants/componentProps/shape.js');
+var sizePX = require('../constants/componentProps/sizePX.js');
+var useDeviceTargetClass = require('../hooks/useDeviceTargetClass.js');
+var index$1 = require('./Icon.js');
+var index = require('./Image.js');
+var Text = require('../Text-CfBPhwqK.js');
+require('lodash/castArray');
+require('lodash/camelCase');
+require('../context/UIContext.js');
+require('../hooks/useMediaQueries.js');
+require('react-responsive');
+require('react-inlinesvg');
+require('./Link.js');
+require('../constants/componentProps/fill.js');
+require('../constants/componentProps/size.js');
+require('../constants/componentProps/textColor.js');
+require('../constants/componentProps/textGradient.js');
+require('../constants/componentProps/textStyle.js');
+require('../constants/componentProps/textWeight.js');
+require('../constants/componentProps/type.js');
+require('../constants/componentProps/underline.js');
+require('../hooks/useStyles.js');
+require('lodash/maxBy');
+require('lodash/upperFirst');
+require('../hooks/styleAttributes.js');
+require('../constants/componentProps/borderColor.js');
+require('../constants/componentProps/borderType.js');
+require('../constants/componentProps/iconSize.js');
+require('../constants/componentProps/strokeColor.js');
+require('./Tooltip.js');
+require('./Title.js');
+require('../constants/componentProps/textAlign.js');
+require('../constants/componentProps/titleSize.js');
+require('../constants/componentProps/wrap.js');
+require('../constants/componentProps/textSize.js');
+require('../constants/componentProps/resizeMode.js');
+require('../constants/componentProps/width.js');
+require('../jsx-runtime-BCmQOGxJ.js');
+
+function _interopDefault (e) { return e && e.__esModule ? e : { default: e }; }
+
+var React__default = /*#__PURE__*/_interopDefault(React);
+var PropTypes__default = /*#__PURE__*/_interopDefault(PropTypes);
+var clsx__default = /*#__PURE__*/_interopDefault(clsx);
+
+function Avatar(props) {
+  const {
+    Dot,
+    className,
+    icon,
+    size,
+    after,
+    before,
+    src,
+    type,
+    mode,
+    onClick,
+    textSize,
+    textColor,
+    textWeight,
+    iconSrc,
+    iconItemFill,
+    iconShape,
+    iconSize,
+    iconStroke,
+    iconFill,
+    iconFillHover,
+    iconFillSize,
+    firstName,
+    secondName
+  } = props;
+  const fillClass = useDeviceTargetClass.useDeviceTargetClass(props, {
+    prefix: 'fill_',
+    propsKey: 'fill'
+  });
+  const fillHoverClass = useDeviceTargetClass.useDeviceTargetClass(props, {
+    prefix: 'fill_hover_',
+    propsKey: 'fillHover'
+  });
+  const shapeClass = useDeviceTargetClass.useDeviceTargetClass(props, {
+    prefix: 'avatar_shape_',
+    propsKey: 'shape'
+  });
+  const avatarChars = React.useMemo(() => {
+    const firstChar = (firstName?.[0] || '').toUpperCase();
+    const secondChar = (secondName?.[0] || '').toUpperCase();
+    return `${firstChar}${secondChar}`;
+  }, [firstName, secondName]);
+  return /*#__PURE__*/React__default.default.createElement("div", {
+    className: clsx__default.default(className, 'avatar', shapeClass, mode && `avatar_mode_${mode}`, size && `avatar_size_${size}`, type && `avatar_type_${type}`, Dot && 'avatar_status', onClick && 'cursor_type_pointer'),
+    onClick: onClick
+  }, /*#__PURE__*/React__default.default.createElement("div", {
+    className: clsx__default.default('avatar__wrapper', fillClass, fillHoverClass)
+  }, before, src ? /*#__PURE__*/React__default.default.createElement(index.Image, {
+    className: "avatar__image",
+    shape: "geometric",
+    src: src
+  }) : /*#__PURE__*/React__default.default.createElement(Text.Text, {
+    className: "avatar__name",
+    size: textSize,
+    textColor: textColor,
+    textWeight: textWeight
+  }, avatarChars), (icon || iconSrc) && /*#__PURE__*/React__default.default.createElement(index$1.Icon, {
+    className: "avatar__icon",
+    fill: iconFill,
+    fillHover: iconFillHover,
+    fillSize: iconFillSize,
+    iconSize: iconSize,
+    iconFill: iconItemFill,
+    imageSrc: iconSrc,
+    shape: iconShape,
+    stroke: iconStroke,
+    SvgImage: icon
+  }), Dot, after));
+}
+Avatar.propTypes = {
+  children: PropTypes__default.default.any,
+  /**
+   * Description
+   */
+  className: PropTypes__default.default.string,
+  /**
+   * Цвет текста
+   */
+  textColor: PropTypes__default.default.string,
+  /**
+   * Размер аватара
+   */
+  size: PropTypes__default.default.oneOf(sizePX.default),
+  /**
+   * Тип аватара
+   */
+  type: PropTypes__default.default.oneOf(['image', 'text']),
+  /**
+   * Форма
+   */
+  shape: PropTypes__default.default.oneOf(shape.default),
+  Dot: PropTypes__default.default.oneOfType([PropTypes__default.default.element, PropTypes__default.default.bool]),
+  onClick: PropTypes__default.default.func
+};
+Avatar.defaultProps = {
+  size: '96',
+  textSize: 'l',
+  textColor: 'surfaceTextTertiary',
+  textWeight: 600,
+  firstName: '',
+  secondName: ''
+};
+Avatar.__docgenInfo = {
+  "description": "",
+  "methods": [],
+  "displayName": "Avatar",
+  "props": {
+    "size": {
+      "defaultValue": {
+        "value": "'96'",
+        "computed": false
+      },
+      "description": "\u0420\u0430\u0437\u043C\u0435\u0440 \u0430\u0432\u0430\u0442\u0430\u0440\u0430",
+      "type": {
+        "name": "enum",
+        "computed": true,
+        "value": "sizePXProps"
+      },
+      "required": false
+    },
+    "textSize": {
+      "defaultValue": {
+        "value": "'l'",
+        "computed": false
+      },
+      "required": false
+    },
+    "textColor": {
+      "defaultValue": {
+        "value": "'surfaceTextTertiary'",
+        "computed": false
+      },
+      "description": "\u0426\u0432\u0435\u0442 \u0442\u0435\u043A\u0441\u0442\u0430",
+      "type": {
+        "name": "string"
+      },
+      "required": false
+    },
+    "textWeight": {
+      "defaultValue": {
+        "value": "600",
+        "computed": false
+      },
+      "required": false
+    },
+    "firstName": {
+      "defaultValue": {
+        "value": "''",
+        "computed": false
+      },
+      "required": false
+    },
+    "secondName": {
+      "defaultValue": {
+        "value": "''",
+        "computed": false
+      },
+      "required": false
+    },
+    "children": {
+      "description": "",
+      "type": {
+        "name": "any"
+      },
+      "required": false
+    },
+    "className": {
+      "description": "Description",
+      "type": {
+        "name": "string"
+      },
+      "required": false
+    },
+    "type": {
+      "description": "\u0422\u0438\u043F \u0430\u0432\u0430\u0442\u0430\u0440\u0430",
+      "type": {
+        "name": "enum",
+        "value": [{
+          "value": "'image'",
+          "computed": false
+        }, {
+          "value": "'text'",
+          "computed": false
+        }]
+      },
+      "required": false
+    },
+    "shape": {
+      "description": "\u0424\u043E\u0440\u043C\u0430",
+      "type": {
+        "name": "enum",
+        "computed": true,
+        "value": "shapeProps"
+      },
+      "required": false
+    },
+    "Dot": {
+      "description": "",
+      "type": {
+        "name": "union",
+        "value": [{
+          "name": "element"
+        }, {
+          "name": "bool"
+        }]
+      },
+      "required": false
+    },
+    "onClick": {
+      "description": "",
+      "type": {
+        "name": "func"
+      },
+      "required": false
+    }
+  }
+};
+
+exports.Avatar = Avatar;