@loomhq/lens - npm Package Compare versions

Comparing version 3.0.1 to 3.0.2

dist/components/container/container.stories.js

@@ -8,2 +8,3 @@ import _toConsumableArray from "@babel/runtime/helpers/esm/toConsumableArray";
 import { colorsNames } from '../../colors';
+import { ColorDocs, SizesDocs } from '../docs/shared-docs';
 storiesOf('Layout|Container', module).addDecorator(withInfo({
@@ -35,3 +36,5 @@ header: false,
     maxHeight: text('maxHeight')
-  }, "Container"));
+  }, "Container"), React.createElement("div", {
+    className: "storyDocs"
+  }, React.createElement(ColorDocs, null), React.createElement("h2", null, "Padding and size"), React.createElement(SizesDocs, null)));
 });

dist/components/distribute/distribute.stories.js

@@ -8,2 +8,3 @@ import React from 'react';
 import CodeSnippet from '../docs/code-snippet/code-snippet';
+import { SizesDocs, AlignmentDocs } from '../docs/shared-docs';
 storiesOf('Layout|Distribute', module).addDecorator(withInfo({
@@ -38,3 +39,3 @@ header: false,
     className: "storyDocs"
-  }, React.createElement("h2", null, "Gap"), React.createElement("p", null, "Use ", React.createElement("code", null, "gap"), " prop to add space between children."), React.createElement(CodeSnippet, {
+  }, React.createElement("h2", null, "Gap"), React.createElement("p", null, "Use ", React.createElement("code", null, "gap"), " prop to add space between children."), React.createElement(SizesDocs, null), React.createElement(CodeSnippet, {
     component: React.createElement(Distribute, {
@@ -52,3 +53,3 @@ gap: 2
     }))
-  }), React.createElement("h2", null, "Alignment"), React.createElement("p", null, "Use ", React.createElement("code", null, "alignment"), " prop to align children in relation to each other."), React.createElement(CodeSnippet, {
+  }), React.createElement(AlignmentDocs, null), React.createElement(CodeSnippet, {
     component: React.createElement(Distribute, {
@@ -55,0 +56,0 @@ alignment: "center"

dist/components/icon/icon.stories.js

@@ -13,2 +13,3 @@ import _toConsumableArray from "@babel/runtime/helpers/esm/toConsumableArray";
 import { colorsNames } from '../../colors';
+import { ColorDocs } from '../docs/shared-docs';
 import { SvgArrowLeft, SvgArrowRight, SvgArrowUp, SvgArrowDown, SvgChevronUp, SvgChevronDown, SvgMove, SvgFolder, SvgFolderShared, SvgPlus, SvgStar, SvgBell, SvgCross, SvgExternal, SvgRestart, SvgTeam, SvgCheck, SvgDownload, SvgOptions, SvgShare, SvgTrash, SvgGlobe, SvgStop, SvgPause, SvgRecord, SvgPicture, SvgPlay, SvgFullscreen, SvgFullscreenExit, SvgGear, SvgLink, SvgClick, SvgOneTimes, SvgOneDotFiveTimes, SvgTwoTimes, SvgUpload, SvgVolumeHigh, SvgVolumeLow, SvgMute, SvgWideScreen, SvgFastForwardFive, SvgRewindFive, SvgSearch, SvgArchive, SvgPencil, SvgScissors } from './icons';
@@ -171,3 +172,3 @@ export var availableIcons = [{
     className: "storyDocs"
-  }, React.createElement("h2", null, "Full icon set"), React.createElement(Spacer, {
+  }, React.createElement("h2", null, "Import"), React.createElement("p", null, "Import:"), React.createElement("code", null, "import {Icon, SvgFolder} from '@loomhq/lens'"), React.createElement("p", null, "Usage:"), React.createElement("code", null, "<Icon icon={<SvgFolder />} />'"), React.createElement("h2", null, "Full icon set"), React.createElement(Spacer, {
     isInline: true
@@ -192,10 +193,4 @@ }, Object.values(availableIcons).map(function (item, index) {
     }, item.title));
-  })), React.createElement(CodeSnippet, {
-    variant: "showCode",
-    title: "Import",
+  })), React.createElement(ColorDocs, null), React.createElement(CodeSnippet, {
     component: React.createElement(Icon, {
-      icon: React.createElement(SvgFolder, null)
-    })
-  }), React.createElement("h2", null, "Color"), React.createElement(CodeSnippet, {
-    component: React.createElement(Icon, {
       color: "salmon",
@@ -202,0 +197,0 @@ icon: React.createElement(SvgPicture, null)

dist/components/layout/layout.js

@@ -9,3 +9,3 @@ import _classCallCheck from "@babel/runtime/helpers/esm/classCallCheck";
 function _templateObject2() {
-  var data = _taggedTemplateLiteral(["\n  min-width: 0px;\n  min-height: 0px;\n  flex-shrink: 0;\n  ", ";\n  ", ";\n  ", ";\n"]);
+  var data = _taggedTemplateLiteral(["\n  min-width: 0px;\n  flex-shrink: 0;\n  ", ";\n  ", ";\n  ", ";\n"]);
 
@@ -20,3 +20,3 @@ _templateObject2 = function _templateObject2() {
 function _templateObject() {
-  var data = _taggedTemplateLiteral(["\n  display: flex;\n  flex-direction: ", ";\n  align-items: ", ";\n  ", ";\n\n  .LayoutSectionWrapper {\n    &:not(:last-child) {\n      ", ";\n    }\n  }\n"]);
+  var data = _taggedTemplateLiteral(["\n  display: flex;\n  align-items: ", ";\n\n  .LayoutSectionWrapper {\n    &:not(:last-child) {\n      ", ";\n    }\n  }\n"]);
 
@@ -39,9 +39,5 @@ _templateObject = function _templateObject() {
 var LayoutWrapper = styled.div(_templateObject(), function (props) {
-  return props.direction;
-}, function (props) {
   return alignments[props.alignment];
 }, function (props) {
-  return props.direction === 'column' && 'align-items: stretch';
-}, function (props) {
-  return props.gap && getSize(props.direction === 'column' ? 'margin-bottom' : 'margin-right', props.gap);
+  return props.gap && getSize('margin-right', props.gap);
 });
@@ -57,4 +53,3 @@ var LayoutSectionWrapper = styled.div(_templateObject2(), function (props) {
 var LayoutSection = function LayoutSection(_ref) {
-  var direction = _ref.direction,
-      width = _ref.width,
+  var width = _ref.width,
       maxWidth = _ref.maxWidth,
@@ -64,3 +59,2 @@ children = _ref.children;
     className: "LayoutSectionWrapper",
-    direction: direction,
     width: width,
@@ -67,0 +61,0 @@ maxWidth: maxWidth

dist/components/layout/layout.stories.js

@@ -0,1 +1,13 @@
+import _taggedTemplateLiteral from "@babel/runtime/helpers/esm/taggedTemplateLiteral";
+
+function _templateObject() {
+  var data = _taggedTemplateLiteral(["\n  #story-root + div {\n    h1 + div ~ div h3,\n    h1 + div ~ div small,\n    h1 + div small,\n    h1 + div h3 {\n      display: block;\n    }\n  }\n"]);
+
+  _templateObject = function _templateObject() {
+    return data;
+  };
+
+  return data;
+}
+
 import React from 'react';
@@ -6,4 +18,6 @@ import { storiesOf } from '@storybook/react';
 import DemoBox from '../docs/demo-box/demo-box';
-import CodeSnippet from '../docs/code-snippet/code-snippet';
-import Layout, { availableDirections, availableAlignments } from './layout';
+import Layout from './layout';
+import { SizesDocs, AlignmentDocs } from '../docs/shared-docs';
+import { createGlobalStyle } from 'styled-components';
+var StoryLocalStyles = createGlobalStyle(_templateObject());
 storiesOf('Layout|Layout', module).addDecorator(withInfo({
@@ -13,3 +27,3 @@ header: false,
   source: false,
-  propTablesExclude: [DemoBox],
+  propTablesExclude: [DemoBox, SizesDocs, StoryLocalStyles, AlignmentDocs],
   styles: function styles() {
@@ -21,3 +35,3 @@ return {
 })).add('Layout', function () {
-  return React.createElement("div", null, React.createElement(DemoBox, {
+  return React.createElement("div", null, React.createElement(StoryLocalStyles, null), React.createElement(DemoBox, {
     boxType: "outline"
@@ -38,3 +52,3 @@ }, React.createElement(Layout, {
     className: "storyDocs"
-  }, "\u2014"));
+  }, React.createElement("h2", null, "Gap and dimentions"), React.createElement(SizesDocs, null), React.createElement(AlignmentDocs, null)));
 });

dist/components/spacer/spacer.stories.js

@@ -9,2 +9,3 @@ import React from 'react';
 import Button from '../button/button';
+import { SizesDocs } from '../docs/shared-docs';
 storiesOf('Layout|Spacer', module).addDecorator(withInfo({
@@ -37,3 +38,3 @@ header: false,
     className: "storyDocs"
-  }, React.createElement("h2", null, "Spacing"), React.createElement("p", null, "Use ", React.createElement("code", null, "left"), ", ", React.createElement("code", null, "right"), ", ", React.createElement("code", null, "top"), " and ", React.createElement("code", null, "bottom"), " to create space between components."), React.createElement("p", null, "For the spacing, use a unit number, for example, use ", React.createElement("code", null, "2"), " to create a ", React.createElement("code", null, "16px"), " spacing."), React.createElement(CodeSnippet, {
+  }, React.createElement("h2", null, "Spacing"), React.createElement("p", null, "Use ", React.createElement("code", null, "left"), ", ", React.createElement("code", null, "right"), ", ", React.createElement("code", null, "top"), " and ", React.createElement("code", null, "bottom"), " to create space between components."), React.createElement(SizesDocs, null), React.createElement(CodeSnippet, {
     component: React.createElement("div", null, React.createElement(Spacer, {
@@ -40,0 +41,0 @@ right: 1,

dist/components/text/text.stories.js

@@ -11,2 +11,3 @@ import _toConsumableArray from "@babel/runtime/helpers/esm/toConsumableArray";
 import { colorsNames } from '../../colors';
+import { ColorDocs } from '../docs/shared-docs';
 storiesOf('Components|Text', module).addDecorator(withInfo({
@@ -48,3 +49,3 @@ header: false,
     }))
-  }), React.createElement("h2", null, "Color"), React.createElement("p", null, "Any color can be applied to ", React.createElement("code", null, "Text"), " component."), React.createElement(CodeSnippet, {
+  }), React.createElement(ColorDocs, null), React.createElement(CodeSnippet, {
     component: React.createElement(Text, {
@@ -51,0 +52,0 @@ color: "salmon"

package.json

 {
   "name": "@loomhq/lens",
-  "version": "3.0.1",
+  "version": "3.0.2",
   "scripts": {
@@ -5,0 +5,0 @@ "start": "start-storybook -p 6006",

New alerts

License Policy Violation

License

This package is not allowed per your license policy. Review the package's license to ensure compliance.

Found 1 instance in 1 package

Fixed alerts

License Policy Violation

License

This package is not allowed per your license policy. Review the package's license to ensure compliance.

Found 1 instance in 1 package

Improved metrics

Total package byte prevSize

119831

increased by1.67%

Number of package files

82

increased by1.23%

Lines of code

2917

increased by0.62%

Worsened metrics

Number of maintainers

107

decreased by-0.93%

No dependency changes