pallote-react 0.2.27 → 0.2.30

package/dist/components/Button.js

@@ -37,19 +37,19 @@ const Button = _ref => {
   }
   return /*#__PURE__*/_react.default.createElement(Component, _extends({
     className: (0, _classnames.default)(['button', {
-      ["button--".concat(size)]: size,
-      ["button--".concat(color)]: color,
-      ["button--".concat(kind)]: kind,
-      ["button--".concat(variant)]: variant,
-      'button--fullWidth': fullWidth,
-      'button--disabled': disabled
+      ["button-".concat(size)]: size,
+      ["button-".concat(color)]: color,
+      ["button-".concat(kind)]: kind,
+      ["button-".concat(variant)]: variant,
+      'button-fullWidth': fullWidth,
+      'button-disabled': disabled
     }, className]),
     disabled: disabled
   }, props), content);
 };
 exports.Button = Button;
 Button.propTypes = {
-  color: _propTypes.default.oneOf(['black', 'white', 'grey', 'primary', 'secondary', 'highlight', 'success', 'info', 'warning', 'error', 'default', 'contrast']),
+  color: _propTypes.default.oneOf(['primary', 'secondary', 'grey', 'success', 'info', 'warning', 'error', 'main', 'contrast']),
   size: _propTypes.default.oneOf(['xs', 'sm', 'md', 'lg']),
   kind: _propTypes.default.oneOf(['text', 'icon']),
   variant: _propTypes.default.oneOf(['fill', 'stroke', 'transparent']),

package/dist/components/Buttons.js

@@ -8,7 +8,7 @@ exports.Buttons = void 0;
 var _react = _interopRequireDefault(require("react"));
 var _classnames = _interopRequireDefault(require("classnames"));
 var _propTypes = _interopRequireDefault(require("prop-types"));
-const _excluded = ["direction", "spacing", "className", "children"];
+const _excluded = ["direction", "fullWidth", "wide", "className", "children"];
 function _interopRequireDefault(obj) { return obj && obj.__esModule ? obj : { default: obj }; }
 function _extends() { _extends = Object.assign ? Object.assign.bind() : function (target) { for (var i = 1; i < arguments.length; i++) { var source = arguments[i]; for (var key in source) { if (Object.prototype.hasOwnProperty.call(source, key)) { target[key] = source[key]; } } } return target; }; return _extends.apply(this, arguments); }
 function _objectWithoutProperties(source, excluded) { if (source == null) return {}; var target = _objectWithoutPropertiesLoose(source, excluded); var key, i; if (Object.getOwnPropertySymbols) { var sourceSymbolKeys = Object.getOwnPropertySymbols(source); for (i = 0; i < sourceSymbolKeys.length; i++) { key = sourceSymbolKeys[i]; if (excluded.indexOf(key) >= 0) continue; if (!Object.prototype.propertyIsEnumerable.call(source, key)) continue; target[key] = source[key]; } } return target; }
@@ -16,26 +16,28 @@ function _objectWithoutPropertiesLoose(source, excluded) { if (source == null) r
 const Buttons = _ref => {
   let {
       direction,
-      spacing,
+      fullWidth,
+      wide,
       className,
       children
     } = _ref,
     props = _objectWithoutProperties(_ref, _excluded);
   return /*#__PURE__*/_react.default.createElement("div", _extends({
     className: (0, _classnames.default)(['buttons', {
-      ["buttons--".concat(direction)]: direction,
-      ["buttons--".concat(spacing)]: spacing
+      ["buttons-".concat(direction)]: direction,
+      'buttons-fullWidth': fullWidth,
+      'buttons-wide': wide
     }, className])
   }, props), children);
 };
 exports.Buttons = Buttons;
 Buttons.propTypes = {
   direction: _propTypes.default.oneOf(['landscape', 'portrait']),
-  spacing: _propTypes.default.oneOf(['sm', 'md', 'lg']),
+  fullWidth: _propTypes.default.bool,
+  wide: _propTypes.default.bool,
   className: _propTypes.default.node,
   children: _propTypes.default.oneOfType([_propTypes.default.array, _propTypes.default.object])
 };
 Buttons.defaultProps = {
-  direction: 'landscape',
-  spacing: 'md'
+  direction: 'landscape'
 };

package/dist/components/Card.js

@@ -10,7 +10,7 @@ exports.SizeContext = exports.PaddingContext = exports.DirectionContext = export
 var _react = _interopRequireWildcard(require("react"));
 var _classnames = _interopRequireDefault(require("classnames"));
 var _propTypes = _interopRequireDefault(require("prop-types"));
-var _Layer = require("./Layer");
+var _Color = require("./Color");
 const _excluded = ["size", "fill", "direction", "align", "noPadding", "hasShadow", "transparent", "className", "children"];
 function _interopRequireDefault(obj) { return obj && obj.__esModule ? obj : { default: obj }; }
 function _getRequireWildcardCache(e) { if ("function" != typeof WeakMap) return null; var r = new WeakMap(), t = new WeakMap(); return (_getRequireWildcardCache = function _getRequireWildcardCache(e) { return e ? t : r; })(e); }
@@ -40,7 +40,7 @@ const Card = _ref => {
     value: noPadding
   }, /*#__PURE__*/_react.default.createElement(DirectionContext.Provider, {
     value: direction
-  }, /*#__PURE__*/_react.default.createElement(_Layer.Layer, _extends({
+  }, /*#__PURE__*/_react.default.createElement(_Color.Color, _extends({
     className: (0, _classnames.default)(['card', {
       ["card--".concat(size)]: size,
       ["card--".concat(direction)]: direction,
@@ -54,7 +54,7 @@ const Card = _ref => {
 exports.Card = Card;
 Card.propTypes = {
   size: _propTypes.default.oneOf(['xs', 'sm', 'md', 'lg', 'xl']),
-  fill: _propTypes.default.oneOf(['black', 'white', 'background', 'paper', 'primary', 'secondary', 'highlight', 'success', 'info', 'warning', 'error']),
+  fill: _propTypes.default.oneOf(['black', 'white', 'background', 'paper', 'primary', 'secondary', 'success', 'info', 'warning', 'error']),
   direction: _propTypes.default.oneOf(['portrait', 'landscape']),
   align: _propTypes.default.oneOf(['left', 'center', 'right']),
   noPadding: _propTypes.default.bool,

package/dist/components/Chip.js

@@ -9,7 +9,7 @@ var _react = _interopRequireDefault(require("react"));
 var _classnames = _interopRequireDefault(require("classnames"));
 var _propTypes = _interopRequireDefault(require("prop-types"));
 var _react2 = require("@phosphor-icons/react");
-var _Layer = require("./Layer");
+var _Color = require("./Color");
 const _excluded = ["color", "dense", "avatar", "disabled", "onClose", "className", "children"];
 function _interopRequireDefault(obj) { return obj && obj.__esModule ? obj : { default: obj }; }
 function _extends() { _extends = Object.assign ? Object.assign.bind() : function (target) { for (var i = 1; i < arguments.length; i++) { var source = arguments[i]; for (var key in source) { if (Object.prototype.hasOwnProperty.call(source, key)) { target[key] = source[key]; } } } return target; }; return _extends.apply(this, arguments); }
@@ -26,7 +26,7 @@ const Chip = _ref => {
       children
     } = _ref,
     props = _objectWithoutProperties(_ref, _excluded);
-  return /*#__PURE__*/_react.default.createElement(_Layer.Layer, _extends({
+  return /*#__PURE__*/_react.default.createElement(_Color.Color, _extends({
     className: (0, _classnames.default)(['chip', {
       'chip--dense': dense,
       'chip--disabled': disabled
@@ -44,7 +44,7 @@ const Chip = _ref => {
 };
 exports.Chip = Chip;
 Chip.propTypes = {
-  color: _propTypes.default.oneOf(['paper', 'primary', 'secondary', 'highlight', 'success', 'info', 'warning', 'error']),
+  color: _propTypes.default.oneOf(['paper', 'primary', 'secondary', 'success', 'info', 'warning', 'error']),
   dense: _propTypes.default.bool,
   avatar: _propTypes.default.node,
   disabled: _propTypes.default.bool,

package/dist/components/Link.js

@@ -33,7 +33,7 @@ const Link = _ref => {
 exports.Link = Link;
 Link.propTypes = {
   icon: _propTypes.default.node,
-  color: _propTypes.default.oneOf(['default', 'alt', 'disabled', 'contrast', 'contrastAlt', 'contrastDisabled', 'primary', 'secondary', 'highlight', 'success', 'info', 'warning', 'error']),
+  color: _propTypes.default.oneOf(['default', 'alt', 'disabled', 'contrast', 'contrastAlt', 'contrastDisabled', 'primary', 'secondary', 'success', 'info', 'warning', 'error']),
   className: _propTypes.default.node,
   children: _propTypes.default.string
 };

package/dist/components/Paragraph.js

@@ -43,7 +43,7 @@ Paragraph.propTypes = {
   weight: _propTypes.default.oneOf(['light', 'regular', 'bold']),
   underline: _propTypes.default.bool,
   italic: _propTypes.default.bool,
-  color: _propTypes.default.oneOf(['default', 'alt', 'disabled', 'contrast', 'contrastAlt', 'contrastDisabled', 'primary', 'secondary', 'highlight', 'success', 'info', 'warning', 'error']),
+  color: _propTypes.default.oneOf(['default', 'alt', 'disabled', 'contrast', 'contrastAlt', 'contrastDisabled', 'primary', 'secondary', 'success', 'info', 'warning', 'error']),
   className: _propTypes.default.node,
   children: _propTypes.default.any
 };

package/dist/components/Tag.js

@@ -31,7 +31,7 @@ const Tag = _ref => {
 };
 exports.Tag = Tag;
 Tag.propTypes = {
-  color: _propTypes.default.oneOf(['primary', 'secondary', 'highlight', 'grey', 'success', 'info', 'warning', 'error']),
+  color: _propTypes.default.oneOf(['primary', 'secondary', 'grey', 'success', 'info', 'warning', 'error']),
   dense: _propTypes.default.bool,
   className: _propTypes.default.node,
   children: _propTypes.default.string

package/dist/index.js

@@ -87,6 +87,18 @@ Object.defineProperty(exports, "Chip", {
     return _Chip.Chip;
   }
 });
+Object.defineProperty(exports, "Color", {
+  enumerable: true,
+  get: function get() {
+    return _Color.Color;
+  }
+});
+Object.defineProperty(exports, "Display", {
+  enumerable: true,
+  get: function get() {
+    return _Display.Display;
+  }
+});
 Object.defineProperty(exports, "Divider", {
   enumerable: true,
   get: function get() {
@@ -105,12 +117,6 @@ Object.defineProperty(exports, "Input", {
     return _Input.Input;
   }
 });
-Object.defineProperty(exports, "Layer", {
-  enumerable: true,
-  get: function get() {
-    return _Layer.Layer;
-  }
-});
 Object.defineProperty(exports, "Link", {
   enumerable: true,
   get: function get() {
@@ -321,6 +327,9 @@ Object.defineProperty(exports, "Tooltip", {
     return _Tooltip.Tooltip;
   }
 });
+var _Color = require("./utilities/Color");
+var _Display = require("./utilities/Display");
+var _Text = require("./utilities/Text");
 var _Accordion = require("./components/Accordion");
 var _AccordionItem = require("./components/AccordionItem");
 var _Alert = require("./components/Alert");
@@ -338,7 +347,6 @@ var _Checkboxes = require("./components/Checkboxes");
 var _Chip = require("./components/Chip");
 var _Divider = require("./components/Divider");
 var _Input = require("./components/Input");
-var _Layer = require("./components/Layer");
 var _Link = require("./components/Link");
 var _List = require("./components/List");
 var _ListItem = require("./components/ListItem");
@@ -371,6 +379,5 @@ var _Tabs = require("./components/Tabs");
 var _TabsContent = require("./components/TabsContent");
 var _TabsControl = require("./components/TabsControl");
 var _Tag = require("./components/Tag");
-var _Text = require("./components/Text");
 var _Textarea = require("./components/Textarea");
 var _Tooltip = require("./components/Tooltip");

package/dist/index.scss

@@ -5,4 +5,4 @@ $icons-path: '~/public/icons/';
 
 .snippet__wrapper {
   width: 100%;
-}
+}

package/dist/{components/Layer.js → utilities/Color.js}

@@ -1,16 +1,14 @@
 "use strict";
 
-require("core-js/modules/es.object.assign.js");
 Object.defineProperty(exports, "__esModule", {
   value: true
 });
-exports.Layer = void 0;
+exports.Color = void 0;
 var _react = _interopRequireDefault(require("react"));
 var _classnames = _interopRequireDefault(require("classnames"));
 var _propTypes = _interopRequireDefault(require("prop-types"));
-const _excluded = ["fill", "stroke", "customFill", "customStroke", "hasHover", "className", "children"];
+const _excluded = ["fill", "stroke", "customFill", "customStroke", "className", "children"];
 function _interopRequireDefault(obj) { return obj && obj.__esModule ? obj : { default: obj }; }
-function _extends() { _extends = Object.assign ? Object.assign.bind() : function (target) { for (var i = 1; i < arguments.length; i++) { var source = arguments[i]; for (var key in source) { if (Object.prototype.hasOwnProperty.call(source, key)) { target[key] = source[key]; } } } return target; }; return _extends.apply(this, arguments); }
 function ownKeys(e, r) { var t = Object.keys(e); if (Object.getOwnPropertySymbols) { var o = Object.getOwnPropertySymbols(e); r && (o = o.filter(function (r) { return Object.getOwnPropertyDescriptor(e, r).enumerable; })), t.push.apply(t, o); } return t; }
 function _objectSpread(e) { for (var r = 1; r < arguments.length; r++) { var t = null != arguments[r] ? arguments[r] : {}; r % 2 ? ownKeys(Object(t), !0).forEach(function (r) { _defineProperty(e, r, t[r]); }) : Object.getOwnPropertyDescriptors ? Object.defineProperties(e, Object.getOwnPropertyDescriptors(t)) : ownKeys(Object(t)).forEach(function (r) { Object.defineProperty(e, r, Object.getOwnPropertyDescriptor(t, r)); }); } return e; }
 function _defineProperty(obj, key, value) { key = _toPropertyKey(key); if (key in obj) { Object.defineProperty(obj, key, { value: value, enumerable: true, configurable: true, writable: true }); } else { obj[key] = value; } return obj; }
@@ -18,38 +16,36 @@ function _toPropertyKey(t) { var i = _toPrimitive(t, "string"); return "symbol"
 function _toPrimitive(t, r) { if ("object" != typeof t || !t) return t; var e = t[Symbol.toPrimitive]; if (void 0 !== e) { var i = e.call(t, r || "default"); if ("object" != typeof i) return i; throw new TypeError("@@toPrimitive must return a primitive value."); } return ("string" === r ? String : Number)(t); }
 function _objectWithoutProperties(source, excluded) { if (source == null) return {}; var target = _objectWithoutPropertiesLoose(source, excluded); var key, i; if (Object.getOwnPropertySymbols) { var sourceSymbolKeys = Object.getOwnPropertySymbols(source); for (i = 0; i < sourceSymbolKeys.length; i++) { key = sourceSymbolKeys[i]; if (excluded.indexOf(key) >= 0) continue; if (!Object.prototype.propertyIsEnumerable.call(source, key)) continue; target[key] = source[key]; } } return target; }
 function _objectWithoutPropertiesLoose(source, excluded) { if (source == null) return {}; var target = {}; for (var key in source) { if (Object.prototype.hasOwnProperty.call(source, key)) { if (excluded.indexOf(key) >= 0) continue; target[key] = source[key]; } } return target; }
-const Layer = _ref => {
+const Color = _ref => {
   let {
       fill,
       stroke,
       customFill,
       customStroke,
-      hasHover,
       className,
       children
     } = _ref,
     props = _objectWithoutProperties(_ref, _excluded);
   const style = _objectSpread(_objectSpread({}, customFill ? {
-    backgroundColor: "".concat(customFill)
+    backgroundColor: customFill
   } : {}), customStroke ? {
     border: "1px solid ".concat(customStroke)
   } : {});
-  return /*#__PURE__*/_react.default.createElement("div", _extends({
-    style: style,
-    className: (0, _classnames.default)(['layer', {
-      ["fill--".concat(fill)]: fill,
-      ["stroke--".concat(stroke)]: stroke,
-      'layer--hover': hasHover
-    }, className])
-  }, props), children);
+  const childClassName = (0, _classnames.default)(children.props.className, className, {
+    ["fill-".concat(fill)]: fill,
+    ["stroke-".concat(stroke)]: stroke
+  });
+  return /*#__PURE__*/_react.default.cloneElement(children, _objectSpread({
+    className: childClassName,
+    style: _objectSpread(_objectSpread({}, children.props.style), style)
+  }, props));
 };
-exports.Layer = Layer;
-Layer.propTypes = {
-  fill: _propTypes.default.oneOf(['black', 'white', 'background', 'paper', 'grey90', 'grey80', 'grey70', 'grey60', 'grey50', 'grey40', 'grey30', 'grey20', 'grey10', 'grey5', 'primary', 'secondary', 'highlight', 'success', 'info', 'warning', 'error']),
-  stroke: _propTypes.default.oneOf(['black', 'white', 'background', 'paper', 'grey-90', 'grey-80', 'grey-70', 'grey-60', 'grey-50', 'grey-40', 'grey-30', 'grey-20', 'grey-10', 'grey-5', 'primary', 'secondary', 'highlight', 'success', 'info', 'warning', 'error']),
+exports.Color = Color;
+Color.propTypes = {
+  fill: _propTypes.default.oneOf(['main', 'contrast', 'grey90', 'grey80', 'grey70', 'grey60', 'grey50', 'grey40', 'grey30', 'grey20', 'grey10', 'grey5', 'default', 'paper', 'primary', 'secondary', 'success', 'info', 'warning', 'error']),
+  stroke: _propTypes.default.oneOf(['main', 'contrast', 'grey90', 'grey80', 'grey70', 'grey60', 'grey50', 'grey40', 'grey30', 'grey20', 'grey10', 'grey5', 'default', 'paper', 'primary', 'secondary', 'success', 'info', 'warning', 'error']),
   customFill: _propTypes.default.string,
   customStroke: _propTypes.default.string,
-  hasHover: _propTypes.default.bool,
-  className: _propTypes.default.node,
-  children: _propTypes.default.any
+  className: _propTypes.default.string,
+  children: _propTypes.default.element.isRequired
 };

package/dist/{components → utilities}/Display.js

@@ -26,11 +26,17 @@ const Display = _ref => {
   } = _ref;
   const [isDisplayed, setDisplayed] = (0, _react.useState)(false);
   const updateMedia = () => {
-    const viewportValue = viewportSizes[show || hide];
-    if (show) {
-      setDisplayed(window.innerWidth <= viewportValue);
-    } else if (hide) {
-      setDisplayed(window.innerWidth > viewportValue);
+    if (show === 'touch') {
+      setDisplayed(navigator.maxTouchPoints > 0);
+    } else if (hide === 'touch') {
+      setDisplayed(navigator.maxTouchPoints === 0);
+    } else {
+      const viewportValue = viewportSizes[show || hide];
+      if (show) {
+        setDisplayed(window.innerWidth <= viewportValue);
+      } else if (hide) {
+        setDisplayed(window.innerWidth > viewportValue);
+      }
     }
   };
   (0, _react.useEffect)(() => {

package/dist/{components → utilities}/Text.js

@@ -8,7 +8,7 @@ exports.Text = void 0;
 var _react = _interopRequireDefault(require("react"));
 var _classnames = _interopRequireDefault(require("classnames"));
 var _propTypes = _interopRequireDefault(require("prop-types"));
-const _excluded = ["variant", "align", "weight", "transform", "underline", "italic", "code", "color", "component", "className", "children"];
+const _excluded = ["variant", "align", "weight", "transform", "italic", "underline", "strikeThrough", "code", "color", "component", "className", "children"];
 function _interopRequireDefault(obj) { return obj && obj.__esModule ? obj : { default: obj }; }
 function _extends() { _extends = Object.assign ? Object.assign.bind() : function (target) { for (var i = 1; i < arguments.length; i++) { var source = arguments[i]; for (var key in source) { if (Object.prototype.hasOwnProperty.call(source, key)) { target[key] = source[key]; } } } return target; }; return _extends.apply(this, arguments); }
 function _objectWithoutProperties(source, excluded) { if (source == null) return {}; var target = _objectWithoutPropertiesLoose(source, excluded); var key, i; if (Object.getOwnPropertySymbols) { var sourceSymbolKeys = Object.getOwnPropertySymbols(source); for (i = 0; i < sourceSymbolKeys.length; i++) { key = sourceSymbolKeys[i]; if (excluded.indexOf(key) >= 0) continue; if (!Object.prototype.propertyIsEnumerable.call(source, key)) continue; target[key] = source[key]; } } return target; }
@@ -19,8 +19,9 @@ const Text = _ref => {
       align,
       weight,
       transform,
-      underline,
       italic,
+      underline,
+      strikeThrough,
       code,
       color,
       component,
@@ -32,13 +33,14 @@ const Text = _ref => {
   return /*#__PURE__*/_react.default.createElement(Component, _extends({
     className: (0, _classnames.default)(['text', {
       ["".concat(variant)]: variant,
-      ["text--".concat(align)]: align,
-      ["text--".concat(weight)]: weight,
-      ["text--".concat(transform)]: transform,
-      ["text--".concat(color)]: color,
-      'text--underline': underline,
-      'text--italic': italic,
-      'text--code': code
+      ["text-".concat(align)]: align,
+      ["text-".concat(weight)]: weight,
+      ["text-".concat(transform)]: transform,
+      ["text-".concat(color)]: color,
+      'text-italic': italic,
+      'text-underline': underline,
+      'text-strikeThrough': strikeThrough,
+      'text-code': code
     }, className])
   }, props), children);
 };
@@ -46,18 +48,17 @@ exports.Text = Text;
 Text.propTypes = {
   variant: _propTypes.default.oneOf(['h1', 'h2', 'h3', 'h4', 'h5', 'h6', 'subtitle', 'body', 'caption', 'overline']),
   align: _propTypes.default.oneOf(['left', 'center', 'right', 'justify']),
-  weight: _propTypes.default.oneOf(['light', 'regular', 'bold']),
+  weight: _propTypes.default.oneOf(['regular', 'bold']),
   transform: _propTypes.default.oneOf(['none', 'capitalize', 'uppercase', 'lowercase', 'initial', 'inherit']),
-  underline: _propTypes.default.bool,
   italic: _propTypes.default.bool,
+  underline: _propTypes.default.bool,
+  strikeThrough: _propTypes.default.bool,
   code: _propTypes.default.bool,
-  color: _propTypes.default.oneOf(['default', 'alt', 'disabled', 'contrast', 'contrastAlt', 'contrastDisabled', 'primary', 'secondary', 'highlight', 'success', 'info', 'warning', 'error']),
+  color: _propTypes.default.oneOf(['default', 'alt', 'disabled', 'contrast', 'contrastAlt', 'contrastDisabled', 'primary', 'secondary', 'success', 'info', 'warning', 'error']),
   component: _propTypes.default.oneOf(['h1', 'h2', 'h3', 'h4', 'h5', 'h6', 'p', 'span', 'label', 'legend']),
   className: _propTypes.default.node,
   children: _propTypes.default.any
 };
 Text.defaultProps = {
-  underline: false,
-  italic: false,
   component: 'p'
 };

package/package.json

@@ -4,7 +4,7 @@
   "author": {
     "name": "arnymax"
   },
-  "version": "0.2.27",
+  "version": "0.2.30",
   "private": false,
   "keywords": [
     "react",
@@ -30,7 +30,7 @@
     "@testing-library/user-event": "^13.5.0",
     "classnames": "^2.3.2",
     "eslint": "^8.48.0",
-    "pallote-css": "^0.2.41",
+    "pallote-css": "^0.2.52",
     "react": "^18.2.0",
     "react-dom": "^18.2.0",
     "react-router-dom": "^6.15.0",