@itcase/ui 1.1.6 → 1.1.8

package/dist/cjs/components/Switch.js

@@ -0,0 +1,105 @@
+'use strict';
+
+var React = require('react');
+var PropTypes = require('prop-types');
+var clsx = require('clsx');
+
+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);
+
+const Switch = /*#__PURE__*/React__default.default.forwardRef(function Switch(props, ref) {
+  const {
+    className,
+    set,
+    size,
+    id,
+    checked,
+    disabled,
+    onChange
+  } = props;
+  return /*#__PURE__*/React__default.default.createElement("div", {
+    className: clsx__default.default('switch', className, size && `switch_size_${size}`, set && `switch_set_${set}`)
+  }, /*#__PURE__*/React__default.default.createElement("input", {
+    checked: checked,
+    className: "switch__checkbox",
+    disabled: disabled,
+    id: id,
+    ref: ref,
+    type: "checkbox",
+    onChange: onChange
+  }), /*#__PURE__*/React__default.default.createElement("div", {
+    className: "switch__bg"
+  }, "\xA0"), /*#__PURE__*/React__default.default.createElement("div", {
+    className: "switch__toggle"
+  }, "\xA0"));
+});
+Switch.propTypes = {
+  checked: PropTypes__default.default.bool,
+  className: PropTypes__default.default.string,
+  disabled: PropTypes__default.default.bool,
+  id: PropTypes__default.default.string,
+  set: PropTypes__default.default.string,
+  size: PropTypes__default.default.string,
+  onChange: PropTypes__default.default.func
+};
+Switch.__docgenInfo = {
+  "description": "",
+  "methods": [],
+  "displayName": "Switch",
+  "props": {
+    "checked": {
+      "description": "",
+      "type": {
+        "name": "bool"
+      },
+      "required": false
+    },
+    "className": {
+      "description": "",
+      "type": {
+        "name": "string"
+      },
+      "required": false
+    },
+    "disabled": {
+      "description": "",
+      "type": {
+        "name": "bool"
+      },
+      "required": false
+    },
+    "id": {
+      "description": "",
+      "type": {
+        "name": "string"
+      },
+      "required": false
+    },
+    "set": {
+      "description": "",
+      "type": {
+        "name": "string"
+      },
+      "required": false
+    },
+    "size": {
+      "description": "",
+      "type": {
+        "name": "string"
+      },
+      "required": false
+    },
+    "onChange": {
+      "description": "",
+      "type": {
+        "name": "func"
+      },
+      "required": false
+    }
+  }
+};
+
+exports.Switch = Switch;

package/dist/cjs/components/Tab.js

@@ -0,0 +1,42 @@
+'use strict';
+
+var TabGroup = require('../TabGroup-DIWmGIp2.js');
+require('react');
+require('prop-types');
+require('clsx');
+require('./Badge.js');
+require('../constants/componentProps/shape.js');
+require('../Text-D7Aq1i5R.js');
+require('../jsx-runtime-BCmQOGxJ.js');
+require('../hooks/useDeviceTargetClass.js');
+require('lodash/castArray');
+require('lodash/camelCase');
+require('../context/UIContext.js');
+require('../hooks/useMediaQueries.js');
+require('react-responsive');
+require('../hooks/useStyles.js');
+require('lodash/maxBy');
+require('lodash/upperFirst');
+require('../hooks/styleAttributes.js');
+require('../Link-BoShjCEw.js');
+require('../Divider-CIYsHYud.js');
+require('../constants/componentProps/fill.js');
+require('../constants/componentProps/textColorActive.js');
+require('../constants/componentProps/textColorHover.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/size.js');
+require('../constants/componentProps/direction.js');
+require('../constants/componentProps/stacking.js');
+require('../constants/componentProps/wrap.js');
+require('../constants/componentProps/width.js');
+
+
+
+exports.Tab = TabGroup.Tab;
+exports.TabGroup = TabGroup.TabGroup;
+exports.tabConfig = TabGroup.tabConfig;

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

@@ -0,0 +1,9 @@
+import { ITextConfig, ITextProps } from './Text.interface';
+declare const textConfig: ITextConfig;
+declare function Text(props: ITextProps): import("react/jsx-runtime").JSX.Element;
+declare namespace Text {
+    var defaultProps: {
+        tag: string;
+    };
+}
+export { Text, textConfig };

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

@@ -0,0 +1,53 @@
+import React, { ElementType } from 'react';
+import { TypeStyleAttributes } from '../../hooks/styleAttributes.interface';
+import { sizePropsType, textAlignPropsType, textColorActivePropsType, textColorHoverPropsType, textColorPropsType, textGradientPropsType, textSizePropsType, textStylePropsType, textWeightPropsType, textWrapPropsType, typePropsType, widthPropsType } from '../../types';
+import { appearanceKeysDefaultType } from '../../types/componentProps/appearanceKeys';
+interface ITextThemeColor {
+    size?: sizePropsType;
+    textColor?: textColorPropsType;
+    textColorActive?: textColorActivePropsType;
+    textColorGradient?: textGradientPropsType;
+    textColorHover?: textColorHoverPropsType;
+}
+type appearanceKeysType = appearanceKeysDefaultType & {};
+type appearanceType = {
+    [key in appearanceKeysType]: ITextThemeColor;
+};
+export interface ITextConfig {
+    appearance: appearanceType | undefined;
+    setAppearance: (newComponent: appearanceType) => void;
+}
+export interface ITextProps extends ITextThemeColor, TypeStyleAttributes {
+    after?: React.ReactNode;
+    appearance?: appearanceKeysType;
+    before?: React.ReactNode;
+    children: React.ReactNode;
+    className?: string;
+    dataTestId?: number | string;
+    dataTour?: string;
+    htmlFor?: string;
+    id?: number | string;
+    mode?: string;
+    tag?: ElementType;
+    onClick?: () => void;
+    sizeDesktop?: sizePropsType;
+    sizeMobile?: sizePropsType;
+    sizeTablet?: sizePropsType;
+    textColorDesktop?: textColorPropsType;
+    textColorMobile?: textColorPropsType;
+    textColorTablet?: textColorPropsType;
+    textWeightDesktop?: textWeightPropsType;
+    textWeightMobile?: textWeightPropsType;
+    textWeightTablet?: textWeightPropsType;
+    type?: typePropsType;
+    cursor?: string;
+    size?: textSizePropsType;
+    textAlign?: textAlignPropsType;
+    textColor?: textColorPropsType;
+    textStyle?: textStylePropsType;
+    textTruncate?: string;
+    textWeight?: textWeightPropsType;
+    textWrap?: textWrapPropsType;
+    width?: widthPropsType;
+}
+export {};

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

@@ -0,0 +1 @@
+export { Text, textConfig } from './Text';

package/dist/cjs/components/Text.js

@@ -0,0 +1,22 @@
+'use strict';
+
+var Text = require('../Text-D7Aq1i5R.js');
+require('../jsx-runtime-BCmQOGxJ.js');
+require('react');
+require('clsx');
+require('../hooks/useDeviceTargetClass.js');
+require('lodash/castArray');
+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');
+
+
+
+exports.Text = Text.Text;
+exports.textConfig = Text.textConfig;

package/dist/cjs/components/Textarea.js

@@ -0,0 +1,212 @@
+'use strict';
+
+var React = require('react');
+var PropTypes = require('prop-types');
+var clsx = require('clsx');
+var borderColor = require('../constants/componentProps/borderColor.js');
+var size = require('../constants/componentProps/size.js');
+var textColor = require('../constants/componentProps/textColor.js');
+var useDeviceTargetClass = require('../hooks/useDeviceTargetClass.js');
+require('lodash/castArray');
+require('lodash/camelCase');
+require('../context/UIContext.js');
+require('../hooks/useMediaQueries.js');
+require('react-responsive');
+
+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);
+
+const textareaConfig = {
+  state: {},
+  setState: newComponent => {
+    textareaConfig.state = newComponent;
+  },
+  appearance: {},
+  setAppearance: newComponent => {
+    textareaConfig.appearance = newComponent;
+  }
+};
+function Textarea(props) {
+  const {
+    appearance,
+    id,
+    className,
+    placeholder,
+    disabled,
+    state,
+    value,
+    onBlur,
+    onChange,
+    onKeyDown
+  } = props;
+  const fillClass = useDeviceTargetClass.useDeviceTargetClass(props, {
+    prefix: 'fill_',
+    propsKey: 'fill'
+  });
+  const borderColorClass = useDeviceTargetClass.useDeviceTargetClass(props, {
+    prefix: 'border-color_',
+    propsKey: 'borderColor'
+  });
+  const borderColorHoverClass = useDeviceTargetClass.useDeviceTargetClass(props, {
+    prefix: 'border-color_hover_',
+    propsKey: 'borderHover'
+  });
+  const sizeClass = useDeviceTargetClass.useDeviceTargetClass(props, {
+    prefix: 'textarea_size_',
+    propsKey: 'size'
+  });
+  const shapeClass = useDeviceTargetClass.useDeviceTargetClass(props, {
+    prefix: 'textarea_shape_',
+    propsKey: 'shape'
+  });
+  const textSizeClass = useDeviceTargetClass.useDeviceTargetClass(props, {
+    prefix: 'text_size_',
+    propsKey: 'textSize'
+  });
+  const textColorClass = useDeviceTargetClass.useDeviceTargetClass(props, {
+    prefix: 'text-color_',
+    propsKey: 'textColor'
+  });
+  const caretClass = useDeviceTargetClass.useDeviceTargetClass(props, {
+    prefix: 'caret-color_',
+    propsKey: 'caret'
+  });
+  const placeholderTextColorClass = useDeviceTargetClass.useDeviceTargetClass(props, {
+    prefix: 'placeholder-text-color_',
+    propsKey: 'placeholderTextColor'
+  });
+  const weightClass = useDeviceTargetClass.useDeviceTargetClass(props, {
+    prefix: 'text-weight_',
+    propsKey: 'textWeight'
+  });
+  const widthClass = useDeviceTargetClass.useDeviceTargetClass(props, {
+    prefix: 'width_',
+    propsKey: 'width'
+  });
+  return /*#__PURE__*/React__default.default.createElement("textarea", {
+    className: clsx__default.default(className, 'textarea', (textSizeClass || textColorClass || weightClass) && 'text', caretClass, fillClass, borderColorClass || textareaConfig.state[state]?.borderColor && `border-color_${textareaConfig.state[state].borderColor}`.replace(/([A-Z])/g, '-$1').toLowerCase() || textareaConfig.appearance[appearance]?.borderColor && `border-color_${textareaConfig.appearance[appearance].borderColor}`.replace(/([A-Z])/g, '-$1').toLowerCase(), borderColorHoverClass || textareaConfig.appearance[appearance]?.borderHover && `border-color_hover_${textareaConfig.appearance[appearance].borderHover}`.replace(/([A-Z])/g, '-$1').toLowerCase(), placeholderTextColorClass || textareaConfig.state[state]?.placeholderTextColor && `placeholder-text-color_${textareaConfig.state[state].placeholderTextColor}`.replace(/([A-Z])/g, '-$1').toLowerCase() || textareaConfig.appearance[appearance]?.placeholderTextColor && `placeholder-text-color_${textareaConfig.appearance[appearance].placeholderTextColor}`.replace(/([A-Z])/g, '-$1').toLowerCase(), sizeClass, shapeClass || textareaConfig.appearance[appearance]?.shape && `textarea_shape_${textareaConfig.appearance[appearance].shape}`.replace(/([A-Z])/g, '-$1').toLowerCase(), textSizeClass || textareaConfig.appearance[appearance]?.textSize && `text_size_${textareaConfig.appearance[appearance].textSize}`.replace(/([A-Z])/g, '-$1').toLowerCase(), textColorClass || textareaConfig.state[state]?.textColor && `text-color_${textareaConfig.state[state].textColor}`.replace(/([A-Z])/g, '-$1').toLowerCase() || textareaConfig.appearance[appearance]?.textColor && `text-color_${textareaConfig.appearance[appearance].textColor}`.replace(/([A-Z])/g, '-$1').toLowerCase(), weightClass, widthClass),
+    id: id,
+    disabled: disabled,
+    placeholder: placeholder,
+    value: value,
+    onBlur: onBlur,
+    onChange: onChange,
+    onKeyDown: onKeyDown
+  });
+}
+Textarea.propTypes = {
+  id: PropTypes__default.default.string,
+  className: PropTypes__default.default.string,
+  placeholder: PropTypes__default.default.string,
+  value: PropTypes__default.default.string,
+  disabled: PropTypes__default.default.bool,
+  size: PropTypes__default.default.oneOf(size.default),
+  borderColor: PropTypes__default.default.oneOf(borderColor.default),
+  textColor: PropTypes__default.default.oneOf(textColor.default),
+  onBlur: PropTypes__default.default.func,
+  onChange: PropTypes__default.default.func,
+  onKeyDown: PropTypes__default.default.func
+};
+Textarea.defaultProps = {
+  size: 'm'
+};
+Textarea.__docgenInfo = {
+  "description": "",
+  "methods": [],
+  "displayName": "Textarea",
+  "props": {
+    "size": {
+      "defaultValue": {
+        "value": "'m'",
+        "computed": false
+      },
+      "description": "",
+      "type": {
+        "name": "enum",
+        "computed": true,
+        "value": "sizeProps"
+      },
+      "required": false
+    },
+    "id": {
+      "description": "",
+      "type": {
+        "name": "string"
+      },
+      "required": false
+    },
+    "className": {
+      "description": "",
+      "type": {
+        "name": "string"
+      },
+      "required": false
+    },
+    "placeholder": {
+      "description": "",
+      "type": {
+        "name": "string"
+      },
+      "required": false
+    },
+    "value": {
+      "description": "",
+      "type": {
+        "name": "string"
+      },
+      "required": false
+    },
+    "disabled": {
+      "description": "",
+      "type": {
+        "name": "bool"
+      },
+      "required": false
+    },
+    "borderColor": {
+      "description": "",
+      "type": {
+        "name": "enum",
+        "computed": true,
+        "value": "borderColorProps"
+      },
+      "required": false
+    },
+    "textColor": {
+      "description": "",
+      "type": {
+        "name": "enum",
+        "computed": true,
+        "value": "textColorProps"
+      },
+      "required": false
+    },
+    "onBlur": {
+      "description": "",
+      "type": {
+        "name": "func"
+      },
+      "required": false
+    },
+    "onChange": {
+      "description": "",
+      "type": {
+        "name": "func"
+      },
+      "required": false
+    },
+    "onKeyDown": {
+      "description": "",
+      "type": {
+        "name": "func"
+      },
+      "required": false
+    }
+  }
+};
+
+exports.Textarea = Textarea;
+exports.textareaConfig = textareaConfig;