@itcase/ui 1.0.64 → 1.0.66

package/dist/components/Chips.js

@@ -45,7 +45,8 @@ function Chips(props) {
     labelSize,
     labelTextColor,
     labelTextWeight,
-    type
+    type,
+    onClick
   } = props;
   const alignDirectionClass = useDeviceTargetClass.useDeviceTargetClass(props, {
     prefix: 'align_',
@@ -84,7 +85,8 @@ function Chips(props) {
   } = useStyles.useStyles(props);
   return /*#__PURE__*/React__default.default.createElement("div", {
     className: clsx__default.default(className, 'chips', fillClass || chipsConfig.appearance[appearance] && `fill_${chipsConfig.appearance[appearance].fillClass}`.replace(/([A-Z])/g, '-$1').toLowerCase(), fillHoverClass || chipsConfig.appearance[appearance] && `fill_hover_${chipsConfig.appearance[appearance].fillHoverClass}`.replace(/([A-Z])/g, '-$1').toLowerCase(), shapeClass, borderClass, borderTypeClass, sizeClass, alignDirectionClass, alignClass, type && `chips_type_${type}`),
-    style: chipsStyles
+    style: chipsStyles,
+    onClick: onClick
   }, /*#__PURE__*/React__default.default.createElement("div", {
     className: "chips__inner"
   }, typeof label === 'string' ? /*#__PURE__*/React__default.default.createElement(index.Text, {

package/dist/components/Page.js

@@ -0,0 +1,114 @@
+'use strict';
+
+var React = require('react');
+var PropTypes = require('prop-types');
+var clsx = require('clsx');
+var alignDirection = require('../constants/componentProps/alignDirection.js');
+var align = require('../constants/componentProps/align.js');
+var fill = require('../constants/componentProps/fill.js');
+var horizontalResizeMode = require('../constants/componentProps/horizontalResizeMode.js');
+var position = require('../constants/componentProps/position.js');
+var verticalResizeMode = require('../constants/componentProps/verticalResizeMode.js');
+var useDeviceTargetClass = require('../hooks/useDeviceTargetClass.js');
+var useStyles = require('../hooks/useStyles.js');
+require('lodash/castArray');
+require('lodash/camelCase');
+require('../context/UIContext.js');
+require('../hooks/useMediaQueries.js');
+require('react-responsive');
+require('lodash/maxBy');
+require('lodash/upperFirst');
+require('../hooks/styleAttributes.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 Page(props) {
+  const {
+    after,
+    before,
+    children,
+    className,
+    id,
+    tag: Tag,
+    type
+  } = props;
+  const alignDirectionClass = useDeviceTargetClass.useDeviceTargetClass(props, {
+    prefix: 'align_',
+    propsKey: 'alignDirection'
+  });
+  const alignClass = useDeviceTargetClass.useDeviceTargetClass(props, {
+    prefix: 'align_',
+    propsKey: 'align'
+  });
+  const resizeHorizontalClass = useDeviceTargetClass.useDeviceTargetClass(props, {
+    prefix: 'wrapper_resize-horizontal_',
+    propsKey: 'horizontalResizing'
+  });
+  const resizeVerticalClass = useDeviceTargetClass.useDeviceTargetClass(props, {
+    prefix: 'wrapper_resize-vertical_',
+    propsKey: 'verticalResizing'
+  });
+  const fillClass = useDeviceTargetClass.useDeviceTargetClass(props, {
+    prefix: 'fill_',
+    propsKey: 'fill'
+  });
+  const positionClass = useDeviceTargetClass.useDeviceTargetClass(props, {
+    prefix: 'position_',
+    propsKey: 'position'
+  });
+  const {
+    styles,
+    wrapper: wrapperStyles
+  } = useStyles.useStyles(props);
+  return /*#__PURE__*/React__default.default.createElement("div", {
+    id: id,
+    className: clsx__default.default('page', className, type && `${className}_type_${type}`, fillClass, resizeHorizontalClass, resizeVerticalClass, positionClass),
+    style: styles
+  }, /*#__PURE__*/React__default.default.createElement("div", {
+    className: clsx__default.default('page__wrapper', alignDirectionClass, alignClass, 'content'),
+    style: wrapperStyles
+  }, before, children, after));
+}
+Page.propTypes = {
+  children: PropTypes__default.default.any,
+  className: PropTypes__default.default.string,
+  before: PropTypes__default.default.string,
+  after: PropTypes__default.default.string,
+  id: PropTypes__default.default.string,
+  fill: PropTypes__default.default.oneOf(fill.default),
+  fillMobile: PropTypes__default.default.oneOf(fill.default),
+  fillTablet: PropTypes__default.default.oneOf(fill.default),
+  fillDesktop: PropTypes__default.default.oneOf(fill.default),
+  type: PropTypes__default.default.string,
+  tag: PropTypes__default.default.string,
+  position: PropTypes__default.default.oneOf(position.default),
+  positionMobile: PropTypes__default.default.oneOf(position.default),
+  positionTablet: PropTypes__default.default.oneOf(position.default),
+  positionDesktop: PropTypes__default.default.oneOf(position.default),
+  wrapperPosition: PropTypes__default.default.oneOf(position.default),
+  wrapperPositionMobile: PropTypes__default.default.oneOf(position.default),
+  wrapperPositionTablet: PropTypes__default.default.oneOf(position.default),
+  wrapperPositionDesktop: PropTypes__default.default.oneOf(position.default),
+  horizontalResizing: PropTypes__default.default.oneOf(horizontalResizeMode.default),
+  horizontalResizingMobile: PropTypes__default.default.oneOf(horizontalResizeMode.default),
+  horizontalResizingTablet: PropTypes__default.default.oneOf(horizontalResizeMode.default),
+  horizontalResizingDesktop: PropTypes__default.default.oneOf(horizontalResizeMode.default),
+  verticalResizing: PropTypes__default.default.oneOf(verticalResizeMode.default),
+  verticalResizingMobile: PropTypes__default.default.oneOf(verticalResizeMode.default),
+  verticalResizingTablet: PropTypes__default.default.oneOf(verticalResizeMode.default),
+  verticalResizingDesktop: PropTypes__default.default.oneOf(verticalResizeMode.default),
+  align: PropTypes__default.default.oneOf(align.default),
+  alignMobile: PropTypes__default.default.oneOf(align.default),
+  alignTablet: PropTypes__default.default.oneOf(align.default),
+  alignDesktop: PropTypes__default.default.oneOf(align.default),
+  alignDirection: PropTypes__default.default.oneOf(alignDirection.default),
+  alignDirectionMobile: PropTypes__default.default.oneOf(alignDirection.default),
+  alignDirectionTablet: PropTypes__default.default.oneOf(alignDirection.default),
+  alignDirectionDesktop: PropTypes__default.default.oneOf(alignDirection.default)
+};
+
+exports.Page = Page;

package/dist/css/components/Page/Page.css

@@ -0,0 +1,8 @@
+.page {
+  width: 100%;
+  &__wrapper {
+    width: 100%;
+    max-width: var(--max);
+    margin: 0 auto;
+  }
+}

package/package.json

@@ -1,6 +1,6 @@
 {
   "name": "@itcase/ui",
-  "version": "1.0.64",
+  "version": "1.0.66",
   "description": "UI components (Modal, Loader, Popup, etc)",
   "keywords": [
     "Modal",
@@ -63,7 +63,7 @@
     "uuid": "^9.0.1"
   },
   "devDependencies": {
-    "@babel/core": "^7.22.20",
+    "@babel/core": "^7.23.0",
     "@babel/eslint-parser": "^7.22.15",
     "@babel/preset-env": "^7.22.20",
     "@babel/preset-react": "^7.22.15",
@@ -80,7 +80,7 @@
     "babel-loader": "^9.1.3",
     "babel-plugin-inline-react-svg": "^2.0.2",
     "babel-plugin-transform-react-remove-prop-types": "^0.4.24",
-    "eslint": "8.49.0",
+    "eslint": "8.50.0",
     "eslint-config-prettier": "^9.0.0",
     "eslint-config-standard": "^17.1.0",
     "eslint-plugin-babel": "^5.3.1",
@@ -119,9 +119,9 @@
     "postcss-sort-media-queries": "^5.2.0",
     "prettier": "^3.0.3",
     "react-datepicker": "^4.18.0",
-    "rollup": "^3.29.2",
+    "rollup": "^3.29.3",
     "rollup-plugin-peer-deps-external": "^2.2.4",
-    "semantic-release": "^22.0.1",
+    "semantic-release": "^22.0.5",
     "stylelint": "^15.10.3",
     "stylelint-config-standard": "^34.0.0",
     "stylelint-no-unsupported-browser-features": "^7.0.0",