@itcase/ui 1.1.5 → 1.1.7

package/dist/Group-DhYXDvAJ.js

@@ -0,0 +1,119 @@
+import { j as jsxRuntimeExports } from './jsx-runtime-ClDdVO4Q.js';
+import clsx from 'clsx';
+import { useDeviceTargetClass } from './hooks/useDeviceTargetClass.js';
+import { useStyles } from './hooks/useStyles.js';
+
+var groupConfig = {
+    appearance: {},
+    setAppearance: function (newComponent) {
+        groupConfig.appearance = newComponent;
+    },
+};
+function Group(props) {
+    var appearance = props.appearance, id = props.id, children = props.children, className = props.className, horizontalScroll = props.horizontalScroll, _a = props.tag, Tag = _a === void 0 ? 'div' : _a, htmlFor = props.htmlFor, set = props.set, style = props.style, dataTour = props.dataTour, onClick = props.onClick;
+    var contentAlignClass = useDeviceTargetClass(props, {
+        prefix: 'group_content-align_',
+        propsKey: 'contentAlign',
+    });
+    var alignDirectionClass = useDeviceTargetClass(props, {
+        prefix: 'align_',
+        propsKey: 'alignDirection',
+    });
+    var alignClass = useDeviceTargetClass(props, {
+        prefix: 'align_',
+        propsKey: 'align',
+    });
+    var justifyContentClass = useDeviceTargetClass(props, {
+        prefix: 'justify-content_',
+        propsKey: 'justifyContent',
+    });
+    var stackingClass = useDeviceTargetClass(props, {
+        prefix: 'group_stacking_',
+        propsKey: 'stacking',
+    });
+    var directionClass = useDeviceTargetClass(props, {
+        prefix: 'group_direction_',
+        propsKey: 'direction',
+    });
+    var wrapClass = useDeviceTargetClass(props, {
+        prefix: 'group_wrap_',
+        propsKey: 'wrap',
+    });
+    var fillClass = useDeviceTargetClass(props, {
+        prefix: 'fill_',
+        propsKey: 'fill',
+    });
+    var fillHoverClass = useDeviceTargetClass(props, {
+        prefix: 'fill_hover_',
+        propsKey: 'fillHover',
+    });
+    var shapeClass = useDeviceTargetClass(props, {
+        prefix: 'group_shape_',
+        propsKey: 'shape',
+    });
+    var columnsClass = useDeviceTargetClass(props, {
+        prefix: 'group_columns_',
+        propsKey: 'columns',
+    });
+    var widthClass = useDeviceTargetClass(props, {
+        prefix: 'width_',
+        propsKey: 'width',
+    });
+    var heightClass = useDeviceTargetClass(props, {
+        prefix: 'height_',
+        propsKey: 'height',
+    });
+    var borderColorClass = useDeviceTargetClass(props, {
+        prefix: 'border-color_',
+        propsKey: 'borderColor',
+    });
+    var borderWidthClass = useDeviceTargetClass(props, {
+        prefix: 'border-width_',
+        propsKey: 'borderWidth',
+    });
+    var borderTypeClass = useDeviceTargetClass(props, {
+        prefix: 'border_type_',
+        propsKey: 'borderType',
+    });
+    var growClass = useDeviceTargetClass(props, {
+        prefix: 'flex-grow_',
+        propsKey: 'flexGrow',
+    });
+    var elevationClass = useDeviceTargetClass(props, {
+        prefix: 'elevation_',
+        propsKey: 'elevation',
+    });
+    // @ts-expect-error
+    var _b = useStyles(props), groupStyles = _b.styles, groupWrapperStyles = _b.wrapper;
+    return (jsxRuntimeExports.jsx(Tag, { className: clsx(className, 'group', widthClass, heightClass, columnsClass, contentAlignClass, alignDirectionClass, directionClass ||
+            (appearance &&
+                groupConfig.appearance[appearance].direction &&
+                "group_direction_".concat(groupConfig.appearance[appearance].direction)
+                    .replace(/([A-Z])/g, '-$1')
+                    .toLowerCase()), alignClass, fillClass ||
+            (appearance &&
+                groupConfig.appearance[appearance].fill &&
+                "fill_".concat(groupConfig.appearance[appearance].fill)
+                    .replace(/([A-Z])/g, '-$1')
+                    .toLowerCase()), fillHoverClass ||
+            (appearance &&
+                groupConfig.appearance[appearance].fillHover &&
+                "fill_hover_".concat(groupConfig.appearance[appearance].fillHover)
+                    .replace(/([A-Z])/g, '-$1')
+                    .toLowerCase()), set && "group_set_".concat(set), horizontalScroll && 'group_type_horizontal_scroll', stackingClass, wrapClass, growClass, shapeClass, borderColorClass ||
+            (appearance &&
+                groupConfig.appearance[appearance].borderColor &&
+                "border-color_".concat(groupConfig.appearance[appearance].borderColor)
+                    .replace(/([A-Z])/g, '-$1')
+                    .toLowerCase()), borderWidthClass ||
+            (appearance &&
+                groupConfig.appearance[appearance].borderWidth &&
+                "border-width_".concat(groupConfig.appearance[appearance].borderWidth)
+                    .replace(/([A-Z])/g, '-$1')
+                    .toLowerCase()), borderTypeClass, elevationClass, justifyContentClass), "data-tour": dataTour, htmlFor: htmlFor, id: id, style: Object.assign({}, groupStyles, style), onClick: onClick, children: horizontalScroll ? (jsxRuntimeExports.jsx("div", { className: "group__wrapper", style: groupWrapperStyles, children: children })) : (children) }));
+}
+Group.defaultProps = {
+    tag: 'div',
+};
+
+export { Group as G, groupConfig as g };

package/dist/ListItem-DYbK4_8c.js

@@ -0,0 +1,479 @@
+import React__default from 'react';
+import PropTypes from 'prop-types';
+import clsx from 'clsx';
+import directionProps from './constants/componentProps/direction.js';
+import fillProps from './constants/componentProps/fill.js';
+import textColorProps from './constants/componentProps/textColor.js';
+import sizeProps from './constants/componentProps/size.js';
+import { useStyles } from './hooks/useStyles.js';
+import { useDeviceTargetClass } from './hooks/useDeviceTargetClass.js';
+import textStyleProps from './constants/componentProps/textStyle.js';
+import textWeightProps from './constants/componentProps/textWeight.js';
+import typeProps from './constants/componentProps/type.js';
+import { Link } from './components/Link.js';
+
+function List(props) {
+  const {
+    children,
+    className,
+    style,
+    type
+  } = props;
+  const sizeClass = useDeviceTargetClass(props, {
+    prefix: 'list_size_',
+    propsKey: 'size'
+  });
+  const bulletSizeClass = useDeviceTargetClass(props, {
+    prefix: 'list_bullet-size_',
+    propsKey: 'bulletSize'
+  });
+  const bulletFillClass = useDeviceTargetClass(props, {
+    prefix: 'list_bullet-fill_',
+    propsKey: 'bulletFill'
+  });
+  const bulletTextColorClass = useDeviceTargetClass(props, {
+    prefix: 'list_bullet-text-color_',
+    propsKey: 'bulletTextColor'
+  });
+  const directionClass = useDeviceTargetClass(props, {
+    prefix: 'list_direction_',
+    propsKey: 'direction'
+  });
+  const {
+    styles: ulStyles
+  } = useStyles(props);
+  return /*#__PURE__*/React__default.createElement("ul", {
+    className: clsx(className, 'list', bulletSizeClass, bulletFillClass, bulletTextColorClass, directionClass, sizeClass, style && `list_style_${style}`, type && `list_type_${type}`),
+    style: ulStyles
+  }, children);
+}
+List.propTypes = {
+  children: PropTypes.any,
+  className: PropTypes.string,
+  bulletFill: PropTypes.oneOf(fillProps),
+  bulletFillDesktop: PropTypes.oneOf(fillProps),
+  bulletFillMobile: PropTypes.oneOf(fillProps),
+  bulletFillTablet: PropTypes.oneOf(fillProps),
+  bulletSize: PropTypes.string,
+  bulletSizeDesktop: PropTypes.string,
+  bulletSizeMobile: PropTypes.string,
+  bulletSizeTablet: PropTypes.string,
+  bulletTextColor: PropTypes.oneOf(textColorProps),
+  bulletTextColorDesktop: PropTypes.oneOf(textColorProps),
+  bulletTextColorMobile: PropTypes.oneOf(textColorProps),
+  bulletTextColorTablet: PropTypes.oneOf(textColorProps),
+  direction: PropTypes.oneOf(directionProps),
+  directionDesktop: PropTypes.oneOf(directionProps),
+  directionMobile: PropTypes.oneOf(directionProps),
+  directionTablet: PropTypes.oneOf(directionProps),
+  size: PropTypes.oneOf(sizeProps),
+  sizeDesktop: PropTypes.oneOf(sizeProps),
+  sizeMobile: PropTypes.oneOf(sizeProps),
+  sizeTablet: PropTypes.oneOf(sizeProps),
+  style: PropTypes.string,
+  type: PropTypes.string,
+  onClick: PropTypes.func
+};
+List.__docgenInfo = {
+  "description": "",
+  "methods": [],
+  "displayName": "List",
+  "props": {
+    "children": {
+      "description": "",
+      "type": {
+        "name": "any"
+      },
+      "required": false
+    },
+    "className": {
+      "description": "",
+      "type": {
+        "name": "string"
+      },
+      "required": false
+    },
+    "bulletFill": {
+      "description": "",
+      "type": {
+        "name": "enum",
+        "computed": true,
+        "value": "fillProps"
+      },
+      "required": false
+    },
+    "bulletFillDesktop": {
+      "description": "",
+      "type": {
+        "name": "enum",
+        "computed": true,
+        "value": "fillProps"
+      },
+      "required": false
+    },
+    "bulletFillMobile": {
+      "description": "",
+      "type": {
+        "name": "enum",
+        "computed": true,
+        "value": "fillProps"
+      },
+      "required": false
+    },
+    "bulletFillTablet": {
+      "description": "",
+      "type": {
+        "name": "enum",
+        "computed": true,
+        "value": "fillProps"
+      },
+      "required": false
+    },
+    "bulletSize": {
+      "description": "",
+      "type": {
+        "name": "string"
+      },
+      "required": false
+    },
+    "bulletSizeDesktop": {
+      "description": "",
+      "type": {
+        "name": "string"
+      },
+      "required": false
+    },
+    "bulletSizeMobile": {
+      "description": "",
+      "type": {
+        "name": "string"
+      },
+      "required": false
+    },
+    "bulletSizeTablet": {
+      "description": "",
+      "type": {
+        "name": "string"
+      },
+      "required": false
+    },
+    "bulletTextColor": {
+      "description": "",
+      "type": {
+        "name": "enum",
+        "computed": true,
+        "value": "textColorProps"
+      },
+      "required": false
+    },
+    "bulletTextColorDesktop": {
+      "description": "",
+      "type": {
+        "name": "enum",
+        "computed": true,
+        "value": "textColorProps"
+      },
+      "required": false
+    },
+    "bulletTextColorMobile": {
+      "description": "",
+      "type": {
+        "name": "enum",
+        "computed": true,
+        "value": "textColorProps"
+      },
+      "required": false
+    },
+    "bulletTextColorTablet": {
+      "description": "",
+      "type": {
+        "name": "enum",
+        "computed": true,
+        "value": "textColorProps"
+      },
+      "required": false
+    },
+    "direction": {
+      "description": "",
+      "type": {
+        "name": "enum",
+        "computed": true,
+        "value": "directionProps"
+      },
+      "required": false
+    },
+    "directionDesktop": {
+      "description": "",
+      "type": {
+        "name": "enum",
+        "computed": true,
+        "value": "directionProps"
+      },
+      "required": false
+    },
+    "directionMobile": {
+      "description": "",
+      "type": {
+        "name": "enum",
+        "computed": true,
+        "value": "directionProps"
+      },
+      "required": false
+    },
+    "directionTablet": {
+      "description": "",
+      "type": {
+        "name": "enum",
+        "computed": true,
+        "value": "directionProps"
+      },
+      "required": false
+    },
+    "size": {
+      "description": "",
+      "type": {
+        "name": "enum",
+        "computed": true,
+        "value": "sizeProps"
+      },
+      "required": false
+    },
+    "sizeDesktop": {
+      "description": "",
+      "type": {
+        "name": "enum",
+        "computed": true,
+        "value": "sizeProps"
+      },
+      "required": false
+    },
+    "sizeMobile": {
+      "description": "",
+      "type": {
+        "name": "enum",
+        "computed": true,
+        "value": "sizeProps"
+      },
+      "required": false
+    },
+    "sizeTablet": {
+      "description": "",
+      "type": {
+        "name": "enum",
+        "computed": true,
+        "value": "sizeProps"
+      },
+      "required": false
+    },
+    "style": {
+      "description": "",
+      "type": {
+        "name": "string"
+      },
+      "required": false
+    },
+    "type": {
+      "description": "",
+      "type": {
+        "name": "string"
+      },
+      "required": false
+    },
+    "onClick": {
+      "description": "",
+      "type": {
+        "name": "func"
+      },
+      "required": false
+    }
+  }
+};
+
+function ListItem(props) {
+  const {
+    after,
+    before,
+    children,
+    className,
+    fill,
+    href,
+    link,
+    text,
+    textColor,
+    textStyle,
+    textWeight
+  } = props;
+  const {
+    styles: liStyles,
+    link: linkStyles
+  } = useStyles(props);
+  if (link) {
+    return /*#__PURE__*/React__default.createElement("li", {
+      className: clsx(className, 'list__item', 'list__item_type_link', textStyle && `text text-style_${textStyle}`, textWeight && `text text-weight_${textWeight}`, textColor && `text-color_${textColor.replace(/([A-Z])/g, '-$1').toLowerCase()}`, fill && `fill_${fill.replace(/([A-Z])/g, '-$1').toLowerCase()}`),
+      style: liStyles
+    }, /*#__PURE__*/React__default.createElement(Link, {
+      href: link || href,
+      className: clsx('list__item-link'),
+      style: linkStyles
+    }, children || text));
+  }
+  return /*#__PURE__*/React__default.createElement("li", {
+    className: clsx(className, 'list__item', textStyle && `text text-style_${textStyle}`, textWeight && `text text-weight_${textWeight}`, textColor && `text-color_${textColor.replace(/([A-Z])/g, '-$1').toLowerCase()}`, fill && `fill_${fill.replace(/([A-Z])/g, '-$1').toLowerCase()}`),
+    style: liStyles
+  }, before, children || text, after);
+}
+ListItem.propTypes = {
+  after: PropTypes.any,
+  before: PropTypes.any,
+  children: PropTypes.any,
+  className: PropTypes.string,
+  href: PropTypes.string,
+  link: PropTypes.string,
+  fill: PropTypes.oneOf(fillProps),
+  fillDesktop: PropTypes.oneOf(fillProps),
+  fillMobile: PropTypes.oneOf(fillProps),
+  fillTablet: PropTypes.oneOf(fillProps),
+  type: PropTypes.oneOf(typeProps),
+  text: PropTypes.string,
+  textColor: PropTypes.oneOf(textColorProps),
+  textWeight: PropTypes.oneOf(textWeightProps),
+  textStyle: PropTypes.oneOf(textStyleProps),
+  onClick: PropTypes.func
+};
+ListItem.__docgenInfo = {
+  "description": "",
+  "methods": [],
+  "displayName": "ListItem",
+  "props": {
+    "after": {
+      "description": "",
+      "type": {
+        "name": "any"
+      },
+      "required": false
+    },
+    "before": {
+      "description": "",
+      "type": {
+        "name": "any"
+      },
+      "required": false
+    },
+    "children": {
+      "description": "",
+      "type": {
+        "name": "any"
+      },
+      "required": false
+    },
+    "className": {
+      "description": "",
+      "type": {
+        "name": "string"
+      },
+      "required": false
+    },
+    "href": {
+      "description": "",
+      "type": {
+        "name": "string"
+      },
+      "required": false
+    },
+    "link": {
+      "description": "",
+      "type": {
+        "name": "string"
+      },
+      "required": false
+    },
+    "fill": {
+      "description": "",
+      "type": {
+        "name": "enum",
+        "computed": true,
+        "value": "fillProps"
+      },
+      "required": false
+    },
+    "fillDesktop": {
+      "description": "",
+      "type": {
+        "name": "enum",
+        "computed": true,
+        "value": "fillProps"
+      },
+      "required": false
+    },
+    "fillMobile": {
+      "description": "",
+      "type": {
+        "name": "enum",
+        "computed": true,
+        "value": "fillProps"
+      },
+      "required": false
+    },
+    "fillTablet": {
+      "description": "",
+      "type": {
+        "name": "enum",
+        "computed": true,
+        "value": "fillProps"
+      },
+      "required": false
+    },
+    "type": {
+      "description": "",
+      "type": {
+        "name": "enum",
+        "computed": true,
+        "value": "typeProps"
+      },
+      "required": false
+    },
+    "text": {
+      "description": "",
+      "type": {
+        "name": "string"
+      },
+      "required": false
+    },
+    "textColor": {
+      "description": "",
+      "type": {
+        "name": "enum",
+        "computed": true,
+        "value": "textColorProps"
+      },
+      "required": false
+    },
+    "textWeight": {
+      "description": "",
+      "type": {
+        "name": "enum",
+        "computed": true,
+        "value": "textWeightProps"
+      },
+      "required": false
+    },
+    "textStyle": {
+      "description": "",
+      "type": {
+        "name": "enum",
+        "computed": true,
+        "value": "textStyleProps"
+      },
+      "required": false
+    },
+    "onClick": {
+      "description": "",
+      "type": {
+        "name": "func"
+      },
+      "required": false
+    }
+  }
+};
+
+export { List as L, ListItem as a };